angular / angular/components

bug(dialog): usage of MAT_DIALOG_DEFAULT_OPTIONS resets default options

Đang mở
#28,096 1 bình luận 3 reaction 0 người được giao Xem trên GitHub
area: material/dialog P3
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?

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

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

_No response_

### Description

This is either a documentation issue or an issue with the behaviour of `MAT_DIALOG_DEFAULT_OPTIONS`.

When specifying
```js
{
provide: MAT_DIALOG_DEFAULT_OPTIONS,
useValue: {
panelClass: 'mat-field-inside-dialog-workaround',
} as MatDialogConfig
}
```

The `autoFocus` of dialogs gets disabled, this is unexpected as the developer never stated it to be disabled and [the documentation states](https://material.angular.io/components/dialog/overview#focus-management):
> When opened, MatDialog traps browser focus such that it cannot escape the root role="dialog" element. **By default, the first tabbable element in the dialog receives focus.** You can customize which element receives focus with the autoFocus property of MatDialogConfig, which supports the following values.

###

### Reproduction

StackBlitz link: https://stackblitz.com/edit/kxsrvy?file=src%2Fexample%2Fdialog-overview-example.ts
Steps to reproduce:
1. Open Dialog
2. There is no focus set on the input
3. Comment out the `MAT_DIALOG_DEFAULT_OPTIONS ` in `main.ts`.
1. Open Dialog
2. There **is** focus set on the input

### Expected Behavior

The default should be kept,

Otherwise the documentation should be revised that overwriting another property can change others.

### Actual Behavior

Overwriting one property of `MatDialogConfig` in `MAT_DIALOG_DEFAULT_OPTIONS` changes the default behaviour of unrelated (not overwritten properties).

### Environment

- Angular: 16.2.5
- CDK/Material: 16.2.12
- Browser(s): Edge
- Operating System (e.g. Windows, macOS, Ubuntu): Windows 11

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

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

Hướng nghiên cứu

Bắt đầu với bản tái hiện trên StackBlitz và kiểm tra provider MAT_DIALOG_DEFAULT_OPTIONS trong main.ts. So sánh hành vi focus quan sát được với tài liệu về quản lý focus của dialog và xác định vấn đề nằm ở hành vi hay ở tài liệu. Công việc được xem là hoàn tất khi bản tái hiện và hành vi focus mặc định dự kiến được đối chiếu thống nhất.

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ó
4/5
Thời gian dự kiến
3-5 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
35/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.