bug(menu): Overflow behaviour does not match the documentation
- Vorherrschende Sprache
- TypeScript
- Sterne
- 25k
- Forks
- 6.8k
- Ø Merge
- 1 T. 8 Std.
- Gemergte PRs (30 T.)
- 91
Beschreibung
### Is this a regression?
- [ ] Yes, this behavior used to work in the previous version
### The previous version in which this bug was not present was
14
### Description
The behaviour when a menu button label has a long work (that can't be broken) is different in a newly created app than on the Angular Material demo page.
The `overflow: hidden` on `.mdc-list-item__primary-text` appears to be missing.
Material documentation page edited to make the label longer:

App that copies the same code:

### Reproduction
Steps to reproduce:
1. https://components-issue-5kgmsj.stackblitz.io (this is a copy of the code from the `basic menu` example but with a long label)
2. click to open the menu
3. the label overflows the content instead of getting an ellipsis
### Expected Behavior
Ellipsis
### Actual Behavior
Overflows
### Environment
- Angular: 15.2.3
- CDK/Material: 15.2.3
- Browser(s): all
- Operating System (e.g. Windows, macOS, Ubuntu): mac
Beitragsleitfaden
Rechercherichtung
Beginne mit der Angular-Material-Menüimplementierung und ihren Styles und suche nach `.mdc-list-item__primary-text` sowie dem im Bericht referenzierten Beispiel für ein einfaches Menü. Reproduziere das lange, nicht umbrechbare Label in der verlinkten StackBlitz-App und vergleiche es mit der Demo in der Dokumentation. Als erledigt gilt, wenn das Label mit einer Ellipse abgeschnitten wird, statt überzulaufen.
Vom Indexierungsmodell aus dem Issue-Text verfasst.
Bewertung
- Tech-Stack
- angular, typescript
- Bereich
- frontend
- Issue-Typ
- Bug
- Schwierigkeit
- 3/5
- Geschätzter Aufwand
- Ein halber Tag
- Aktivitätsstatus
- Veraltet
- Klarheit
- Größtenteils klar
- Anfängerfreundlichkeit
- 45/100