patternfly / patternfly/patternfly-react

MenuToggle - add aria-controls prop to relate toggle and content it controls

Đang mở
#11,304 10 bình luận 0 reaction 0 người được giao Xem trên GitHub

Chưa có ai nhận issue này.

A11y Stale
Ngôn ngữ chính
TypeScript
Star
862
Fork
392
Merge trung bình
4 ngày 8 giờ
Pull request đã merge (30 ngày)
9

Mô tả

Describe the problem
With PF6, the dropdown menu popover is by default parented to the root. When the menu is open, there is no attribute which relates the popover menu back to the toggle button which opened it.

react-table ActionColumn is an example where PF owns both components but there's still no relation. It would be possible to override the MenuToggle by supplying a custom actionsToggle function.

In writing this issue, I realize it may not be possible without "hacks" for PF to relate the two when the application controls the rendering of both the toggle and menu separately.

Having a relationship between the two at the dom level would help with test automation such as cypress.

How do you reproduce the problem?
Go to https://www.patternfly.org/components/menus/dropdown
Open a dropdown menu
Using web inspector, inspect the dropdown toggle and popover menu parented to the root. Observe there is no attribute relating the two.

Expected behavior
Expected some attribute present, wether arbitrary or a11y requirement, to relate the two dom nodes.

Is this issue blocking you?
It is possible to supply an ID which then gets applied to the popover menu.

What is your product and what release date are you targeting?
RHOAI


Jira Issue: PF-998

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

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

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Hướng nghiên cứu

Bắt đầu với ví dụ trong tài liệu về dropdown của PatternFly và API của MenuToggle được mô tả trong issue. Theo dõi cách toggle và popover có root làm phần tử cha được render, sau đó xác định hành vi của các props để hai nút DOM nhận được mối quan hệ; xác minh kết quả trong ví dụ dropdown và các bài kiểm tra về khả năng truy cập hoặc tương tác của ví dụ đó, nếu có.

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

Đánh giá

Công nghệ
react, typescript
Lĩnh vực
accessibility, frontend
Loại issue
Tính năng
Độ khó
3/5
Thời gian dự kiến
1-2 ngày
Mức độ hoạt động
Ít trao đổi
Độ rõ ràng
Khá rõ ràng
Mức phù hợp với người mới
58/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.