66 lines
1.6 KiB
TypeScript
66 lines
1.6 KiB
TypeScript
|
import React from "react";
|
||
|
|
import { render, cleanup, waitFor } from "@testing-library/react-native";
|
||
|
|
import "@testing-library/jest-native/extend-expect";
|
||
|
|
import { gql, useQuery } from "@apollo/client";
|
||
|
|
import withQueryHandling from "../../component/with-query-handling";
|
||
|
|
import { Text } from "react-native";
|
||
|
|
|
||
|
|
jest.mock("@apollo/client", () => ({
|
||
|
|
...jest.requireActual("@apollo/client"),
|
||
|
|
useQuery: jest.fn(),
|
||
|
|
}));
|
||
|
|
|
||
|
|
const MockComponent: React.FC<{ data?: string }> = ({ data }) => (
|
||
|
|
<Text>{data ? data : "No Data"}</Text>
|
||
|
|
);
|
||
|
|
|
||
|
|
const MOCK_QUERY = gql`
|
||
|
|
query GetMockData {
|
||
|
|
mockData {
|
||
|
|
id
|
||
|
|
name
|
||
|
|
description
|
||
|
|
}
|
||
|
|
}
|
||
|
|
`;
|
||
|
|
|
||
|
|
describe("withQueryHandling HOC Tests", () => {
|
||
|
|
afterEach(() => {
|
||
|
|
jest.clearAllMocks();
|
||
|
|
cleanup();
|
||
|
|
});
|
||
|
|
|
||
|
|
it("should render loading state initially", async () => {
|
||
|
|
(useQuery as jest.Mock).mockReturnValue({
|
||
|
|
loading: true,
|
||
|
|
error: undefined,
|
||
|
|
data: undefined,
|
||
|
|
});
|
||
|
|
const WrappedComponent = withQueryHandling({
|
||
|
|
WrappedComponent: MockComponent,
|
||
|
|
query: MOCK_QUERY,
|
||
|
|
dataKey: "mockDataKey",
|
||
|
|
});
|
||
|
|
const { getByText } = render(<WrappedComponent />);
|
||
|
|
await waitFor(() => {
|
||
|
|
expect(getByText("Loading...")).toBeTruthy();
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
it("should render the wrapped component with data", () => {
|
||
|
|
const mockData = { getShots: "shots" };
|
||
|
|
(useQuery as jest.Mock).mockReturnValue({
|
||
|
|
loading: false,
|
||
|
|
error: undefined,
|
||
|
|
data: mockData,
|
||
|
|
});
|
||
|
|
const WrappedComponent = withQueryHandling({
|
||
|
|
WrappedComponent: MockComponent,
|
||
|
|
query: MOCK_QUERY,
|
||
|
|
dataKey: "getShots",
|
||
|
|
});
|
||
|
|
const { getByText } = render(<WrappedComponent />);
|
||
|
|
expect(getByText("shots")).toBeTruthy();
|
||
|
|
});
|
||
|
|
});
|