-
Notifications
You must be signed in to change notification settings - Fork 303
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix: dismiss login flyout when moving out of the popup #2637
Conversation
Thank you for creating a Pull Request @Mnickii. This is a checklist for the PR reviewer(s) to complete before approving and merging this PR:
|
The updated storybook is available here |
The updated storybook is available here |
This seems to fail when using Shift+Tab to come back to the previous focused element. |
The updated storybook is available here |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Fix Shift+Tab behavior, or eliminate it
Needs to close when focus moves outside of the item with the keyboard.
Different options:
- making the flyout a focus trap and requiring the user to press Escape to close the flyout like a dialog
- using a blur event to track when focus leaves the flyout
The updated storybook is available here |
This pull request has been automatically marked as stale because it has been marked as requiring author feedback but has not had any activity for 7 days. It will be closed if no further activity occurs within 7 days of this comment. |
The updated storybook is available here |
The updated storybook is available here |
@Mnickii any update on the requested changes from @gavinbarron? |
@sebastienlevert I've been working on this ; using the blur event to track the popup losing focus leads to the popup getting dismissed without the user tabbing through all the elements ( in the case of multiple accounts). I have fixed the shift+tab behaviour but tabbing back to previous element e.g tabbing back to the theme toggle, still results to initial issue of flyout not being dismissed. The fix I'm trying next is making the flyout a focus trap and requiring the user to press Escape to close the flyout. |
The updated storybook is available here |
The updated storybook is available here |
The updated storybook is available here |
1 similar comment
The updated storybook is available here |
The updated storybook is available here |
1 similar comment
The updated storybook is available here |
rewrite implementation to handle shift+tab natively Co-authored-by: Gavin Barron <[email protected]>
The updated storybook is available here |
The updated storybook is available here |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Great work! Thanks for getting this done :)
Closes #2250
PR Type
Bugfix
Description of the changes
hides login flyout when last focusable element is tabbed through
PR checklist
yarn build
) and changes have been tested in at least two supported browsers (Edge + non-Chromium based browser)yarn setLicense
)Other information