cssinjs/jss

themed useCreateStyles leaks style tags in StrictMode

オープン

#1,332 opened on 2020/04/20

 (1 件のコメント) (1 件のリアクション) (0 人の担当者)JavaScript (434 件のフォーク)batch import
bughelp wanted

Repository metrics

Stars
 (7,000 個のスター)
PR merge metrics
 (PR metrics pending)

説明

Expected behavior: <style> elements get disposed when re-rendering in StrictMode.

Describe the bug: When using themed styles (possibly prop-based as well) re-rendering a component using useStyles with a new theme will leak their <style> elements.

This is possibly due to useStyles managing the sheet during render but unmanaging it in a effect cleanup. A component can render multiple times (in concurrent and strict mode) before an effect is scheduled.

Codesandbox link: https://codesandbox.io/s/determined-wood-8d0s7?file=/src/App.js:513-622

Click "rerender" and see that the number of <style> element grows with every "rerender" click.

Versions (please complete the following information):

  • react-jss: 10.1.1
  • Browser [e.g. chrome, safari]: Chrome 81
  • OS [e.g. Windows, macOS]: Ubuntu 18.04
  • react: 16.13.1

コントリビューターガイド