Apollo-Graphql 测试

Question

我正在使用client.query() 方法从服务器查询。 我想使用 MockProvider 为这个功能编写测试。

由于client.query() 的异步性质，我面临问题

// I am writing the  query as follow
const { data, loading } = await client.query({
    query: Todo,
    variables: { name },
    fetchPolicy: 'cache-first'
})
      
      

Answer 1

您可以使用MockProvider 和react-testing-library 来测试您的反应组件。阅读更多关于MockProviderhere的信息。

试试这个：

import { act, fireEvent, render } from '@testing-library/react'
import { MockedProvider } from '@apollo/react-testing'

import YourComponent from './path'

const mocks = [
	{
		request: {
			query: Todo,
			variables: {
				query: { name },
			},
		},
		result: {
			data: {
				mockData_here
			},
		},
	},
]

test('it should ...', () => {
  let rendered
  await act(async () => {
    rendered = render(
      <MockedProvider mocks={mocks} addTypename={false}>
          {YourComponent}
      </MockedProvider>
    )
  })
  expect(rendered).toMatchSnapshot()
})