React Apollo 错误:查询不再有模拟响应:突变
Posted
技术标签:
【中文标题】React Apollo 错误:查询不再有模拟响应:突变【英文标题】:React Apollo Error: No more mocked responses for the query: mutation 【发布时间】:2019-09-18 03:03:07 【问题描述】:预期结果:
MockedProvider 应该模拟我的 createPost 突变。
实际结果:
Error: No more mocked responses for the query: mutation...
如何重现问题:
我有一个非常简单的存储库。我还使用示例提交创建了一个单独的分支,它破坏了 apollo 模拟提供程序。
1) 突变定义在这里:https://github.com/developer239/react-apollo-graphql/blob/create-post-integration-tests/src/modules/blog/gql.js#L23
export const CREATE_POST = gql`
mutation createPost($title: String!, $text: String!)
createPost(title: $title, text: $text)
id
title
text
`
2) 虚假请求在这里:https://github.com/developer239/react-apollo-graphql/blob/create-post-integration-tests/test/utils/gql-posts.js#L68
export const fakeCreatePostSuccess =
request:
query: CREATE_POST,
variables:
title: 'Mock Title',
text: 'Mock lorem ipsum text. And another paragraph.',
,
result:
data:
createPost:
id: '1',
title: 'Mock Title',
text: 'Mock lorem ipsum text. And another paragraph.',
,
,
,
3) 我正在测试的组件在这里:https://github.com/developer239/react-apollo-graphql/blob/create-post-integration-tests/src/pages/Blog/PostCreate/index.js#L24
<Mutation
mutation=CREATE_POST
update=updatePostCache
onCompleted=( createPost: id ) => push(`/posts/$id`)
>
mutate => (
<>
<H2>Create New Post</H2>
<PostForm submit=values => mutate( variables: values ) />
</>
)
</Mutation>
4) 失败的测试用例在这里:https://github.com/developer239/react-apollo-graphql/blob/create-post-integration-tests/src/pages/Blog/PostCreate/index.test.js#L33
describe('on form submit', () =>
it('should handle success', async () =>
const renderer = renderApp(<App />, ROUTE_PATHS.createPost, [
fakeCreatePostSuccess,
])
const formSubmitButton = fillCreatePostForm(renderer)
fireEvent.click(formSubmitButton)
await waitForElement(() => renderer.getByTestId(POST_DETAIL_TEST_ID))
expect(renderer.getByTestId(POST_DETAIL_TEST_ID)).toBeTruthy()
)
)
似乎我遵循了official documentation 中的所有步骤,但我仍然无法完成这项工作。你有什么建议吗? ????
【问题讨论】:
【参考方案1】:在官方文档中声明我们应该将addTypename=false
添加到<MockedProvider>
。当我查看错误消息时,我可以看到 __typename
已添加到它正在查找的查询中。
类似:
Error: Network error: No more mocked responses for the query: query getDog($dogId: ID!)
dog(dogId: $dogId)
name
__typename
所以在删除addTypename=false
后我又遇到了一个错误:
Missing field __typename in
"name": "dog"
现在,在我的模拟响应中添加 __typename
时,它开始工作了。
例如
const mocks = [
request:
query: dogQuery,
variables:
dogId: 1,
,
,
result:
data:
dog:
name: 'dog',
__typename: 'Dog',
,
,
,
,
];
【讨论】:
我将对此进行调查并批准答案,如果它有效。 ??以上是关于React Apollo 错误:查询不再有模拟响应:突变的主要内容,如果未能解决你的问题,请参考以下文章
在 jest-react 中使用 MockedProvider 会导致错误“查询没有更多的模拟响应”
react-apollo 网络错误:查询“Hello”的服务器响应丢失