angular / angular/components

[MatSidenav] Sidenav Toggling Can Cause Content Shifting

Offen
#12,349 3 Kommentare 7 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen
area: material/sidenav P3
Vorherrschende Sprache
TypeScript
Sterne
25k
Forks
6.8k
Ø Merge
1 T. 8 Std.
Gemergte PRs (30 T.)
91

Beschreibung

#### 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

Beitragsleitfaden

Beitragsleitfaden öffnen

Rechercherichtung

Beginne damit, das Verhalten im verknüpften StackBlitz mit aktiviertem autofocus und einem fokussierbaren input innerhalb von MatSidenav zu reproduzieren, und untersuche anschließend das Verhalten von MatSidenav und mat-sidenav-content während schneller Umschaltungen. Als erledigt gilt die Aufgabe, wenn wiederholtes Öffnen und Schließen mat-sidenav-content nicht mehr verschoben zurücklässt und keine anschließende Umschaltung erforderlich ist, um seine Position wiederherzustellen.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
angular, typescript
Bereich
frontend
Issue-Typ
Bug
Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
45/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.