angular / angular/components

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

Đang mở
#29,183 0 bình luận 2 reaction 0 người được giao Xem trên GitHub
area: material/table P3 regression
Ngôn ngữ chính
TypeScript
Star
25k
Fork
6.8k
Merge trung bình
1 ngày 8 giờ
Pull request đã merge (30 ngày)
91

Mô tả

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

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Hướng nghiên cứu

Bắt đầu bằng cách so sánh các branch v16.1, v17.2, v17.3 và v18.0 trong repository tái hiện được liên kết, sau đó kiểm tra các quy tắc theme data-table của MDC được tham chiếu và các issue liên quan #26203 và #26730. Công việc được xem là hoàn tất khi hiệu ứng hover trên hàng hoạt động trở lại trong bảng Angular Material bị ảnh hưởng, đồng thời vẫn giữ nguyên hành vi của các cột sticky được thảo luận trong #26730.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Đánh giá

Công nghệ
angular, typescript
Lĩnh vực
frontend
Loại issue
Lỗi
Độ khó
3/5
Thời gian dự kiến
1-2 ngày
Mức độ hoạt động
Đình trệ
Độ rõ ràng
Khá rõ ràng
Mức phù hợp với người mới
42/100

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.