[英]How can I make jest run with the same config as react-script test on a create-react-app?
我知道我可以运行npm test
,它运行react-script test
并且它可以工作,它成功运行了测试。 但我有兴趣弄清楚如何使用相同的配置react-script
直接运行jest
。 希望不必复制配置或弹出应用程序。 我开始阅读react-scripts
的源代码,但到目前为止我无法弄清楚。
想要这个的原因是:
jest
并运行所有测试。 如果我在我的 CRA 应用程序上运行jest
,我会收到以下错误:
PS C:\Users\pupeno\Documents\Flexpoint Tech\js\exp7\frontend> jest
FAIL src/App.test.tsx
● Test suite failed to run
Jest encountered an unexpected token
This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.
By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".
Here's what you can do:
• To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
• If you need a custom transformation specify a "transform" option in your config.
• If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.
You'll find more details and examples of these config options in the docs:
https://jestjs.io/docs/en/configuration.html
Details:
SyntaxError: C:\Users\pupeno\Documents\Flexpoint Tech\js\exp7\frontend\src\App.test.tsx: Unexpected token (6:29)
4 |
5 | test("renders Facebook link", () => {
> 6 | const {getByText} = render(<App/>)
| ^
7 | const linkElement = getByText(/Loading.../i)
8 | expect(linkElement).toBeInTheDocument()
9 | })
at Parser._raise (node_modules/@babel/parser/src/parser/error.js:60:45)
at Parser.raiseWithData (node_modules/@babel/parser/src/parser/error.js:55:17)
at Parser.raise (node_modules/@babel/parser/src/parser/error.js:39:17)
at Parser.unexpected (node_modules/@babel/parser/src/parser/util.js:149:16)
at Parser.parseExprAtom (node_modules/@babel/parser/src/parser/expression.js:1174:20)
at Parser.parseExprSubscripts (node_modules/@babel/parser/src/parser/expression.js:541:23)
at Parser.parseMaybeUnary (node_modules/@babel/parser/src/parser/expression.js:521:21)
at Parser.parseExprOps (node_modules/@babel/parser/src/parser/expression.js:312:23)
at Parser.parseMaybeConditional (node_modules/@babel/parser/src/parser/expression.js:264:23)
at Parser.parseMaybeAssign (node_modules/@babel/parser/src/parser/expression.js:212:21)
Test Suites: 1 failed, 1 total
Tests: 0 total
Snapshots: 0 total
Time: 2.234s
Ran all test suites.
我试图在不弹出的情况下做到这一点,以免失去 CRA 的好处。 我明白,如果我退出,我几乎可以做任何我想做的事情。
create-react-app Jest 配置不应该在没有弹出的情况下可用。 react-script test
以编程方式使用动态生成的配置运行 Jest。 它在eject
时导出到 static 配置文件。
问题是弹出仍然不允许使用 Jest CLI 以相同的方式运行测试,因为在弹出的项目中,Jest 仍然通过scripts/test.js
以编程方式运行。 该脚本负责设置 CRA 环境变量,它们应该另外提供给 Jest CLI。 这应该在 jest.config.js 或globalSetup
文件中进行评估:
process.env.BABEL_ENV = 'test';
process.env.NODE_ENV = 'test';
process.env.PUBLIC_URL = '';
require('react-scripts/config/env');
考虑到未弹出的项目不会提供生成的项目(如脚手架)所固有的任何好处,因此最好在需要任何自定义时立即弹出。
如果需要保持项目不弹出,可以将其克隆并弹出,然后将 Jest 配置( config/jest/*.*
和来自package.json
的jest
条目)转移到未弹出的项目中。 这可以通过 Git 分支来实现。
或者,它可以通过依赖于react-scripts
internals的 hack 来检索生成的配置,类似于 CRA 如何做到这一点:
jest.config.js
process.env.BABEL_ENV = 'test';
process.env.NODE_ENV = 'test';
process.env.PUBLIC_URL = '';
require('react-scripts/config/env');
const path = require('path');
const createJestConfig = require('react-scripts/scripts/utils/createJestConfig');
module.exports = createJestConfig(
relativePath => require.resolve(path.join('react-scripts', relativePath)),
__dirname, // given that Jest config is in project root
false
);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.