-
Notifications
You must be signed in to change notification settings - Fork 29.7k
Description
Bug report
Describe the bug
Components that use next/dynamic to load and that have a CSS module lose their CSS when navigating to another page that contains the same dynamically loaded component.
To Reproduce
Here is a repo that contains the minimal amount of code to reproduce.
- Create a Component that includes a CSS module.
- Create two pages.
- Using next/dynamic add the component to each page, as well as add a link to the other page.
- Start the app and view the first page and then click the link to the second page.
Expected behavior
The styles for the dynamically included component will persist when navigating to other pages the component lives on.
Screenshots
The styles for the dynamically included component do not persist when navigating to other pages the component lives on.
System information
- OS: macOS
- Browser: Chrome
- Version of Next.js: 9.5.3
- Version of Node.js: 12
Additional context
This issue only occurs when navigating via page links, direct access to the index or other-page load the CSS correctly.
This bug appears to have been introduced as a regression from #12843 that fixed a related issue, #10557, where there is a flash of unstyled content when navigating to a page that contains a dynamically loaded component. I verified that this new issue is not present in 9.5.3-canary.20, but is present on 9.5.3-canary.21 and is currently present in 9.5.3. See this comment thread for more details on potential solutions.