search

cssinjs / jss

JSS is an authoring tool for CSS which uses JavaScript as a host language.
https://cssinjs.org
MIT License
7.08k stars 399 forks source link

Styles are not removed after unmounting a component #1536

Open ldiaz-occ opened 3 years ago

ldiaz-occ commented 3 years ago

Expected behavior: When a component unmounts its stylesheets should be removed from the head.

Describe the bug: The stylesheets attached to the head don't include the name of the component in the data-meta attribute. I guess this is why JSS can't remove the stylesheet when the component unmounts.

Reproduction: I can reproduce the error with react-jss@10.7.1 using the withStyles HOC or the createUseStyles hook. But in the 10.6.0 version it just happens with the hook. The styles attached with the HOC work fine. Here is an example in Codesandbox. In the example I'm using version 10.6.0. If the version is changed to 10.7.1 non of the cases works.

Versions (please complete the following information): Dependencies:

"react": "17.0.2",
"react-dom": "17.0.2",
"react-jss": "10.6.0",
"react-scripts": "4.0.0"

Managing expectations: I've been seeing the Warning: [JSS] Rule is not linked. Missing sheet option "link: true". message in the terminal (not in codesandbox but in my Next.js project), but no idea if it is related.

ldiaz-occ commented 3 years ago

Making some tests in the Codesandbox example with different react-jss versions, it seems like this problem is happening since 10.0.1, so I guess this is a long-lasting thing. With version 10.0.0 stylesheets are finally removed correctly, and I'm not receiving the Rule is not linked warning anymore, but I don't know if it is because it wasn't implemented in that version yet. None of the bug fixes of 10.0.1 mentioned in the changelog suggests that this should have changed, so I'm curious about what happened between 10.0.0 and 10.0.1.

ernestostifano commented 1 year ago

Hi @ldiaz-occ I am having this problem with v10.10.0 did you figure out what was happening?