File tree 2 files changed +30
-0
lines changed
packages/calcite-components/src/components/tooltip
2 files changed +30
-0
lines changed Original file line number Diff line number Diff line change @@ -98,6 +98,7 @@ export default class TooltipManager {
98
98
99
99
private pointerMoveHandler = ( event : PointerEvent ) : void => {
100
100
if ( event . defaultPrevented ) {
101
+ this . closeHoveredTooltip ( ) ;
101
102
return ;
102
103
}
103
104
Original file line number Diff line number Diff line change @@ -348,6 +348,35 @@ describe("calcite-tooltip", () => {
348
348
expect ( await positionContainer . isVisible ( ) ) . toBe ( false ) ;
349
349
} ) ;
350
350
351
+ it ( "should close when hover event is prevented" , async ( ) => {
352
+ const page = await newE2EPage ( ) ;
353
+ await page . setContent ( html `
354
+ < calcite-tooltip reference-element ="ref "> content</ calcite-tooltip >
355
+ < div id ="button-container ">
356
+ < div id ="ref "> referenceElement</ div >
357
+ </ div >
358
+ ` ) ;
359
+ await skipAnimations ( page ) ;
360
+ await page . waitForChanges ( ) ;
361
+
362
+ const positionContainer = await page . find ( `calcite-tooltip >>> .${ CSS . positionContainer } ` ) ;
363
+
364
+ const ref = await page . find ( "#ref" ) ;
365
+ await ref . hover ( ) ;
366
+ await page . waitForTimeout ( TOOLTIP_OPEN_DELAY_MS ) ;
367
+ expect ( await positionContainer . isVisible ( ) ) . toBe ( true ) ;
368
+
369
+ await page . $eval ( "#button-container" , ( buttonContainer ) => {
370
+ buttonContainer . addEventListener ( "pointermove" , ( event ) => {
371
+ event . preventDefault ( ) ;
372
+ } ) ;
373
+ } ) ;
374
+
375
+ await ref . hover ( ) ;
376
+ await page . waitForTimeout ( TOOLTIP_CLOSE_DELAY_MS ) ;
377
+ expect ( await positionContainer . isVisible ( ) ) . toBe ( false ) ;
378
+ } ) ;
379
+
351
380
it ( "should honor hover interaction with span inside" , async ( ) => {
352
381
const page = await newE2EPage ( ) ;
353
382
You can’t perform that action at this time.
0 commit comments