Как проверить readFragment в React? - PullRequest
Новая
       19

Как проверить readFragment в React?

0 голосов
/ 23 марта 2020

Я использую Apollo + React + Jest.

У меня есть данные в кеше Apollo, затем я получаю данные из него также в React.

Но я не могу получить данные, пока testing.

Способ получения данных различается между readFragment и useQuery.

Поэтому я не могу использовать один и тот же способ для проверки readFragment в моем файле модульного теста.

Я пытался подделать provider и client, но это не сработало.

Есть ли какие-нибудь решения для readFragment в тестировании?

мой файл реакции 

import React from "react";
import { useApolloClient } from "@apollo/react-hooks";

const FileInfo: React.FC<Props> = props => {
  const client = useApolloClient();
  const file = client.readFragment({
    id: `Rendition-222-333`,
    fragment: gql`
      fragment rendition on Rendition {
        status
        title
      }
    `,
  });

  return (
    <>
      <p> {file.status} </p>
      <p> {file.title} </p>
    </>
  );

1 Ответ

0 голосов
/ 30 марта 2020

Мой друг дал мне решение, я выкладываю его сюда, если кому-то это нужно. 

import { useApolloClient } from "@apollo/react-hooks";
jest.mock("@apollo/react-hooks");

describe("<FileInfo/>", () => {
  let useApolloClientMock: jest.Mock;
  beforeEach(() => {
    useApolloClientMock = useApolloClient as jest.Mock;
    useApolloClientMock.mockReturnValue({
      readFragment: jest.fn().mockReturnValue({ status: "downloaded", title: "123test" }),
    });
  });

  afterEach(jest.resetAllMocks);

  test("When it renders Then it should not crash", () => {
    const { container } = setup();
    expect(container).toBeTruthy();
  });

});
...