diff --git a/.changeset/breezy-jobs-report.md b/.changeset/breezy-jobs-report.md new file mode 100644 index 0000000000..3c1b0e9f42 --- /dev/null +++ b/.changeset/breezy-jobs-report.md @@ -0,0 +1,5 @@ +--- +'@primer/view-components': patch +--- + +Ensure tooltip does not reopen errantly unless focus is visible diff --git a/app/components/primer/alpha/tool_tip.ts b/app/components/primer/alpha/tool_tip.ts index a01d0b1d59..96dd38931a 100644 --- a/app/components/primer/alpha/tool_tip.ts +++ b/app/components/primer/alpha/tool_tip.ts @@ -291,7 +291,11 @@ class ToolTipElement extends HTMLElement { // Ensures that tooltip stays open when hovering between tooltip and element // WCAG Success Criterion 1.4.13 Hoverable - const shouldShow = event.type === 'mouseenter' || event.type === 'focus' + const shouldShow = + event.type === 'mouseenter' || + // Only show tooltip on focus if running in headless browser (for tests) or if focus ring + // is visible (i.e. if user is using keyboard navigation) + (event.type === 'focus' && (navigator.webdriver || this.control.matches(':focus-visible'))) const isMouseLeaveFromButton = event.type === 'mouseleave' && (event as MouseEvent).relatedTarget !== this.control &&