angular / angular/components

bug(cdk/listbox): using scrollbar with mouse breaks

Abierto
#30,900 2 comentarios 0 reacciones 0 asignados Ver en GitHub
area: cdk/listbox P3
Lenguaje dominante
TypeScript
Estrellas
25k
Forks
6.8k
Merge medio
1 d 8 h
PR fusionados (30 d)
91

Descripción

### 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 cdk listbox on a list that scrolls, the listbox and scroll position behaves weird if that scrollbar is operated with a mouse. The behavior gets worsed if a value is selected.
Operated by mouse means either:
- clicking on the little arrows in that scrollbar
![Image](https://github.com/user-attachments/assets/122a6579-3a13-41a4-b595-ead2c72a33e0)
- clicking on a blank space within that scrollbar
![Image](https://github.com/user-attachments/assets/fa5229c2-6466-43ce-a5db-9ada9555d432)

I think there was recently a similar issue in the menu: https://github.com/angular/components/pull/30249

### Reproduction

StackBlitz link: Also broken in your docs at https://material.angular.io/cdk/listbox/examples
Steps to reproduce:
1. Got to example `Listbox with forms validation.`
2. Select option `Rat`
3. Click the down arrow two times in the scrollbar / or two times at a blank location

### Expected Behavior

It should just scroll normally.

### Actual Behavior

First click scrolls, at second click it jumps back to the top.

### Environment

- Angular: 19 / and the version your docs use
- CDK/Material: 19 / and the version your docs use
- Browser(s): Chrome
- Operating System (e.g. Windows, macOS, Ubuntu): Linux / Mac

Guía de contribución

Abrir la guía de contribución

Línea de trabajo

Comienza con el ejemplo de listbox de CDK `Listbox with forms validation` en la documentación de Angular Material y reproduce el problema seleccionando `Rat` y haciendo clic dos veces en la barra de desplazamiento. Compara el comportamiento con el cambio relacionado del menú en PR 30249. Se considera terminado cuando los clics en la barra de desplazamiento continúan desplazándose normalmente sin saltar al principio, incluso después de seleccionar un valor.

Escrito por el modelo de indexación a partir del texto del issue.

Evaluación

Stack tecnológico
angular, typescript
Área
frontend
Tipo de issue
Error
Dificultad
3/5
Tiempo estimado
1-2 días
Estado de actividad
Estancado
Claridad
Bastante claro
Aptitud para principiantes
45/100

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.