Cannot test <Link> outside of a Page on Next v9.5.0 (Enzyme + Jest) #15543
Comments
|
Updated the stack trace above to include the more interesting line number: |
evantahler
changed the title
|
This error might be interpreted as: Without a page, the Next Router doesn't load, and therefore |
|
Ran into this as well. My (hopefully temporary) workaround was to add a Jest module mock for |
|
ran into this as well but not in a test. i see it when i upgrade and run the app. |
|
That's a good hack @gavinsharp! |
|
I'm getting same issue after upgrading to v9.5.0. This error is also getting for |
|
I also run into that issue when building an app. I had to downgrade to 9.4.4 to make it work. |
|
This could be easily fixed by providing a simple mock to the jest.mock('next/link', () => 'a') |
Related with vercel/next.js#15543
|
This is also an issue when using Storybook (or similar) to render components outside the Right now i've fixed it by creating a custom .storybook/preview.js import React from 'react'
import { addDecorator } from '@storybook/react'
import { linkTo } from '@storybook/addon-links'
import { RouterContext } from 'next/dist/next-server/lib/router-context'
import { startCase } from 'lodash'
addDecorator((storyFn) => (
<RouterContext.Provider
value={{
pathname: '/',
basePath: '',
push: (url, as) => {
if (as) linkTo('Routes', as !== '/' ? startCase(as) : 'Index')()
return Promise.resolve(true)
},
replace: (url, as) => {
if (as) linkTo('Routes', as !== '/' ? startCase(as) : 'Index')()
return Promise.resolve(true)
},
reload: () => {},
prefetch: () => {},
}}
>
{storyFn()}
</RouterContext.Provider>
))For Testing Library I had to start using a custom render method, that wraps the application with the |
|
It works fine in
|
* ⬆️ Bump next from 9.4.4 to 9.5.0 Bumps [next](https://github.com/vercel/next.js) from 9.4.4 to 9.5.0. - [Release notes](https://github.com/vercel/next.js/releases) - [Commits](vercel/next.js@v9.4.4...v9.5.0) Signed-off-by: dependabot-preview[bot] <[email protected]> * ✅ Mock next/Link Related with vercel/next.js#15543 * 🚚 Move index/index.js to index.js This is related with vercel/next.js#13699 * ✅ Improve Layout coverage Co-authored-by: dependabot-preview[bot] <27856297+dependabot-preview[bot]@users.noreply.github.com> Co-authored-by: Carlos Cuesta <[email protected]>
Timer
added
priority: p1
and removed
good first issue
This ensures rendering `next/link` doesn't fail without being nested under the router context. Closes: #15543
|
Hi, this should be resolved in |
|
Thank you for the super-fast turn around! |
|
This was just fixed in 9.5.1, please upgrade! |
|
Hi @ijjk. I'm still having trouble with Granted, it works fine in the latest MUI (v4), but it also worked prior to Next.js v9.5. Unfortunately, we're stuck with MUI v0 for the time being. These dropdown menus, popover components, etc. render somewhere outside the next root component, which I assume is why the router gets lost. Is there any way I can help? |
|
@stovmascript what is being tested when triggering |
This ensures rendering `next/link` doesn't fail without being nested under the router context. Closes: vercel#15543
Fix for TypeScript <RouterContext.Provider
value={{
route: "/",
pathname: '/',
asPath: '/',
query: {},
basePath: '',
push: (_url, as) => {
if (as) {
linkTo('Routes', as !== '/' ? startCase(as.toString()) : 'Index')()
}
return Promise.resolve(true)
},
replace: (_url, as) => {
if (as) {
linkTo('Routes', as !== '/' ? startCase(as.toString()) : 'Index')()
}
return Promise.resolve(true)
},
reload: () => { },
prefetch: async () => { },
back: () => { },
beforePopState: () => { },
isFallback: false,
events: {} as MittEmitter,
}}
>
{storyFn(context)}
</RouterContext.Provider> |
|
This issue has been automatically locked due to no recent activity. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you. |
Bug report
Describe the bug
As of Next v9.5.0, Components which use the
<Link>component cannot be tested in isolation. However, Pages which use<Link>can be tested fine.To Reproduce
With this component:
And this Test
Produce the error:
Expected behavior
The test should pass
In older versions of Next.js, this test passed.
Screenshots
N/A
System information
The text was updated successfully, but these errors were encountered: