create-react-app Add support for enabling Jest automock without ejecting

pprl5pva 于 20天前发布在 React

关注(0)|答案(3)|浏览(18)

描述你希望的解决方案

我们希望能够在 jest 配置中启用 automock,以便我们的应用程序的 package.json 可以访问它。

"jest": {
    "automock": true,
    /* ... */
  }

目前，这会导致 yarn test 的以下控制台输出：

yarn test
yarn run v1.22.4
$ react-scripts test --coverage

Out of the box, Create React App only supports overriding these Jest options:

• clearMocks
• collectCoverageFrom
• coveragePathIgnorePatterns
• coverageReporters
• coverageThreshold
• displayName
• extraGlobals
• globalSetup
• globalTeardown
• moduleNameMapper
• resetMocks
• resetModules
• restoreMocks
• snapshotSerializers
• transform
• transformIgnorePatterns
• watchPathIgnorePatterns.

These options in your package.json Jest configuration are not currently supported by Create React App:

• automock

If you wish to override other Jest options, you need to eject from the default setup. You can do so by running npm run eject but remember that this is a one-way operation. You may also file an issue with Create React App to discuss supporting more options out of the box.

描述你考虑过的替代方案

我们考虑过卸载，但更愿意不要这样做，因为我们希望保持开放，以便从 create-react-app 的未来版本中受益。
目前，我们正在为单元测试手动模拟模块，这给我们的测试套件带来了不小的额外开销/样板代码。

create-react-app

来源：https://github.com/facebook/create-react-app/issues/9586

3条答案

按热度按时间

kxe2p93d1#

将jest.autoMockOn()放入src/setupTests.js是否有效？
我不确定这是否会应用于所有测试文件，还是它是一个逐个文件的选项。

赞(0）回复(0）举报 20天前

xtfmy6hx2#

这对一个新的 create-react-app 项目来说似乎有效！有趣的是，我对于 jest.autoMockOn() 和 jest.enableAutomock() 得到了不同的输出(下文有详细说明)。我更倾向于 enableAutomock ,因为它在 Jest 文档中看起来是一个有利的替代方案。我在想关于通过 babel-jest 实现自动提升的注解是否影响了行为上的差异，但我现在没有时间去排查。
如果能在 CRA 文档中注明这个选项就更好了，因为我之前不知道在 setupTests 中改变 Jest 配置是可以接受/推荐的行为。除非我弄错了，否则当前 Jest 配置文档只指示 package.json 技术，而这种方法不支持这种情况。

autoMockOn

// setupTests.js
import '@testing-library/jest-dom';

jest.autoMockOn();

FAIL  src/App.test.js
  ● Test suite failed to run

    TypeError: Cannot read property 'default' of undefined

    > 1 | import { render, screen } from '@testing-library/react';
        | ^
      2 | import App from './App';
      3 |
      4 | test('renders learn react link', () => {

      at Object.<anonymous> (node_modules/@testing-library/dom/dist/pretty-dom.js:29:19)
      at Object.<anonymous> (src/App.test.js:1:1)

Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        0.812 s
Ran all test suites.

enableAutomock

import '@testing-library/jest-dom';

jest.enableAutomock();

FAIL  src/App.test.js
  ● Test suite failed to run

    Failed to get mock metadata: /Users/jhaagsma/Development/prototypes/jest-test/node_modules/lodash/_freeGlobal.js

    See: https://jestjs.io/docs/manual-mocks.html#content

      at Runtime._generateMock (node_modules/jest-runtime/build/index.js:1503:15)

Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        0.843 s
Ran all test suites.

赞(0）回复(0）举报 20天前

oxalkeyp3#

我想知道关于通过 babel-jest 自动提升的说明是否影响了行为差异，但我现在没有时间进行故障排除。
是的，一旦 jest.enableAutomock() 通过 babel-jest ,它将被放在 import '@testing-library/jest-dom'; 之前。我想知道这是否会导致 @testing-library/jest-dom 出现问题？
我认为这需要像 clearMocks 和 resetMocks 这样的 CRA 白名单才能进入 package.json 。

赞(0）回复(0）举报 20天前

我来回答

create-react-app Add support for enabling Jest automock without ejecting

描述你希望的解决方案

描述你考虑过的替代方案

3条答案

autoMockOn

enableAutomock

相关问题

热门标签

最新问答