Freecodecamp: Rechercher des sauts de style

Créé le 15 oct. 2019  ·  3Commentaires  ·  Source: freeCodeCamp/freeCodeCamp

Décrivez le bogue
Lorsque vous rechargez une page, deux problèmes de style apparaissent.

  • Le texte de l'espace réservé se déplace légèrement une fois que la page est complètement chargée.
  • Les résultats de la recherche sont brièvement en gras

Reproduire
Étapes pour reproduire le comportement:

  1. Aller à www.freecodecamp.dev (ou n'importe quelle page avec recherche)
  2. Recharger
  3. Voir le déplacement du texte de l'espace réservé
  4. Cliquez sur la barre de recherche
  5. Tapez n'importe quoi
  6. Voir le résultat apparaître brièvement en gras, puis passer à un poids normal

Comportement prévisible
La page doit commencer par les styles qu'elle finit par obtenir.

Captures d'écran
SearchFOUC

client bug

Tous les 3 commentaires

Hé, je veux t'aider. Où puis-je trouver le code pour cela? (Première contribution)

@GabCostaSilva Je ne sais pas à 100% où se trouve le problème, mais les composants SearchBar , SearchHits et SearchSuggestion sont tous impliqués dans une certaine mesure. D'une manière ou d'une autre, les SearchSuggestions n'obtiennent pas les bonnes classes lors du premier rendu, je pense .

Je prévois de regarder de plus près moi-même, demain, mais vous êtes invités à soumettre un PR / partager vos idées. Comme tu veux!

Il s'avère que cela n'avait rien à voir avec ces composants. Le problème est que la police Lato-300 n'est chargée que lorsqu'elle est nécessaire - dans ce cas, lorsque les résultats de la recherche apparaissent. Cela provoque un bref flash de Arial et c'est la cause du problème.

Je vais examiner le pré-chargement des polices et clarifier cela.

Cette page vous a été utile?
0 / 5 - 0 notes