添加这个问题是因为我在网上不容易找到答案。
我正在尝试使用 react-testing-library
测试组件是否正确呈现。然而,我收到了很多似乎没有多大帮助的错误。
这是我的测试文件( report.test.ts
,以及代码中的组件):
import { render } from "react-testing-library";
import "jest-dom/extend-expect";
import Report from "./Report";
test("component", () => {
const reportData = {
name: "test-report-name",
url: "test-url"
};
const { getByText } = render(<Report report={reportData} />);
expect(getByText("test-report-name")).toHaveAttribute("href", "test-url");
});
当我尝试运行测试时,出现错误 SyntaxError: Unexpected token, expected "</>"
. VS Code 中有一条红色波浪线,悬停时显示 Argument of type 'Report' is not assignable to parameter of type 'ReactElement<any>'
.
即使我将 Report 标签更改为简单的 <div />
,然后我得到 Cannot find name 'div'
.
我的测试有什么问题?
最佳答案
测试文件扩展名应被识别为使用 React 语法的文件(例如 tsx
),并且 React 应使用 import React from "react";
.
使用JSX语法时,似乎必须在文件中定义React,并且文件类型必须被识别为使用React的文件类型。因此,如果测试文件具有 js
扩展名,则可能需要进行类似的更改。
关于reactjs - 语法错误 : Unexpected token, 预期 "</>",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53305638/