angular / angular/components

bug(material/table): Row hover effect is not working since v17.2 (maybe earlier)

Abierto
#29,183 0 comentarios 2 reacciones 0 asignados Ver en GitHub
area: material/table P3 regression
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?

- [X] Yes, this behavior used to work in the previous version

### The previous version in which this bug was not present was

Angular 16

### Description

In Angular Material 16, it was possible to have an hover effect on the entire row of tables, as demonstrated in #26203 (as long as we were able to workaround the bug described in #26203).

After a migration to Angular Material 17, the hover effect disappeared. And it is still not back in v18.

The [spec defines row hover](https://m2.material.io/components/data-tables#behavior), and [MDC supports it ](https://github.com/material-components/material-components-web/blob/cfec83c749a1b6b6602c4d2fa474d3e776e7c97b/packages/mdc-data-table/_data-table-theme.scss#L411).

### Reproduction

You might clone the reproduction repository locally via https://github.com/PowerKiKi/mat-table-v17-does-not-highlight-rows-on-mouseover-anymore. It includes branches for v16.1, v17.2, v17.3 and v18.0.

Or else, see the repo directly on StackBlitz:

- [On v16.1](https://stackblitz.com/~/github.com/PowerKiKi/mat-table-v17-does-not-highlight-rows-on-mouseover-anymore/tree/v16.1), mouseover will works.
- [On v17.2](https://stackblitz.com/~/github.com/PowerKiKi/mat-table-v17-does-not-highlight-rows-on-mouseover-anymore/tree/v17.2), mouseover will not work anymore.
- [Even on the latest v18.0](https://stackblitz.com/~/github.com/PowerKiKi/mat-table-v17-does-not-highlight-rows-on-mouseover-anymore/tree/v18.0), mouseover will not work anymore

### Expected Behavior

Row hover effect must be either be enabled by default, like in v16, or if it might break sticky columns as described in #26730, it should be at least enableable via an attribute/config somewhere.

### Actual Behavior

Row hover effect is not happening anymore.

### Environment

- Angular: 16.1 / 17.2
- CDK/Material: 16.1 / 17.2
- Browser(s): Chrome 125
- Operating System (e.g. Windows, macOS, Ubuntu): Ubuntu

Guía de contribución

Abrir la guía de contribución

Línea de trabajo

Comienza comparando las ramas v16.1, v17.2, v17.3 y v18.0 en el repositorio de reproducción enlazado; después, inspecciona las reglas de tema data-table de MDC referenciadas y los issues relacionados #26203 y #26730. El trabajo estará terminado cuando el hover de las filas vuelva a funcionar en la tabla de Angular Material afectada, conservando al mismo tiempo el comportamiento de las columnas sticky descrito en #26730.

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
42/100

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.