I'm having a strange issue with PolyJS and Jest. I have 2 tests in a single file -- the first one passes, and the second returns an error from the fetch in MyComponent: TypeError: Cannot read property 'status' of undefined"
It doesn't matter which one is second. Standalone each test passes, but together the second fails so it looks like Polly is just not doing the fetch from it's recordings.
I've tried various things like context.polly.flush() in afterEach but it doesn't seem to work. Any ideas?
Polly config:
export const setupDefaultPolly = () => {
const context = setupPolly({
mode: process.env.POLLY_MODE,
adapters: [require('@pollyjs/adapter-node-http')],
persister: require('@pollyjs/persister-fs'),
persisterOptions: {
fs: {
recordingsDir: path.resolve(__dirname, '../__recordings__'),
},
},
})
return context
My test file:
describe('MyComponent', () => {
setupDefaultPolly()
it('should render correctly', async () => {
const fetchSpy = jest.spyOn(global, 'fetch')
let wrapper
await act(async () => {
wrapper = mount(<MyComponent thing="exists" />)
})
expectLoadingPage(wrapper).toBeTruthy()
await waitFor(() => {
wrapper.update()
expectLoadingPage(wrapper).toBeFalsy()
})
expect(wrapper.text()).toContain('exists')
expect(withoutMuiID(wrapper)).toMatchSnapshot()
expect(fetchSpy).toHaveBeenCalledTimes(3)
})
it('should display error when not found', async () => {
let wrapper
await act(async () => {
wrapper = mount(<MyComponent thing="not-exists" />)
})
expectLoadingPage(wrapper).toBeTruthy()
await waitFor(() => {
wrapper.update()
expectLoadingPage(wrapper).toBeFalsy()
})
expect(wrapper.text()).toContain('Not found: not-exists')
expect(withoutMuiID(wrapper)).toMatchSnapshot()
})
})