Reactjs 测试 api 调用

Question

我想使用Reactjs进行开发，我制作了一个应用程序，在其中调用API（https://jsonplaceholder.typicode.com/users），我还对此调用进行了测试，但无法调用该API。

我在 .Net 中做了一个小的 WebApi 项目，这个 WebApi 有一个端点，它返回一个具有简单结构的 JSON：

{{person:1},{person:2}}

。我使用邮递员和 Visual 中的断点测试了此端点，它起作用了。

现在我想使用React的测试套件（我不知道它是不是一个测试套件，mpn test）来调用这个端点，但是测试没有调用该端点，因为视觉中的断点没有激活，不知道Reactjs测试是否可以调用API。

这些是文件：

PersonHelpers.test.js

import {checkPersonList} from './RobotHelpers';

test('Check person in list',() => {

    var result = false;
    result = checkPersonList();

    expect(result).toEqual(true);
});

PersonHelpers.js

export const checkPersonList = () => {
    var persontList = null;

    setTimeout(() => {
        fetch('http://localhost:23620/api/Values')
        .then(response => response.json())
        .then(data => {
            persontList = data;
        });
    },1000);

    console.log("list",persontList);
    if (persontList === null)
        console.log("is null")

    if((persontList != null) && (persontList.lenght > 0))
        return true;
    else
        return false;
}

Answer 1

您要在这里测试的不是您在 .NET 中开发的后端 API，而是

checkPersonList()

在接收 API 响应时是否能够正确运行。

AFAIK，对于单元测试，您不需要直接调用 API，而是模拟 API 请求和响应。

为此，您可以使用

fetch-mock

库。