React + Jest Testing Error - ReferenceError: expect is not defined
React + Jest Testing Error - ReferenceError: expect is not defined
我真的到处都在拖网寻找这个问题的答案并且可能尝试了 99% 的东西所以我决定开始一个自己的线程这样其他人就可以 运行 他们关注我目前和看看他们是否能发现问题。
我对 Jest 测试还很陌生,因此决定尝试在我们的代码库中实现它。我使用本指南来确保我所做的一切都是完美的,但仍然会出现此错误
A Practical Guide To Testing React Applications With Jest
我正在针对一个简单的功能组件进行测试,该组件使用 react-hook-form 在页面上生成一个表单,然后通过 redux 调用将完成的表单发送到我们的后端
我已将 setupTests.js 文件设置为:
import '@testing-library/jest-dom'
import { configure } from "enzyme"
import Adapter from "enzyme-adapter-react-16";
import '@testing-library/jest-dom/extend-expect';
configure({ adapter: new Adapter() });
将我的 package.json 测试命令更新为
"test": "react-scripts test --env=jsdom --setupFiles ./src/setupTests.js"
这是我试图通过简单测试 运行 的测试规范:
import React from 'react';
import { render as rtlRender, screen } from '@testing-library/react';
import { Provider } from 'react-redux';
import store from '../../../store';
import AddNewProperty from './AddNewProperty';
configure({ adapter: new Adapter() });
const render = component => rtlRender(
<Provider store={store()}>
{component}
</Provider>
)
describe('Add New Property', () => {
test('component redners successfully', () => {
render(<AddNewProperty />)
// expect(screen.getByText('Apartment Number')).toBeInTheDocument();
})
});
这是屏幕上为我返回的错误:
FAIL src/components/Forms/Agency/AddNewProperty.spec.js
● Test suite failed to run
ReferenceError: expect is not defined
3 | import Adapter from "enzyme-adapter-react-16";
4 | import '@testing-library/jest-dom/extend-expect';
> 5 | configure({ adapter: new Adapter() });
| ^
at Object.<anonymous> (node_modules/@testing-library/jest-dom/dist/extend-expect.js:9:1)
at Object.<anonymous> (node_modules/@testing-library/jest-dom/dist/index.js:3:1)
at Object.<anonymous> (src/setupTests.js:5:1)
Test Suites: 1 failed, 1 total
Tests: 0 total
Snapshots: 0 total
Time: 0.167s
Ran all test suites related to changed files.
Watch Usage: Press w to show more.
我也安装了最新版本的所有软件包
您可能希望在安装测试框架后设置文件
您可以通过以下几种方法(对于这个特定问题,方法 1 更为相关)
1) react-scripts
Replace/Add --setupFilesAfterEnv
而不是使用 --setupFiles
示例:"test": "react-scripts test --setupFilesAfterEnv <test setup filepath>
2) jest.config.js
setupFilesAfterEnv: [
'./setupTests.js',
],
同时确保您的节点版本至少为 12
我真的到处都在拖网寻找这个问题的答案并且可能尝试了 99% 的东西所以我决定开始一个自己的线程这样其他人就可以 运行 他们关注我目前和看看他们是否能发现问题。
我对 Jest 测试还很陌生,因此决定尝试在我们的代码库中实现它。我使用本指南来确保我所做的一切都是完美的,但仍然会出现此错误 A Practical Guide To Testing React Applications With Jest
我正在针对一个简单的功能组件进行测试,该组件使用 react-hook-form 在页面上生成一个表单,然后通过 redux 调用将完成的表单发送到我们的后端
我已将 setupTests.js 文件设置为:
import '@testing-library/jest-dom'
import { configure } from "enzyme"
import Adapter from "enzyme-adapter-react-16";
import '@testing-library/jest-dom/extend-expect';
configure({ adapter: new Adapter() });
将我的 package.json 测试命令更新为
"test": "react-scripts test --env=jsdom --setupFiles ./src/setupTests.js"
这是我试图通过简单测试 运行 的测试规范:
import React from 'react';
import { render as rtlRender, screen } from '@testing-library/react';
import { Provider } from 'react-redux';
import store from '../../../store';
import AddNewProperty from './AddNewProperty';
configure({ adapter: new Adapter() });
const render = component => rtlRender(
<Provider store={store()}>
{component}
</Provider>
)
describe('Add New Property', () => {
test('component redners successfully', () => {
render(<AddNewProperty />)
// expect(screen.getByText('Apartment Number')).toBeInTheDocument();
})
});
这是屏幕上为我返回的错误:
FAIL src/components/Forms/Agency/AddNewProperty.spec.js
● Test suite failed to run
ReferenceError: expect is not defined
3 | import Adapter from "enzyme-adapter-react-16";
4 | import '@testing-library/jest-dom/extend-expect';
> 5 | configure({ adapter: new Adapter() });
| ^
at Object.<anonymous> (node_modules/@testing-library/jest-dom/dist/extend-expect.js:9:1)
at Object.<anonymous> (node_modules/@testing-library/jest-dom/dist/index.js:3:1)
at Object.<anonymous> (src/setupTests.js:5:1)
Test Suites: 1 failed, 1 total
Tests: 0 total
Snapshots: 0 total
Time: 0.167s
Ran all test suites related to changed files.
Watch Usage: Press w to show more.
我也安装了最新版本的所有软件包
您可能希望在安装测试框架后设置文件
您可以通过以下几种方法(对于这个特定问题,方法 1 更为相关)
1) react-scripts
Replace/Add --setupFilesAfterEnv
而不是使用 --setupFiles
示例:"test": "react-scripts test --setupFilesAfterEnv <test setup filepath>
2) jest.config.js
setupFilesAfterEnv: [
'./setupTests.js',
],
同时确保您的节点版本至少为 12