angular / angular/components

bug(material/autocomplete): Scrolling autocomplete entries does not work when virtual-keyboard is visible

Aperta
#28,290 4 commenti 0 reazioni 0 assegnatari Vedi su GitHub
android area: material/autocomplete P2
Lingua principale
TypeScript
Stelle
25k
Fork
6.8k
Merge medio
1g 8h
PR unite (30g)
91

Descrizione

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

_No response_

### Description

When using the mat-autocomplete on a mobile device and the auto-complete is not at the top of the screen. Then the scrolling of the autocomplete does not work or the point where the autocomplete can be scrolled is below the autocomplete.

https://github.com/angular/components/assets/51996054/3acabe93-5328-487a-999c-a2cfe4ea0355

### Reproduction

StackBlitz link: https://material.angular.io/components/autocomplete/examples#autocomplete-optgroup
I was not able to reproduce it at StackBlitz maybe it has something todo with the stucture and the scrolling areas of the page.

Steps to reproduce:
1. Open it on an device with an virtual keyboard
2. click in the autocomplete of "Option groups autocomplete" when its in the bottom part of the screen

### Expected Behavior

Expected to scroll the autocompletion entries whenever the autocompletion entries are visible.

### Actual Behavior

Actual the scrolling does not work as expected.
https://github.com/angular/components/assets/51996054/3acabe93-5328-487a-999c-a2cfe4ea0355

### Environment

- Angular: 17.0.4
- CDK/Material: 17.0.4
- Browser(s): Chrome (120.0.6099.115)
- Operating System (e.g. Windows, macOS, Ubuntu): Android

Guida per i contributori

Apri la guida per i contributori

Direzione di ricerca

Inizia con l’esempio di optgroup di autocomplete di StackBlitz e riproduci il problema su Android Chrome con una tastiera virtuale, posizionando l’autocomplete vicino alla parte inferiore dello schermo. Confronta lo scorrimento quando la tastiera è visibile e identifica l’entry point del component o dell’overlay coinvolto. Il lavoro è completato quando le voci visibili dell’autocomplete scorrono normalmente in questa posizione.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Valutazione

Stack tecnologico
angular, typescript
Ambito
frontend
Tipo di issue
Bug
Difficoltà
4/5
Tempo stimato
3-5 giorni
Stato di attività
Ferma
Chiarezza
Da chiarire
Idoneità per principianti
35/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.