No longer delay showing tooltip while focusing an element (#16296)

Fix (ui): `TooltipManager` tooltips should immediately show up when triggered by user focus for better responsiveness and accessibility. --------- Co-authored-by: Aleksander Nowodzinski <[email protected]>
ckeditor · May 8, 2024 · 9a6b96b · 9a6b96b
1 parent 8193f02
commit 9a6b96b
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 16 deletions.
diff --git a/packages/ckeditor5-ui/src/tooltipmanager.ts b/packages/ckeditor5-ui/src/tooltipmanager.ts
@@ -307,7 +307,12 @@ export default class TooltipManager extends DomEmitterMixin() {
 		}
 
 		this._unpinTooltip();
-		this._pinTooltipDebounced( elementWithTooltipAttribute, getTooltipData( elementWithTooltipAttribute ) );
+
+		if ( evt.name === 'focus' ) {
+			this._pinTooltip( elementWithTooltipAttribute, getTooltipData( elementWithTooltipAttribute ) );
+		} else {
+			this._pinTooltipDebounced( elementWithTooltipAttribute, getTooltipData( elementWithTooltipAttribute ) );
+		}
 	}
 
 	/**

diff --git a/packages/ckeditor5-ui/tests/tooltip/tooltipmanager.js b/packages/ckeditor5-ui/tests/tooltip/tooltipmanager.js
@@ -398,13 +398,9 @@ describe( 'TooltipManager', () => {
 					sinon.assert.callOrder( unpinSpy, pinSpy );
 				} );
 
-				it( 'should pin a tooltip with a delay', () => {
+				it( 'should pin a tooltip without a delay', () => {
 					utils.dispatchFocus( elements.a );
 
-					sinon.assert.notCalled( pinSpy );
-
-					utils.waitForTheTooltipToShow( clock );
-
 					sinon.assert.calledOnce( pinSpy );
 					sinon.assert.calledWith( pinSpy, {
 						target: elements.a,
@@ -434,21 +430,12 @@ describe( 'TooltipManager', () => {
 
 					utils.waitForTheTooltipToShow( clock );
 
-					sinon.assert.calledOnce( pinSpy );
+					sinon.assert.calledTwice( pinSpy );
 					sinon.assert.calledWith( pinSpy, {
 						target: elements.b,
 						positions: sinon.match.array
 					} );
 				} );
-
-				it( 'should not show up anchor after focus unrelated element without tooltip', () => {
-					utils.dispatchFocus( elements.a );
-					utils.dispatchFocus( elements.unrelated );
-
-					utils.waitForTheTooltipToShow( clock );
-
-					sinon.assert.notCalled( pinSpy );
-				} );
 			} );
 		} );