Как сделать доступ к внедренному ngControl из модульных тестов? Как устранить ошибку?
В компоненте
constructor(
@Self() @Optional() public ngControl: NgControl
) { }
ngOnInit(): void {
this.ngControl.valueChanges
В модульном тесте
beforeEach(() => {
fixture = TestBed.createComponent(component);
fixture.detectChanges();
При выполнении теста получить ошибку
TypeError: Cannot read property 'valueChanges' of null





Работает с:
beforeEach(() => {
fixture = TestBed.createComponent(сomponent);
(fixture.componentInstance as any).ngControl = new FormControl();
У меня была такая же проблема, и я решил ее, используя фиктивный объект для NgControl.
Определите фиктивный объект ...
let formControlSpy: jasmine.SpyObj<NgControl>;
formControlSpy = jasmine.createSpyObj('NgControl', ['value']);
Предоставьте макет для внедрения компонентов ...
TestBed.configureTestingModule({
providers: [
TestComponent,
{ provide: NgControl, useValue: formControlSpy }
]
});
injector = getTestBed();
component = injector.get(PasswordFormControlComponent);
Затем настройте необходимое значение элемента управления ...
beforeEach(() => formControlSpy.value.and.returnValue('value'));
В зависимости от того, что вы хотите сделать с элементом управления, если вы просто хотите устранить ошибку, вы можете предоставить NgControl следующим образом:
beforeEach(async(() => {
TestBed.configureTestingModule({
...
providers: [
{ provide: NgControl, useValue: new FormControl() },
]
...
})
.compileComponents()
}))
Я решил это, переопределив
beforeEach(async () => {
const NG_CONTROL_PROVIDER = {
provide: NgControl,
useClass: class extends NgControl {
control = new FormControl();
viewToModelUpdate() {}
},
};
await TestBed.configureTestingModule({
declarations: [YourComponentName],
imports: [FormsModule],
})
.overrideComponent(YourComponentName, {
add: { providers: [NG_CONTROL_PROVIDER] },
})
.compileComponents();
});