问题描述
我正在使用@angular-builders/jest
以便在测试有角度的项目时用笑话代替业力.我想通过2个库来获得更多的笑话匹配器:jest-extended
和@testing-library/jest-dom
.
I am using @angular-builders/jest
in order to replace karma by jest when testing angular projects.There are 2 libraries that I like to get extra matchers for jest: jest-extended
and @testing-library/jest-dom
.
我找不到自动导入匹配器的方法,因此不必在每个规格文件中导入它们.
I cannot find a way to import automatically the matchers so that I don't have to import them in each spec file.
用于重现jest-extended
minimal example to reproduce the problem with jest-extended
首先,创建一个有角度的项目并安装玩笑依赖项
First, create an angular project and install jest dependencies
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"
},
到目前为止,我可以使用带命令的笑话来运行并通过测试
So far, I can run and pass the tests using jest with command
ng test
现在,我使用一个用笑话扩展的匹配器添加一个测试.在app.component.spec.ts
:
Now I add a test using one of the jest-extended matchers. In 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
use an intermediate setup file; create jest.config.js
module.exports = {
setupFilesAfterEnv: [
'my-jest-setup.ts',
],
};
与my-jest-setup.ts
import 'jest-extended'
行!测试通过...但是,只要我更改规范文件中的内容
Works! Test passes... BUT as soon as I change something in my spec file
...
it('should work with jest-extended matchers', () => {
expect([1, 1, 1]).toBeArrayOfSize(3);
expect(true).toBeTruthy();
});
并再次运行测试,我得到与尝试#1相同的错误.我怀疑是缓存问题
and run the test again, I get the same error as in attempt #1. I suspect a cache issue
解决方法
使用尝试#2并在每次运行之前清除jest缓存
Use attempt #2 and clear jest cache before each run with
ng test --clearCache && ng test
我不喜欢这种解决方案,因为当有许多规格文件时,高速缓存旨在加快处理速度,每次清除高速缓存都会产生敏感影响.而且,我认为在观看模式下使用笑话时无法清除缓存
I don't like this solution because the cache is intended to speed up things and clearing the cache each time has a sensitive impact when there are many spec files. Moreover, I don't think it is possible to clear cache when using jest in watch mode
对不起,这有点长,谢谢您的阅读,直到最后
Sorry, this was a bit long, thanks if you read it to the end
推荐答案
我终于找到了我认为正确的解决方案.从最小示例开始,以用笑话扩展,
I finally found what I believe the right solution. Starting from minimal example to reproduce the problem with jest-extended,
- 创建
jest.config.js
文件(尝试1终于是一个不错的开始)
- create
jest.config.js
file (Attempt 1 was finally a good start)
module.exports = {
setupFilesAfterEnv: [
'jest-extended',
],
};
- 编辑
tsconfig.spec.json
并将"types": ["jasmine", "node"]
替换为"types": ["jest", "node", "jest-extended"]
- edit
tsconfig.spec.json
and replace"types": ["jasmine", "node"]
by"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"]
}
和瞧.实际上,这将在编译中包括jest
和jest-extended
声明文件.现在,我可以获得TypeScript类型检查的所有好处以及缓存的速度提高(显然,首次运行除外).
and voilà. This will actually includes jest
and jest-extended
declaration files in compilation. I now get all the benefits of TypeScript type checkings and the speed improvements of the cache (except for first run, obviously).
我希望这对您有帮助
这篇关于我无法正确配置玩笑以导入模块(setupFilesAfterEnv)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!