SAP / ui5-webcomponents

UI5 Web Components - the enterprise-flavored sugar on top of native APIs! Build SAP Fiori user interfaces with the technology of your choice.
https://sap.github.io/ui5-webcomponents/
Apache License 2.0
1.51k stars 263 forks source link

[ui5-li-notification-group]: Focus is trapped #8768

Closed LidiyaGeorgieva closed 2 months ago

LidiyaGeorgieva commented 5 months ago

Bug Description

See the steps to reproduce

Affected Component

No response

Expected Behaviour

No response

Isolated Example

No response

Steps to Reproduce

  1. open https://sap.github.io/ui5-webcomponents/storybook/playground/fiori/pages/NotificationListGroupItem/?sap-ui-theme=sap_fiori_3
  2. find to "Payments" group
  3. click the second list item
  4. press "arrow up" on the keyboard
  5. try to press "arrow up" or "arrow down"
  6. focus is trapped (can be moved only with "tab", but not with the arrows)

Log Output, Stack Trace or Screenshots

No response

Priority

Medium

UI5 Web Components Version

main

Browser

Chrome

Operating System

No response

Additional Context

No response

Organization

No response

Declaration

dimovpetar commented 5 months ago

Hello @SAP/ui5-webcomponents-topic-rd ,

ui5-busy-indicator intercepts all keydown and keyup events and stops their propagation. This is the reason why the focus stays trapped at the busy notification list item. Besides keyboard, you also can't focus the busy item with the mouse, because the busy indicator adds pointer-events: none style.

Best regards, Petar