检查 MockedProvider 的 options 中的 mocks 是否正确设置,并确保 mock 数据与查询的数据类型和结构匹配。例如:
// mocks.js
const mocks = [
{
request: {
query: GET_USER_QUERY,
variables: { userId: 1 },
},
result: {
data: {
user: {
id: 1,
name: "John Smith",
email: "john.smith@example.com",
},
},
},
},
];
// MyComponent.test.js
import { MockedProvider } from "@apollo/client/testing";
import MyComponent from "./MyComponent";
import { GET_USER_QUERY } from "./queries/mutations";
import { render, waitFor } from "@testing-library/react";
it("renders user data after loading", async () => {
const mocks = [
{
request: {
query: GET_USER_QUERY,
variables: { userId: 1 },
},
result: {
data: {
user: {
id: 1,
name: "John Smith",
email: "john.smith@example.com",
},
},
},
},
];
const { getByText } = render(
);
await waitFor(() => expect(getByText("John Smith")).toBeInTheDocument());
});