Карма + Жасмин: невозможно прочитать свойство 'getComponentFromError'
Я следую этому руководству: https://angular.io/guide/testing для юнит-тестирования карма + жасмин. Вот мой код:
import { AppComponent } from "./app.component";
import { ComponentFixture, TestBed } from "@angular/core/testing";
describe('AppComponent', () => {
let component: AppComponent;
let fixture: ComponentFixture<AppComponent>;
let h1: HTMLElement;
beforeEach(() => {
TestBed.configureTestingModule({
declarations: [ AppComponent ],
});
fixture = TestBed.createComponent(AppComponent);
component = fixture.componentInstance;
h1 = fixture.nativeElement.querySelector('h1');
});
it('should display original title', () => {
expect(h1.textContent).toContain("Ciao");
});
});
Когда я запускаю тест, я получаю следующее исключение:
TypeError: Cannot read property 'getComponentFromError' of null
at TestBed._initIfNeeded (D:/Users/apwzp/AppData/Local/Temp/karma-typescript-bundle-11944DDd01l2f5Y0P.js:1020:52)
at TestBed.createComponent (D:/Users/apwzp/AppData/Local/Temp/karma-typescript-bundle-11944DDd01l2f5Y0P.js:1174:14)
at Function.TestBed.createComponent (D:/Users/apwzp/AppData/Local/Temp/karma-typescript-bundle-11944DDd01l2f5Y0P.js:876:29)
at UserContext.<anonymous> (assets/app/app.component.spec.ts:14:20 <- assets/app/app.component.spec.js:13:37)
at ZoneDelegate.invoke (node_modules/zone.js/dist/zone.js:388:26)
at ProxyZoneSpec.onInvoke (node_modules/zone.js/dist/proxy.js:79:39)
at ZoneDelegate.invoke (node_modules/zone.js/dist/zone.js:387:32)
at Zone.run (node_modules/zone.js/dist/zone.js:138:43)
at UserContext.<anonymous> (node_modules/zone.js/dist/jasmine-patch.js:106:34)
Кто-нибудь знает как это решить?
4 ответа
Я столкнулся с чем-то похожим и нашел ответ здесь: Не могу прочитать свойство 'инжектор' нулевого углового жасмина 2.
Я только добавил это к моему beforeEach()
метод, который решил эту ошибку для меня (было несколько других, которые я должен был преодолеть, прежде чем я получил все это работает полностью).
TestBed.resetTestEnvironment();
TestBed.initTestEnvironment(BrowserDynamicTestingModule,
platformBrowserDynamicTesting());
В основном это было просто вопрос изменения этого:
beforeEach(() => {
TestBed.configureTestingModule({
declarations: [ AppComponent ],
});
fixture = TestBed.createComponent(AppComponent);
component = fixture.componentInstance;
h1 = fixture.nativeElement.querySelector('h1');
});
к
import { BrowserDynamicTestingModule,
platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing';
beforeEach(() => {
TestBed.resetTestEnvironment();
TestBed.initTestEnvironment(BrowserDynamicTestingModule,
platformBrowserDynamicTesting());
TestBed.configureTestingModule({
declarations: [ AppComponent ],
});
fixture = TestBed.createComponent(AppComponent);
component = fixture.componentInstance;
h1 = fixture.nativeElement.querySelector('h1');
});
Если вы переходите на
jest-preset-angular
версия>= 9, заменив
import 'jest-preset-angular';
с
import 'jest-preset-angular/setup-jest';
похоже, решает проблему без необходимости добавлять
beforeAll
к каждому тесту.
Вам нужно запустить свои угловые тесты жасмина с помощью:
ng test
Это будет использовать конфигурацию в src/test.ts и автоматически перезапустит ваши тесты в фоновом режиме.
Просто добавьте это в
setupJest.ts
в корневой папке:
import {TestBed} from '@angular/core/testing';
import {BrowserDynamicTestingModule, platformBrowserDynamicTesting} from '@angular/platform-browser-dynamic/testing';
TestBed.resetTestEnvironment();
TestBed.initTestEnvironment(BrowserDynamicTestingModule,
platformBrowserDynamicTesting());
А затем добавьте это в конфигурацию шутки:
"setupFilesAfterEnv": [
"<rootDir>/setupJest.ts"
],