Angular с Jest - TypeError: Невозможно прочитать свойство 'ngModule' из null - PullRequest
Новая
       16

Angular с Jest - TypeError: Невозможно прочитать свойство 'ngModule' из null

1 голос
/ 29 марта 2020

Issue

Я хочу настроить Jest-тестирование для моего Angular приложения. Поэтому я следовал инструкции для jest-preset- angular. Но когда я тестирую приложение с помощью Bazel ( эта цель ), я получаю следующую ошибку: 

FAIL services/client/src/app/app.component.spec.ts
  ● AppComponent › should create the app

    TypeError: Cannot read property 'ngModule' of null

      at isModuleWithProviders (../packages/core/src/render3/jit/module.ts:530:37)
      at expandModuleWithProviders (../packages/core/src/render3/jit/module.ts:523:7)
          at Array.map (<anonymous>)
      at Function.get (../packages/core/src/render3/jit/module.ts:124:29)
      at getNgModuleDef (../packages/core/src/render3/definition.ts:761:27)
      at verifySemanticsOfNgModuleDef (../packages/core/src/render3/jit/module.ts:183:19)
      at Function.get (../packages/core/src/render3/jit/module.ts:147:22)
      at R3TestBedCompiler.Object.<anonymous>.R3TestBedCompiler.applyProviderOverridesToModule (../../packages/core/testing/src/r3_test_bed_compiler.ts:398:49)
      at R3TestBedCompiler.Object.<anonymous>.R3TestBedCompiler.compileTestModule (../../packages/core/testing/src/r3_test_bed_compiler.ts:622:10)
      at R3TestBedCompiler.Object.<anonymous>.R3TestBedCompiler.finalize (../../packages/core/testing/src/r3_test_bed_compiler.ts:243:10)
      at TestBedRender3.get [as testModuleRef] (../../packages/core/testing/src/r3_test_bed.ts:371:43)
      at TestBedRender3.Object.<anonymous>.TestBedRender3.inject (../../packages/core/testing/src/r3_test_bed.ts:270:25)
      at TestBedRender3.Object.<anonymous>.TestBedRender3.createComponent (../../packages/core/testing/src/r3_test_bed.ts:326:40)
      at Function.Object.<anonymous>.TestBedRender3.createComponent (../../packages/core/testing/src/r3_test_bed.ts:176:33)
      at services/client/src/app/app.component.spec.ts:14:29
      at ZoneDelegate.Object.<anonymous>.ZoneDelegate.invoke (../npm/node_modules/zone.js/dist/zone.js:386:30)
      at ProxyZoneSpec.Object.<anonymous>.ProxyZoneSpec.onInvoke (../npm/node_modules/zone.js/dist/proxy.js:117:43)
      at ZoneDelegate.Object.<anonymous>.ZoneDelegate.invoke (../npm/node_modules/zone.js/dist/zone.js:385:36)
      at Zone.Object.<anonymous>.Zone.run (../npm/node_modules/zone.js/dist/zone.js:143:47)

, которая исходит из этой строки моего теста: 

const fixture = TestBed.createComponent(AppComponent);

Попробуйте сами

Вы можете попробовать сами, например: 

git clone https://github.com/flolu/cents-ideas
cd cents-ideas
git checkout 518ced3353083891a2707a322b9e7884034bcf44
yarn install
yarn client:test

Подробности

Цель Bazel, которая запускает тест: 

jest_test(
    name = "test",
    srcs = glob(include = [
        "**/*.ts",
        "tsconfig.json",
        "tsconfig.spec.json",
    ]) + ["//services/client/src:src_fies"],
    jest_config = "//:jest.angular.config.js",
    deps = [
        "//:package.json",
        "//packages/enums:lib",
        "@npm//@angular/core",
        "@npm//@angular/router",
        "@npm//@types/jest",
        "@npm//date-fns",
        "@npm//jest-preset-angular",
        "@npm//ts-jest",
        "@npm//typescript",
    ],
)

Файл конфигурации Jest: 

module.exports = {
  globals: {
    'ts-jest': {
      packageJson: '<rootDir>/package.json',
      tsConfig: '<rootDir>/services/client/tsconfig.spec.json',
      stringifyContentPathRegex: '\\.html$',
      astTransformers: [
        'jest-preset-angular/build/InlineFilesTransformer',
        'jest-preset-angular/build/StripStylesTransformer',
      ],
    },
  },
  transform: {
    '^.+\\.(ts|js|html)$': 'ts-jest',
  },
  moduleFileExtensions: ['ts', 'html', 'js', 'json'],
  moduleNameMapper: {
    '^src/(.*)$': '<rootDir>/services/client/src/$1',
    '^app/(.*)$': '<rootDir>/services/client/src/app/$1',
    '^assets/(.*)$': '<rootDir>/services/client/src/assets/$1',
    '^environments/(.*)$': '<rootDir>/src/environments/$1',
    '^@cents-ideas/utils(.*)$': '<rootDir>/packages/utils$1',
    '^@cents-ideas/event-sourcing(.*)$': '<rootDir>/packages/event-sourcing$1',
    '^@cents-ideas/enums(.*)$': '<rootDir>/packages/enums$1',
    '^@cents-ideas/models(.*)$': '<rootDir>/packages/models$1',
  },
  transformIgnorePatterns: ['node_modules/(?!@ngrx)'],
  snapshotSerializers: [
    'jest-preset-angular/build/AngularSnapshotSerializer.js',
    'jest-preset-angular/build/HTMLCommentSerializer.js',
  ],
  preset: 'jest-preset-angular',
  setupFilesAfterEnv: [
    //'jest-preset-angular',
    '<rootDir>/services/client/src/setupJest.ts',
  ],
  modulePathIgnorePatterns: ['/node_modules/', '/services/frontend/'],
};

1 Ответ

0 голосов
/ 10 апреля 2020

У меня была точная проблема, описанная. Это закончилось тем, что стало проблемой с импортом барреля. Чтобы исправить это, я должен был удалить все импорт стволов и глубоко импортировать все файлы.

пример старого: 

import {
  Example1,
  Example2
} from 'path/to/example-folder';

пример нового: 

import { Example1 } from 'path/to/example1-file';
import { Example2 } from 'path/to/example2-file';
...