Largeur de la page provoque un défilement automatique en haut de la page lors de l'accès aux comboboxes de recherche/utilisateur/hamburger (chrome uniquement)

Utilisation de community.home-assistant.io avec Chrome Version 95.0.4638.54 (version officielle) (64 bits). Je rencontre un problème étrange, présent uniquement sur mon bureau à la maison. Le bureau de travail semble fonctionner correctement, bien que je ne connaisse pas la version actuelle de Chrome.

Voici le problème :

Lorsque je clique sur la recherche, sur le menu hamburger (trois lignes verticales) ou sur votre icône de profil, la page défile automatiquement vers le haut de la barre de défilement actuelle au lieu d’afficher la liste déroulante.

Ce problème ne se produit que lorsque la liste déroulante se détache du côté droit de l’écran, créant un espace entre la liste déroulante et la barre de défilement verticale. Cela semble se produire autour de 1350 pixels en x, barre de défilement verticale incluse.

2021-10-28_17-29-14

MODIFICATION : La liste déroulante ne se détache et ne provoque ce problème que lorsque vous êtes tout en haut de la page (Message 1) :

Trois pixels de moins…

2021-10-28_17-30-50

À moins que vous ne puissiez le reproduire ici ou sur try.discourse.org, il s’agit presque certainement d’un problème lié à votre thème CSS et à votre mise en page. Essayez également en mode sans échec.

cela se produit ici aussi.

2021-10-28_17-37-26

Cela se produit également en mode sans échec.

Je rencontre des difficultés pour reproduire ce problème. Quelles sont les étapes précises ? J’ai un navigateur très large, je suis défilé vers le bas dans ce sujet et je clique sur l’avatar, mais cela ne remonte pas en haut ?

Ce n’est vraiment pas compliqué. Il suffit d’élargir votre fenêtre de navigateur. Pour ce que cela vaut, ce problème ne se produit pas dans Edge sur le même PC, uniquement dans Chrome.

Les outils de développement en mode sans échec ne révèlent rien, à part un message qui peut ou non être lié :

Avez-vous des extensions de navigateur ? Pouvez-vous essayer dans une fenêtre de navigation privée ?

Recatégorisation en support jusqu’à ce qu’au moins une autre personne puisse reproduire le problème. Je ne peux absolument pas le faire, et je suis sur Chrome/Windows.

Cela se produit également en mode navigation privée.

Pour info, exécution de la version 2.8.0.beta7

Autre dernier renseignement : cela a 100 % commencé après une mise à jour Windows planifiée et un redémarrage. Sur Windows 10 Pro, Build 19042.1288, Expérience 120.2212.3920.0.

Je suis à jour sur Windows / Chrome également

J’ai redimensionné la fenêtre de tant de manières différentes et je ne parviens pas à reproduire le problème..

Avez-vous des liens pour configurer un serveur de développement où je peux déboguer le problème ? Est-ce généralement configuré via VSCode ou VS ?

Nous avons eu un signalement identique.
Version 95.0.4638.54 (Build officiel) (64 bits)
Il a également essayé d’utiliser les raccourcis clavier, mais le problème est resté le même.

Je vois le même comportement dans Chrome, mais pas dans Firefox.

Je suis prêt à essayer n’importe quoi et je développe depuis des années maintenant. Ce bug m’exaspère vraiment ; toute orientation, lien ou autre ressource pouvant aider à identifier la cause racine de ce problème serait la bienvenue, d’autant plus que vous ne parvenez pas à le reproduire.

J’ai mis à jour Chrome sur mon ordinateur de bureau aujourd’hui et ce problème est apparu. Cela devrait le résoudre.

Vous trouverez plus de détails dans la description de la PR. La correction est désormais en ligne sur Meta.

J’ai un peu plus lu à ce sujet et j’ai réussi à identifier le problème. Ce bug – ainsi que quelques autres liés à CSS sticky – ne se produit que si vous avez activé la fonctionnalité « Experimental Web Platform features » dans les drapeaux de Chrome. Cela explique pourquoi certaines personnes le rencontrent, même si elles utilisent la même version de Chrome.

Si vous rencontrez ce problème, assurez-vous qu’elle est désactivée ici :

chrome://flags/#enable-experimental-web-platform-features

J’ai envoyé une PR pour annuler le changement ci-dessus, car il n’est plus nécessaire.