Реагировать на ошибку Apollo: больше нет насмешливых ответов на запрос: мутация
Предполагаемый результат:
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()
})
})
Кажется, я выполнил все шаги из официальная документация, но все еще не могу заставить это работать. У Вас есть какие-то предложения? ?
Ответы 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',
},
},
},
},
];
Я рассмотрю это и одобрю ответ, если он сработает. ??