2

我试图弄清楚如何向我的 React 应用程序添加测试。我正在使用反应测试库。ReferenceError: regeneratorRuntime is not defined 当我尝试运行测试时出现此错误。

这是测试文件的样子：

import {
    render,
    screen,
    within,
    fireEvent,
    waitFor
} from '@testing-library/react';
import Providers from '../../context/GlobalContextProviders';
import { BrowserRouter as Router } from 'react-router-dom';
import IngredientsCenter from '../views/IngredientsCenter';

function renderWithProviders(el) {
    render(
        <Providers>
            <Router>{el}</Router>
        </Providers>
    );
}

test('The ingredients table exists on the screen', async () => {
    renderWithProviders(<IngredientsCenter />);
    const ingredientsTable = screen.getByRole('ingredients-table');
    await waitFor(() => {
        expect(ingredientsTable).toBeTruthy();
    });
});

部分相关堆栈跟踪的完整错误：

regeneratorRuntime is not defined
ReferenceError: regeneratorRuntime is not defined
    at C:\...\node_modules\react-table\src\publicUtils.js:169:10
    at useAsyncDebounce (C:\...\node_modules\react-table\src\publicUtils.js:169:10)
    at GlobalFilter (C:\...\src\components\pieces\IngredientsTable.js:27:19)

然后这是直到第 27 行的 IngredientsTable 文件：

import React, { useState } from 'react';
import {
    useTable,
    useSortBy,
    useGlobalFilter,
    useAsyncDebounce
} from 'react-table';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import {
    faSortUp,
    faSortDown
} from '@fortawesome/pro-duotone-svg-icons';
import {
    faCheck,
    faEllipsisV
} from '@fortawesome/pro-regular-svg-icons';
import { Scrollbars } from 'rc-scrollbars';

// Define a default UI for filtering
const GlobalFilter = ({
    preGlobalFilteredRows,
    globalFilter,
    setGlobalFilter
}) => {
    const count = preGlobalFilteredRows.length;
    const [value, setValue] = useState(globalFilter);
    const onChange = useAsyncDebounce((value) => {
        setGlobalFilter(value || undefined);
    }, 200);

我已经用谷歌搜索了这个错误并在此处查找了它，但我发现没有任何帮助。有人能弄清楚为什么我的测试会因该错误而失败吗？

4

1 回答 1

2

看起来您正在使用 webpack，因为在 Create React App 中已经设置了再生器运行时。首先安装模块：

npm i regenerator-runtime

并将webpack.config.js此设置添加到条目中：

 entry: ["regenerator-runtime/runtime", "./src/index.js"],

这将在regeneratorRuntime全球范围内提供。

于 2022-01-26T08:25:01.090 回答