Improved focus trap implementation by preserving focus state and removing sentinels, in PR #5243, by @OEvgeny
Description
This PR aims to improve the focus trap implementation in Web Chat by removing focus sentinels and preserving the focused element state. The changes enhance the user experience and accessibility of the chat interface, particularly when navigating through activities adaptive cards.
Specific Changes
Removed FocusRedirector from FocusTrap and adjusted the implementation to handle focus without sentinels
Added functionality to preserve the latest focused element within the FocusTrap
Implemented custom tab handling to ensure proper focus cycling within the trap
Added a test case focusManagement.preserve.html to verify the new focus behavior
Updated FocusTrap component to use more modern React patterns and improved types
[x] I have added tests and executed them locally
[x] I have updated CHANGELOG.md
[ ] ~I have updated documentation~
Review Checklist
This section is for contributors to review your work.
[x] Accessibility reviewed (tab order, content readability, alt text, color contrast)
[x] Browser and platform compatibilities reviewed
[x] ~CSS styles reviewed (minimal rules, no z-index)~
[x] ~Documents reviewed (docs, samples, live demo)~
[x] ~Internationalization reviewed (strings, unit formatting)~
[x] ~package.json and package-lock.json reviewed~
[x] ~Security reviewed (no data URIs, check for nonce leak)~
Changelog Entry
Description
This PR aims to improve the focus trap implementation in Web Chat by removing focus sentinels and preserving the focused element state. The changes enhance the user experience and accessibility of the chat interface, particularly when navigating through activities adaptive cards.
Specific Changes
FocusRedirector
fromFocusTrap
and adjusted the implementation to handle focus without sentinelsFocusTrap
focusManagement.preserve.html
to verify the new focus behaviorFocusTrap
component to use more modern React patterns and improved typesCHANGELOG.md
Review Checklist
z-index
)~package.json
andpackage-lock.json
reviewed~