Skip to content
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 tooltips opening when focus is removed while displaying #2281

Merged

Conversation

keithamus
Copy link
Member

This is an issue when, for example, a dialog with a tooltip on the show button closes and the focus changes, because the tool-tip element opens and doesn't get hidden when the focus moves away.

This fixes that by registering a global focusin listener to check after a brief period of time if the showing tooltip was focussed into is still focussed. If it is not then it gets hidden.

This in theory would create a small flash of the tooltip but our animations on tooltips gives us enough buffer so that the tooltip isn't visible right away.

Authors: Please fill out this form carefully and completely.

Reviewers: By approving this Pull Request you are approving the code change, as well as its deployment and mitigation plans.
Please read this description carefully. If you feel there is anything unclear or missing, please ask for updates.

What are you trying to accomplish?

Screenshots

Integration

List the issues that this change affects.

Closes # (type the GitHub issue number after #)

Risk Assessment

  • Low risk the change is small, highly observable, and easily rolled back.
  • Medium risk changes that are isolated, reduced in scope or could impact few users. The change will not impact library availability.
  • High risk changes are those that could impact customers and SLOs, low or no test coverage, low observability, or slow to rollback.

What approach did you choose and why?

Anything you want to highlight for special attention from reviewers?

Accessibility

  • Fixes axe scan violation - This change fixes an existing axe scan violation.
  • No new axe scan violation - This change does not introduce any new axe scan violations.
  • New axe violation - This change introduces a new axe scan violation. Please describe why the violation cannot be resolved below.

Merge checklist

  • Added/updated tests
  • Added/updated documentation
  • Added/updated previews (Lookbook)
  • Tested in Chrome
  • Tested in Firefox
  • Tested in Safari
  • Tested in Edge

Take a look at the What we look for in reviews section of the contributing guidelines for more information on how we review PRs.

This is an issue when, for example, a dialog with a tooltip on the show
button closes and the focus changes, because the tool-tip element opens
and doesn't get hidden when the focus moves away.

This fixes that by registering a global focusin listener to check after
a brief period of time if the showing tooltip was focussed into is still
focussed. If it is not then it gets hidden.

This in theory would create a small flash of the tooltip but our
animations on tooltips gives us enough buffer so that the tooltip isn't
visible right away.
@changeset-bot
Copy link

changeset-bot bot commented Oct 11, 2023

🦋 Changeset detected

Latest commit: 981066a

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@primer/view-components Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@keithamus keithamus temporarily deployed to preview October 11, 2023 12:24 — with GitHub Actions Inactive
@github-actions github-actions bot added the javascript Pull requests that update Javascript code label Oct 11, 2023
@jonrohan jonrohan merged commit 46d5d9c into main Oct 17, 2023
24 of 26 checks passed
@jonrohan jonrohan deleted the fix-tooltips-opening-when-focus-is-removed-while-displaying branch October 17, 2023 17:25
@jonrohan jonrohan temporarily deployed to preview October 17, 2023 17:25 — with GitHub Actions Inactive
@primer primer bot mentioned this pull request Oct 17, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
javascript Pull requests that update Javascript code patch release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants