cssinjs/jss

Styles created multiple times when using function values

Open

#1361 aperta il 3 lug 2020

Vedi su GitHub
 (8 commenti) (6 reazioni) (0 assegnatari)JavaScript (434 fork)batch import
bughelp wantedimportantperf

Metriche repository

Star
 (7000 star)
Metriche merge PR
 (Nessuna PR mergiata in 30 g)

Descrizione

Expected behavior: Duplicate styles shouldn't be created.

Describe the bug: On every component render, in which useStyles prop changes, new duplicate styles are created. I've managed to reproduce the bug in Codesandbox. To see it:

  1. Open codesandbox link from below
  2. Inspect red text element and see styles applied
  3. Click on button few times to cause component re-render
  4. Inspect some another element on the page and the red text again.
  5. Notice duplicate styles The styles are duplicated only for elements styled with css selector. If you check styles on the element with container class, you'll see there is no duplication there.

Codesandbox link: https://codesandbox.io/s/react-jss-playground-7ftrs?file=/index.js

Versions (please complete the following information):

  • jss: 10.1.1
  • Browser [e.g. chrome, safari]: any
  • OS [e.g. Windows, macOS]: any

Guida contributor

Direzione di ricerca
Esamina come JSS gestisce i valori delle funzioni negli stili, in particolare il meccanismo di caching. Traccia il percorso di creazione degli stili per identificare dove vengono introdotti duplicati e perché non vengono eliminati.
Tech stack
javascript
Dominio
frontend
Tipo issue
Bug
DifficoltàQuanto dovrebbe essere impegnativa per un nuovo contributor.
2
Tempo stimatoTempo stimato per completare e verificare uno scope piccolo.
1-3 ore
Stato attivitàQuanto è probabile che la issue sia ancora attiva e reviewable.
Attiva
ChiarezzaQuanto chiaramente la issue descrive problema, scope e risultato atteso.
Chiara
Prerequisiti
JavaScriptCSS in JS
Adatta ai principiantiQuanto la issue è adatta a contributor alla prima esperienza.
70