angular - 用 jest 测试 Angular 组件给出了resolveComponentResources

Question

我正在尝试通过 jest-preset-angular 使用 jest 测试 Angular 组件

它可以通过 karma 和 ng test 运行测试， 但通过 jest 运行相同的测试会出现错误

AppComponent › should create the app

    Component 'AppComponent' is not resolved:
     - templateUrl: ./app.component.html
     - styleUrls: ["./app.component.scss"]
    Did you run and wait for 'resolveComponentResources()'?

reproduction

创建此复制品的步骤(请参阅 git 提交了解步骤)

1-生成一个新的 Angular 项目ng new myproject 2-安装jest依赖项 3-创建jest配置文件 4-复制并修改src/app/app.component.spec.ts为app.component.spec.jest.ts

运行复制

通过 karma 运行 npm t 或 ng test 测试 app.component.spec.ts 文件 然后运行 ​​npm run test:jest 来通过 jest 测试 app.component.spec.jest.ts

Answer 1

问题详情如下:https://github.com/thymikee/jest-preset-angular/issues/951

就我而言，当我在 jest.config.js 中添加以下内容时，它就起作用了:

module.exports = {
  transform: {
    '^.+\\.(ts|js|html)$': 'jest-preset-angular'
  },
};

他们还建议在 jest.preset.js 中进行设置，但这对我来说没有必要......

const nxPreset = require('@nrwl/jest/preset');

module.exports = {
   ...nxPreset,
   testEnvironment: 'jsdom',
   transform: {
      '^.+\\.(ts|js|html)$': 'jest-preset-angular'
   }
};