使用 apollo 客户端进行查询和订阅的测试反应组件

如何解决使用 apollo 客户端进行查询和订阅的测试反应组件

有没有人有关于使用 apollo 客户端测试使用查询和订阅的 React 组件的提示？当您使用带有 <MockedProvider /> 和 mocks 道具的 link 组件时，它似乎只是忽略了模拟。 感谢帮助！！

解决方法

除非您有充分的理由，否则您不应弄乱 link 的 MockedProvdier 道具。 MockedProvider 中使用的默认链接是 MockLink，它管理为给定查询生成模拟的逻辑。像这样对 apollo docs 中给出的示例进行建模，它应该可以工作：

import TestRenderer from 'react-test-renderer';
import { MockedProvider } from '@apollo/client/testing';
import { GET_DOG_QUERY,Dog } from './dog';

const mocks = [
  {
    request: {
      query: GET_DOG_QUERY,variables: {
        name: 'Buck',},result: {
      data: {
        dog: { id: '1',name: 'Buck',breed: 'bulldog' },];

it('renders without error',() => {
  const component = TestRenderer.create(
    <MockedProvider mocks={mocks} addTypename={false}>
      <Dog name="Buck" />
    </MockedProvider>,);

  const tree = component.toJSON();
  expect(tree.children).toContain('Loading...');
});