Verify canary release
Provide environment information
Operating System:
Platform: darwin
Arch: arm64
Version: Darwin Kernel Version 21.4.0: Fri Mar 18 00:46:32 PDT 2022; root:xnu-8020.101.4~15/RELEASE_ARM64_T6000
Binaries:
Node: 16.13.0
npm: 8.3.0
Yarn: 1.22.18
pnpm: N/A
Relevant packages:
next: 12.1.7-canary.3
react: 18.1.0
react-dom: 18.1.0
What browser are you using? (if relevant)
Google Chrome Version 101.0.4951.54 (Official Build) (arm64)
How are you deploying your application? (if relevant)
Locally and Vercel
Describe the Bug
We have a hash based modal system. When a modal is opened using...
router.push('#modalname');
...and quickly closed with...
const removeHash = (path) => {
return path.indexOf("#") > -1 ? path.substring(0, path.indexOf("#")) : path;
};
const { asPath } = router;
const path = removeHash(asPath);
router.push(path);
...the modal is closed, but we get the error Error: Cancel rendering route.
Expected Behavior
The modal closes without the error.
To Reproduce
Source
git clone https://github.com/u840903/hash-cancel-rendering-route
cd hash-cancel-rendering-route
yarn
yarn dev
Vercel
https://hashes-two.vercel.app/
Steps locally
There's various combinations, but the shortest is to:
- From /, click on To blog
- Now in /blog click Back home
- Now in /, click the to world button
- Error pops!
Steps on Vercel
- From /, click on To blog
- Error pops!
It seems that any navigation to another route, followed by a hash navigation and a navigation away to another route triggers this. I think the key issue, at least on my setup, is the synchronous call to router.push, twice, once as a hash, and then as a route. Odd, that one must first navigate away, and come back to the page.
Though, I'd expect router.push("#hash").then(() => router.push("/route")) to help out, but it doesn't.
The event listener for errors also does nothing. Curious.
Verify canary release
Provide environment information
What browser are you using? (if relevant)
Google Chrome Version 101.0.4951.54 (Official Build) (arm64)
How are you deploying your application? (if relevant)
Locally and Vercel
Describe the Bug
We have a hash based modal system. When a modal is opened using...
...and quickly closed with...
...the modal is closed, but we get the error
Error: Cancel rendering route.Expected Behavior
The modal closes without the error.
To Reproduce
Source
Vercel
https://hashes-two.vercel.app/
Steps locally
There's various combinations, but the shortest is to:
Steps on Vercel
Comment from icyJoseph (https://github.com/icyJoseph)
It seems that any navigation to another route, followed by a hash navigation and a navigation away to another route triggers this. I think the key issue, at least on my setup, is the synchronous call to router.push, twice, once as a hash, and then as a route. Odd, that one must first navigate away, and come back to the page.
Though, I'd expect router.push("#hash").then(() => router.push("/route")) to help out, but it doesn't.
The event listener for errors also does nothing. Curious.