我无法正确配置 jest 以导入模块 (setupFilesAfterEnv)

I cannot configure jest properly to import modules (setupFilesAfterEnv)

我正在使用 @angular-builders/jest 以便在测试 angular 项目时用笑话代替业力。 我喜欢为开玩笑获得额外的匹配器的 2 个库:jest-extended@testing-library/jest-dom.

我找不到自动导入匹配器的方法,这样我就不必在每个规范文件中导入它们。

重现 jest-extended

问题的最小示例

首先,创建一个angular项目并安装jest依赖项

ng new --defaults my-project
cd my-project
yarn add -D jest @types/jest @angular-builders/jest jest-extended

然后编辑 angular.json 以替换生成器

...
"test": {
    "builder": "@angular-builders/jest:run"
},

到目前为止,我可以 运行 并使用 jest 和命令通过测试

ng test

现在我添加一个使用 jest-extended 匹配器之一的测试。在 app.component.spec.ts:

...
  it('should work with jest-extended matchers', () => {
    expect([1, 1, 1]).toBeArrayOfSize(3);
  });

尝试 #1

创建jest.config.js

module.exports = {
  setupFilesAfterEnv: [
    'jest-extended',
  ],
};

不起作用,出现错误 TS2339: Property 'toBeArrayOfSize' does not exist on type 'ArrayLikeMatchers<number>'

尝试#2

使用中间安装文件;创建 jest.config.js

module.exports = {
  setupFilesAfterEnv: [
    'my-jest-setup.ts',
  ],
};

my-jest-setup.ts

import 'jest-extended'

有效!测试通过...但是只要我在我的规范文件中更改某些内容

...
  it('should work with jest-extended matchers', () => {
    expect([1, 1, 1]).toBeArrayOfSize(3);
    expect(true).toBeTruthy();
  });

和 运行 再次测试,我得到与尝试 #1 相同的错误。我怀疑是缓存问题

解决方法

使用尝试 #2 并在每个 运行 和

之前清除笑话缓存
ng test --clearCache && ng test

我不喜欢这个解决方案,因为缓存旨在加快速度,当有很多规范文件时,每次清除缓存都会产生敏感影响。此外,我不认为在手表模式下使用玩笑时可以清除缓存

抱歉,这篇文章有点长,感谢您能看完

我想我找到了解决办法。诀窍是简单地在 jest.config.js

中启用 ts-jest 选项
module.exports = {
  setupFilesAfterEnv: ['jest-extended'],
  globals: {
    'ts-jest': {
      isolatedModules: true,
    },
  },
};

我不得不承认我不明白这个选项的目标,因此,任何启发将不胜感激。

作为奖励,测试执行速度更快。

到目前为止没有明显的缺陷,但如果发生奇怪的事情,我会通知您。

希望对您有所帮助

编辑:实际的缺点是当 ts-jest 为 运行 测试编译时我们松散了类型检查。 isolatedModules 选项的目标在 ts-jest documentation

中解释

我终于找到了我认为正确的解决方案。从 最小示例开始,用 jest-extended

重现问题
  1. 创建 jest.config.js 文件(尝试 1 终于有了一个好的开始)
module.exports = {
  setupFilesAfterEnv: [
    'jest-extended',
  ],
};
  1. 编辑 tsconfig.spec.json 并将 "types": ["jasmine", "node"] 替换为 "types": ["jest", "node", "jest-extended"]
{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "outDir": "./out-tsc/spec",
    "types": ["jest", "node", "jest-extended"] // <==== what was missing
  },
  "files": ["src/test.ts", "src/polyfills.ts"],
  "include": ["src/**/*.spec.ts", "src/**/*.d.ts"]
}

瞧瞧。这实际上会在编译中包含 jestjest-extended 声明文件。我现在得到了 TypeScript 类型检查的所有好处和缓存的速度改进(显然第一个 运行 除外)。

希望对您有所帮助