如何模拟传递到方法中的ElementRef

Question

我想为接收ElementRef的方法编写一个测试。我找不到嘲笑ElementRef的方法，有人能帮忙吗？非常感谢！

exampleService.service.ts：

export class exampleService {
exampleMethod(elRef: ElementRef): string {
const elWidth = elRef.nativeElement.offsetWidth;
return elWidth;
}
}

testfile.service.spec.ts：

describe('ExampleService', () => {
let service: ExampleService;
beforeEach(() => { 
service = TestBed.inject(ExampleService);
});
it('How to mock the ELEMENTREF?', () => {
expect(service.exampleMethod(ELEMENTREF)).toBe('100');
});
});

Answer 1

您可以创建具有必要属性和方法的对象，这些属性和方法需要与ElementRef对象一起使用：

const mockElementRef: any = {
nativeElement: {
offsetWidth: 100
}
};

beforeEach(async(() => TestBed.configureTestingModule({
imports: [ ... ],
declarations: [ Component ],
providers: [
{ provide: ElementRef, useValue: mockElementRef }
],
schemas: [ NO_ERRORS_SCHEMA ]
}).compileComponents()));

.......

it('How to mock the ELEMENTREF?', () => {
expect(service.exampleMethod(mockElementRef)).toBe('100');
});