使用'relay-test-utils'测试反应组件

Question

[我使用React with Relay / NextJs创建了一些组件，我阅读了应用测试的文档：https://relay.dev/docs/en/testing-relay-components，已经尝试过使用模拟有效载荷生成器和@relay_test_operation指令为片段容器测试创建测试：] >

import SearchPageContainer from '../components/SearchPageContainer'
import ReactTestRenderer from 'react-test-renderer'
import { QueryRenderer, graphql } from 'react-relay'
import {
  createMockEnvironment,
  MockPayloadGenerator,
  generateAndCompile
} from 'relay-test-utils'

describe('SearchPageContainer', () => {
  let testComponent
  let environment

  beforeEach(() => {
    environment = createMockEnvironment()
    const TestRenderer = () => (
      <QueryRenderer
        environment={environment}
        query={graphql`
        query TestQuery @relay_test_operation {
          view: node(id: "test-id") {
            ...MyConnectionFragment
          }
        }
      `}
        variables={{}}
        render={({ error, props }) => {
          if (props) {
            return <SearchPageContainer view={props} />
          } else if (error) {
            return error.message
          }
          return 'Loading...'
        }}
      />
    )
    ReactTestRenderer.act(() => {
      testComponent = ReactTestRenderer.create(<TestRenderer />)
    })
  })
  it('should have pending operations in the queue', () => {
    expect(environment.mock.getAllOperations().length).toEqual(1)
  })
  it('should resolve query', () => {
    environment.mock.resolveMostRecentOperation(operation =>
      MockPayloadGenerator.generate(operation)
    )
    expect(testComponent).toMatchSnapshot()
  })
})
我有此错误：中继转换错误：您在类型node上提供了一个名为Query的字段，但该类型上不存在此类字段。

我在.babelrc中的配置是这样的：

{
    "presets": [
      "next/babel",
    ],
    "plugins": [
      ["relay", {"compat": true, "schema": "schema/schema.json"}],
    ]
}
我不知道我是否需要一些额外的配置来使此@relay_test_operation指令起作用，

感谢您的帮助

我使用React with Relay / NextJs创建了一些组件，我阅读了应用测试的文档：https://relay.dev/docs/en/testing-relay-components，我曾尝试为创建测试。 ..

Answer 1

您将在测试中使用两个主要模块：