Hello, friends, the app is working but I am getting this error after running Jest test:
this is the error root something with Link component:
I tried to google this error but all the posts suggest default export is the cause, but it’s not the case for me
this test code
import { render, screen } from '@src/utility/testsUtils/utils'
import Login from '@src/views/pages/authentication/Login'
import user from '@testing-library/user-event'
import {axe } from 'jest-axe'
jest.mock('react-router-dom', () => ({
useHistory: () => ({
push: jest.fn(),
}),
Link: jest.fn().mockImplementation(({ children }) => {
return children;
}),
}))
describe.only('tesing Login component', () => {
test('renders login page', async () => {
const {debug} = render(<Login />)
debug()
expect(screen.getByLabelText('login-email')).toBeInTheDocument()
})
})
// test-utils.js
import React from 'react'
import { render as rtlRender } from '@testing-library/react'
import { Provider } from 'react-redux'
// Import your own store
import {store} from '@store/storeConfig/store'
// ** Toast, Int, & ThemeColors Context
import ability from '@src/configs/acl/ability'
import { ThemeContext } from '../context/ThemeColors'
import { IntlProviderWrapper } from '../context/Internationalization'
import { AbilityContext } from '../context/Can'
function render(
ui,
{
...renderOptions
} = {},
) {
function Wrapper({children}) {
return (
<Provider store={store}>
<AbilityContext.Provider value={ability}>
<ThemeContext>
<IntlProviderWrapper>
{children}
</IntlProviderWrapper>
</ThemeContext>
</AbilityContext.Provider>
</Provider>
)
}
return {
...rtlRender(ui, {
wrapper: Wrapper,
...renderOptions,
}),
// adding `store` to the returned utilities to allow us
// to reference it in our tests (just try to avoid using
// this to test implementation details).
store,
}
}
// re-export everything
export * from '@testing-library/react'
// override render method
export { render }
