У меня в одном описании две тестовые функции. Оба они используют компонент с mocks apollo, поскольку этот компонент использует useQuery. Но ответ от моков на каждый тест должен быть разным. Теперь я не могу сбросить или очистить макеты, которые я распространяю на ApolloProvider. У кого-нибудь была такая проблема? Как вы ее решили?
import React from 'react'
import { render, createMocks, screen, cleanup } from 'test-utils'
import GET_DEVICES from 'src/screens/dashboard/queries/GET_DEVICES'
import Section from './Section'
describe('DashboardScreen', () => {
const result = {
data: {
numDevices: 1
}
}
const mocks = createMocks([{
query: GET_DEVICES,
result: result,
}])
afterEach(() => {
jest.clearAllMocks() <------ THIS IS NOT SOLVING THE ISSUE
})
it('should load Section with expected badges', async () => {
render(<Section />, { mocks })
const badge0 = screen.getByTestId('Badge-0')
expect(badge0).toBeInTheDocument()
const badge1 = screen.getByTestId('Badge-1')
expect(badge1).toBeInTheDocument()
})
it('should display the exclamation icon and 7 devices require attention', async () => {
const result_local = {
data: {
numDevices: 4,
}
}
const mocks_local = createMocks([
{
query: GET_DEVICES,
result: result_local,
}
])
render(<Section } />, { mocks: mocks_local })
const devicesWithActiveIssuesIcon = await screen.findByTestId('ExclamationIcon')
expect(devicesWithActiveIssuesIcon).toBeInTheDocument()
})
})
CreateMocks - это импорт и выглядит так:
const createMocks = mocks =>
mocks.reduce(
(requests, mock) => [
...requests,
{
request: {
query: mock.query,
variables: mock.variables
},
result: mock.result
}
],
[]
)
Он вернет объект следующим образом:
const mocks = [
{
request: {
query: GET_DEVICES,
variables: {}
},
result: {
data: {
numDevices: 1
},
},
},
]