如何使用来自 GraphQL 的模拟数据测试 React 应用程序？

Posted 2023-03-10

【中文标题】如何使用来自 GraphQL 的模拟数据测试 React 应用程序？

【英文标题】：How to test a React app with mock data from GraphQL?

【发布时间】：2018-01-30 23:24:35

【问题描述】：

我有一个简单的 React 应用程序，我在其中测试了一个组件，该组件从 'user' 属性中的 GraphQL 获取用户数据。该应用程序是用 TypeScript 编写的，我已经从自省查询生成了类型定义。

如何在不必手动模拟用户的每个字段的情况下测试该组件？我已经从类型生成中获得了 Graphql 架构，所以应该很容易吧？

有这篇文章http://graphql.org/blog/mocking-with-graphql/#mocking-is-easy-with-a-type-system 说它只需要 2 行代码，但我无法让它工作，我找不到适合 mockServer 的文档。

然后是 graphql-tools (http://dev.apollodata.com/tools/graphql-tools/mocking.html)，但这些示例都没有真正起作用...

我使用apollo-codegen introspect-schema 生成架构。

是否有任何工作示例？

【参考方案1】：

你可以试试这个包https://www.npmjs.com/package/easygraphql-mock

只需传递您拥有的架构，它将模拟所有类型和字段。在你模拟它之后，你可以访问你想要的类型。