Карма + Жасмин: невозможно прочитать свойство '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 к каждому тесту.

См. Https://github.com/thymikee/jest-preset-angular/blob/a4251dd9776fe4d99af828b43acc3ea3a1bb5f90/CHANGELOG.md#breaking-changes

Вам нужно запустить свои угловые тесты жасмина с помощью:

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"
],
Другие вопросы по тегам