cssinjs/jss

themed useCreateStyles creates className mismatch when hydrating in StrictMode

Open

#1 338 ouverte le 26 avr. 2020

Voir sur GitHub
 (0 commentaires) (1 réaction) (0 assignés)JavaScript (434 forks)batch import
bughelp wanted

Métriques du dépôt

Stars
 (7 000 stars)
Métriques de merge PR
 (Aucune PR mergée en 30 j)

Description

Expected behavior: className matches during hydration

Describe the bug: The counter in the className is off by one

Codesandbox link: https://codesandbox.io/s/createusestyles-classname-mismatch-zdojq?file=/src/App.js

The useLayoutEffect warnings are false positives since we SSR in the browser to showcase the issue better. Versions (please complete the following information):

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

Guide contributeur

Direction de recherche
Examinez le décalage du compteur de noms de classe entre SSR et CSR avec React StrictMode. Inspectez le hook useCreateStyles de JSS et comment il gère l'hydratation en StrictMode, en particulier la logique du compteur pour la génération de noms de classe.
Stack technique
javascriptreact
Domaine
frontend
Type d'issue
Bug
DifficultéDifficulté estimée pour un nouveau contributeur, de 1 pour un très petit changement à 5 pour un travail expert.
2
Temps estiméFourchette de temps approximative pour investiguer, implémenter, tester et préparer une pull request.
1-3 heures
Statut d'activitéDisponibilité apparente de l'issue : fraîche, active, ancienne, bloquée ou en attente d'un mainteneur.
Active
ClartéClarté avec laquelle l'issue explique le changement attendu, les critères d'acceptation et la prochaine étape.
Claire
Prérequis
ReactCSS in JSJSS
Accessibilité débutantScore de 1 à 100 estimant l'accessibilité de cette issue pour un premier contributeur.
65