angular / angular/components

[MatSidenav] Sidenav Toggling Can Cause Content Shifting

Ouverte
#12,349 3 commentaires 7 réactions 0 personnes assignées Voir sur GitHub
area: material/sidenav P3
Langage dominant
TypeScript
Étoiles
25k
Forks
6.8k
Merge moyen
1 j 8 h
PR mergées (30 j)
91

Description

#### Bug, feature request, or proposal:
Bug

#### What is the expected behavior?
Mat-sidenav-content is not moved from original position upon quick mat-sidenav toggles

#### What is the current behavior?
Quick mat-sidenav toggles can cause mat-sidenav-content to be shifted over until the drawer is toggled again

#### What are the steps to reproduce?

Set the autofocus on mat-sidenav to true, and place a focusable input in the mat-sidenav
Click the 'open drawer' button quickly and repeatedly until the content shifts. Click the button again and the content will shift back.

https://stackblitz.com/edit/angular-eesonu

#### What is the use-case or motivation for changing an existing behavior?
Use-case: User accidentally opens the drawer and quickly presses again to undo the action. This will result in possibly all content on the page not being displayed.

#### Which versions of Angular, Material, OS, TypeScript, browsers are affected?
Angular: 6.0.9
Material: 6.4.1

Guide de contribution

Ouvrir le guide de contribution

Piste de recherche

Commencez par reproduire le comportement dans le StackBlitz associé avec autofocus activé et un input pouvant recevoir le focus à l’intérieur de MatSidenav, puis examinez le comportement de MatSidenav et de mat-sidenav-content lors de basculements rapides. Le travail est terminé lorsque des actions répétées d’ouverture et de fermeture ne laissent plus mat-sidenav-content décalé et qu’un basculement ultérieur n’est pas nécessaire pour restaurer sa position.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Évaluation

Stack technique
angular, typescript
Domaine
frontend
Type d'issue
Bug
Difficulté
4/5
Temps estimé
3-5 jours
Activité
À l'abandon
Clarté
Plutôt claire
Accessibilité débutants
45/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.