I have been looking around for answers, I find few ones very similar to mine, but still could not find a solution for the problem I had. I have also tried reinstalling my modules, running npm link after reinstalling my modules. It just has not really worked out for me.
This is the complete error:
Trying to insert a new style tag, but the given Node is unmounted!
- Are you using a custom target that isn't mounted?
- Does your document not have a valid head element?
- Have you accidentally removed a style tag manually?
18 | } from '../visual-elements/responsive-button'
19 |
> 20 | const StyledSelect = styled(Select)`
| ^
21 | width: 100%;
22 | `
23 |
As for my testing File, I am using Jest/MSW/React Testing Library + it is TypeScript.
import React from 'react'
import { useFlag } from '@boxine/tonies-ui'
import { rest } from 'msw'
import { setupServer } from 'msw/node'
import * as utils from '../../mocks/utils'
import { render, screen } from '../../utils/test-utils'
import { useAudioLibraryFlag } from '../../hooks/useAudioLibraryFlag'
import Home from '.'
jest.mock('../../hooks/useAudioLibraryFlag')
const requiredHomeProps = {
location: {
search: '',
},
}
const households = [
utils.generateHousehold(),
utils.generateHousehold(),
utils.generateHousehold(),
]
const server = setupServer(
rest.post('https://api.tonie.cloud/v2/graphql/', (req, res, ctx) => {
return res(
ctx.json({
data: {
households,
},
})
)
})
)
describe('Home component', () => {
beforeEach(() => {
;(useAudioLibraryFlag as jest.Mock).mockImplementation(() => true)
;(useFlag as jest.Mock).mockImplementation(() => true)
})
// Enable API mocking before tests.
beforeAll(() => server.listen())
// Reset any runtime request handlers we may add during the tests.
afterEach(() => server.resetHandlers())
afterAll(() => {
;(useAudioLibraryFlag as jest.Mock).mockRestore()
;(useFlag as jest.Mock).mockRestore()
// Disable API mocking after the tests are done.
server.close()
})
test('renders correctly', () => {
render(<Home {...requiredHomeProps} />)
expect(
screen.getByText(/Ready to add some new Tonies to your collection/)
).toBeInTheDocument()
expect(screen.getByText('Go to the shop')).toBeInTheDocument()
expect(screen.getByText('to download')).toBeInTheDocument()
})
})```
Aucun commentaire:
Enregistrer un commentaire