Я настраиваю модульное тестирование для нашего унифицированного проекта Ionic4 (получение интерактивной справки и исследований - это ожидаемая часть проекта), и у меня возникают проблемы с прохождением всех тестов "create component" в Karma.Я не писал никаких тестов сам, поэтому только пытаюсь разобраться во всех ошибках, сгенерированных автоматически сгенерированными.
Проблема заключается в том, что некоторые компоненты выдают следующую ошибку: «Uncaught Error: Uncaught (в обещании): Ошибка: Нет доступа к значению для элемента управления формы с именем: X», X является полем формы в полностьюдругой компонент (какие тесты проходят нормально).Эта ошибка возникает, только если я запускаю все тесты.Если я запускаю именно те, которые не работают, они пройдут без проблем.
Я пытался исследовать проблему и сообщение об ошибке, но пока не нашел ничего, связанного с моей конкретной проблемой.Проблема в том, что в 2 из 3 компонентов, которые жалуются, нет формы, а в 3-м жалобы касаются полей в другом компоненте.
Это сообщение об ошибке для компонента Event:
Uncaught Error: Uncaught (in promise): Error: No value accessor for form control with name: 'username'
Error: No value accessor for form control with name: 'username'
at te (webpack:///node_modules/@angular/forms/fesm5/forms.js:2144 <- test-config/karma-test-shim.js:2092:1740)
at J (webpack:///node_modules/@angular/forms/fesm5/forms.js:2054 <- test-config/karma-test-shim.js:2092:117)
at webpack:///node_modules/@angular/forms/fesm5/forms.js:4337 <- test-config/karma-test-shim.js:2106:16703
at e.invoke (webpack:///node_modules/zone.js/dist/zone.js:391 <- test-config/karma-test-shim.js:2140:7006)
at e.onInvoke (webpack:///node_modules/zone.js/dist/async-test.js:106 <- test-config/karma-test-shim.js:2290:1819)
at e.onInvoke (webpack:///node_modules/zone.js/dist/proxy.js:126 <- test-config/karma-test-shim.js:2253:2259)
at e.invoke (webpack:///node_modules/zone.js/dist/zone.js:390 <- test-config/karma-test-shim.js:2140:6946)
at Object.onInvoke (webpack:///node_modules/@angular/core/fesm5/core.js:17299 <- test-config/karma-test-shim.js:600:1161)
at e.invoke (webpack:///node_modules/zone.js/dist/zone.js:390 <- test-config/karma-test-shim.js:2140:6946)
at t.run (webpack:///node_modules/zone.js/dist/zone.js:150 <- test-config/karma-test-shim.js:2140:2205)
at webpack:///node_modules/zone.js/dist/zone.js:889 <- test-config/karma-test-shim.js:2140:13729
at e.invokeTask (webpack:///node_modules/zone.js/dist/zone.js:423 <- test-config/karma-test-shim.js:2140:7690)
at e.onInvokeTask (webpack:///node_modules/zone.js/dist/async-test.js:90 <- test-config/karma-test-shim.js:2290:1616)
at e.onInvokeTask (webpack:///node_modules/zone.js/dist/proxy.js:157 <- test-config/karma-test-shim.js:2253:2880)
at e.invokeTask (webpack:///node_modules/zone.js/dist/zone.js:422 <- test-config/karma-test-shim.js:2140:7611)
at Object.onInvokeTask (webpack:///node_modules/zone.js/dist/zone.js:304 <- test-config/karma-test-shim.js:2140:4663)
at e.invokeTask (webpack:///node_modules/zone.js/dist/zone.js:422 <- test-config/karma-test-shim.js:2140:7611)
at Object.onInvokeTask (webpack:///node_modules/@angular/core/fesm5/core.js:17290 <- test-config/karma-test-shim.js:600:1073)
at e.invokeTask (webpack:///node_modules/zone.js/dist/zone.js:422 <- test-config/karma-test-shim.js:2140:7611)
at t.runTask (webpack:///node_modules/zone.js/dist/zone.js:195 <- test-config/karma-test-shim.js:2140:2868)
at v (webpack:///node_modules/zone.js/dist/zone.js:601 <- test-config/karma-test-shim.js:2140:9981)
at t.invokeTask [as invoke] (webpack:///node_modules/zone.js/dist/zone.js:502 <- test-config/karma-test-shim.js:2140:8826)
at y (webpack:///node_modules/zone.js/dist/zone.js:1744 <- test-config/karma-test-shim.js:2171:631)
at g (webpack:///node_modules/zone.js/dist/zone.js:1770 <- test-config/karma-test-shim.js:2171:873) thrown
Это .ts для события:
export class EventPage implements OnInit {
activity: any;
allEvents = [];
constructor(private router: Router, private authService: AuthService, private activityService: ActivityService, private dataService: DataService) {
}
ngOnInit() {
this.activityService.getAllActivities().subscribe(data => this.allEvents = data);
this.activity = 'all-activities';
}
loadEvent(activity) {
this.dataService.setData('activity', activity);
this.router.navigateByUrl('/specific-event/activity');
}
goToCreateEvent() {
this.router.navigate(['create-event']);
}
segmentChanged(event) {
this.activity = event.target.value;
}
}
.spec.ts:
import {CUSTOM_ELEMENTS_SCHEMA, TemplateRef, ViewContainerRef} from '@angular/core';
import {async, ComponentFixture, TestBed} from '@angular/core/testing';
import {EventPage} from './event.page';
import {Router} from '@angular/router';
import {AuthService} from '../../services/authentication-service/auth.service';
import {ActivityService} from '../../services/activity-service/activity.service';
import {DataService} from '../../services/data.service';
import {SharedDirectivesModule} from '../../directives/shared-directives.module';
import {HasRoleDirective} from '../../directives/has-role.directive';
import {CommonModule} from '@angular/common';
import {UserService} from '../../services/user-service/user.service';
import {ActivityServiceMock, UserServiceMock} from '../../../../test-config/mocks-ionic';
describe('EventPage', () => {
let component: EventPage;
let fixture: ComponentFixture<EventPage>;
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [SharedDirectivesModule],
declarations: [EventPage],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
providers: [
{provide: Router, useValue: null},
{provide: AuthService, useValue: null},
{provide: ActivityService, useValue: new ActivityServiceMock()},
{provide: DataService, ueValue: null},
{provide: UserService, useValue: new UserServiceMock()},
{provide: TemplateRef, useValue: null},
{provide: ViewContainerRef, useValue: null}]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(EventPage);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
И это форма из регистра компонента, который имеетполе, запрашиваемое в Event:
<form>
...
<ion-item>
<ion-input name="username" placeholder="Username" type="username" ngModel required
[(ngModel)]="username"></ion-input>
</ion-item>
<ion-item>
<ion-input name="displayname" placeholder="Displayname" type="username" ngModel required
[(ngModel)]="displayname"></ion-input>
</ion-item>
...
</form>