用玩笑测试 angular 个组件给出 resolveComponentResources

Question

我正在尝试通过 jest-preset-angular

开玩笑地测试 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-安装笑话依赖项 3-创建笑话配置文件 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'
   }
};