如何解决render2 依赖注入错误的原因是什么?
我正在使用,
angular@10.2.2
angular-cli@10.2.0.
我在进行角度属性测试时遇到问题。
这是运行 2**53 + 1
时在终端中显示的错误。
ng test
这是highlight.directive.ts
No captured browser,open http://localhost:9876/
03 01 2021 19:23:43.285:INFO [karma-server]: Karma v5.0.9 server started at http://0.0.0.0:9876/
03 01 2021 19:23:43.286:INFO [launcher]: Launching browsers Chrome with concurrency unlimited
03 01 2021 19:23:43.289:INFO [launcher]: Starting browser Chrome
ERROR in src/app/directives/highlight.directive.spec.ts:8:23 - error TS2554: Expected 2 arguments,but got 0.
8 const directive = new HighlightDirective();
~~~~~~~~~~~~~~~~~~~~~~~~
src/app/directives/highlight.directive.ts:8:15
8 constructor(private renderer: Renderer2,~~~~~~~~~~~~~~~~~~~~~~~~~~~
An argument for 'renderer' was not provided.
03 01 2021 19:23:48.538:INFO [Chrome 87.0.4280.88 (Linux x86_64)]: Connected on socket Me54exbEfYncHxGgAAAA with id 64136440
Chrome 87.0.4280.88 (Linux x86_64): Executed 0 of 0 SUCCESS (0.032 secs / 0 secs)
TOTAL: 0 SUCCESS
TOTAL: 0 SUCCESS
这是highlight.directive.spec.ts
import { Directive,ElementRef,Renderer2,HostListener } from '@angular/core';
@Directive({
selector: '[appHighlight]'
})
export class HighlightDirective {
constructor(private renderer: Renderer2,private el: ElementRef) { }
// tslint:disable-next-line: typedef
@HostListener('mouseenter') onMouseEnter() {
this.renderer.addClass(this.el.nativeElement,'hightlight');
}
// tslint:disable-next-line: typedef
@HostListener('mouseleave') onMouseLeave() {
this.renderer.removeClass(this.el.nativeElement,'hightlight');
}
}
在 /* tslint:disable:no-unused-variable */
import { Testbed,async } from '@angular/core/testing';
import { HighlightDirective } from './highlight.directive';
describe('Directive: Highlight',() => {
it('should create an instance',() => {
const directive = new HighlightDirective();
expect(directive).toBeTruthy();
});
});
之后,karma 会打开一个 chrome 浏览器窗口,结果显示为完全空白。
可能是什么问题?
解决方法
试试
let rendererMock = jasmine.createSpyObj('rendererMock',['selectRootElement','createElement','createViewRoot','createText','setElementProperty','setElementAttribute','setText','setBindingDebugInfo','createTemplateAnchor','projectNodes','attachViewAfter','detachView','destroyView','listen','listenGlobal','setElementClass','setElementStyle','invokeElementMethod','animate']);
let rootRendererMock = {
renderComponent: () => {
return rendererMock;
}
};
TestBed.configureTestingModule({
declarations: [MainComponent],schemas: [NO_ERRORS_SCHEMA],providers: [
{ provide: RootRenderer,useValue: rootRendererMock }
]
});
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。