使用 axios 模拟采用者模拟 get api 进行 api 测试会抛出 400 响应

Question

我正在编写一个测试来模拟带有参数的 get api 请求。尽管我嘲笑 200 状态的成功 api 响应，但测试套件未能将响应抛出 404。我无法弄清楚我的测试套件出了什么问题。我在这里收到关注，

错误截图

这是我对 get api 的模拟测试。有人可以告诉我这里出了什么问题吗？

let axiosMock: MockAdapter;
axiosMock = new MockAdapter(instance)
axiosMock
     .onGet('http://localhost:8000/api/v1/patients', {
         params: {
        page: 1,
        sort: 'workspace_patient_id',
        order: 'desc',
        },
    })
     .reply(200, mockResponse);

这是我在 React 组件中的实际 api

setFetching(true);
        const response = await getAllPatients(
            paginationModel.page,
            search,
            dataSortModel[0].sort === 'asc' ? 'asc' : 'desc',
            dataSortModel[0].field === 'name' ? 'name' : 'workspace_patient_id',
        );

        if (response.status >= 400 && response.status < 500) {
            console.log(response.status);
            snackbar(response.data.description, 'error');
            return;
        }

        if (response.status >= 500) {
            snackbar('Something went wrong. Please try again.', 'error');
            return;
        }

        if (response.status === 200) {
            console.log('response', response.data);
            const pagedData: IPatientsPaged = response.data;
            const patients: IPatient[] = pagedData.results;
            console.log('patients', patients);

            setMetadata(pagedData.info);
            setRows(
                patients.map((patient) => ({
                    id: patient.id,
                    workspace_patient_id: patient.workspace_patient_id,
                    name: `${patient.first_name} ${patient.last_name}`,
                    contact: patient.contact_number,
                    address: patient.address,
                    email: patient.email,
                    action: () => <></>,
                })),
            );
        }

        setFetching(false);

API 在 React 组件中正常工作，并通过成功的 api 响应正确渲染所有 UI 组件。我尝试更改测试套件中的等待实现，但它根本不起作用。

Answer 1

为什么是404？

因为您的请求参数与模拟参数不匹配。

所以尝试删除模拟中的

params

，并且仅匹配url

http://localhost:8000/api/v1/patients

：

let axiosMock: MockAdapter;
axiosMock = new MockAdapter(instance)
axiosMock
     .onGet('http://localhost:8000/api/v1/patients', {
        // params: {
        //   page: 1,
        //   sort: 'workspace_patient_id',
        //   order: 'desc',
        // },
    })
     .reply(200, mockResponse);