Apollo MockedProvider 测试问题（我渲染的组件不断消失）

Question

免责声明；我对 react-testing-library（一直使用公认的旧版 Enzyme）和 Apollo Query/MockedProvider 组件（通过 JS 服务对象使用客户端）有点陌生，所以这可能是一个愚蠢的问题.. .

我有一个组件可以接收我尝试为其编写测试的国家/地区列表。我想做的是：

import React from 'react';

import { MockedProvider } from '@apollo/react-testing';

import { render, act } from '@testing-library/react';

import wait from 'waait';

import Countries, { countryQuery } from './Countries';

import { isTerminating } from 'apollo-link/lib/linkUtils';

当它运行时，第二个测试（关于加载状态）失败，因为此时组件看起来只是一个 body 标签。我尝试将 beforeAll 更改为 beforeEach，但这只是生成了一个带有错误指示器的组件。我在组件中放置了一些 console.log 语句，这就是它们向我展示的内容：

console.log src/components/Countries.js:45

      Loading is: true

    console.log src/components/Countries.js:46

      Error is: undefined

    console.log src/components/Countries.js:45

      Loading is: false

    console.log src/components/Countries.js:46

      Error is: Error: Network error: No more mocked responses for the query: {

        countries {

          name

          phone

          __typename

        }

      }

      , variables: {}

我想知道它是否不喜欢作为 MockedProvider 的模拟属性传入的空数组。但是我见过的每个例子都是这样的，所以......

作为一项实验，我在规范文件中添加了第二组测试，以查看导致问题的组件是否只是一个奇怪的计时问题。这是第二个测试：

describe('and the component has data', () => {

    let component;

    beforeAll(async (done) => {

      await act(async () => {

        component = render(

          <MockedProvider mocks={mocks} addTypename={false}>

            <Countries />

          </MockedProvider>

        );

        await wait(0);

      });

      done();

    });

    it('should have a title', () => {

      expect(component.getByText('Countries Component')).not.toBeUndefined();

    });

    it('should have a loading status', () => {

      expect(component.getByText(mockCountryName)).not.toBeUndefined();

    });

  });

这有同样的问题；第一个测试有效（如果我重新排序测试，第一个总是有效的测试）但第二个失败，并且组件似乎是一个空的 body 标签。

有没有办法让这种类型的测试结构起作用？我不喜欢将所有内容都放在一个测试中的想法，更不用说组件的设置代码了。