Skip to content

[Bug]: Shared tooltip does not open/close properly when having openAnimation/closeAnimation set to undefined #16288

@RivaIvanova

Description

@RivaIvanova

Description

When having a shared tooltip, i.e., multiple igxTooltipTargets with a single igxTooltip, setting the openAnimation/closeAnimation to undefined/null causes the tooltip not to open/close as expected when navigating between targets.

Originated from https://infragistics.visualstudio.com/Indigo_Platform/_workitems/edit/40280

  • igniteui-angular version: 20.1.x, master
  • browser: any

Steps to reproduce

  1. Configure multiple tooltip targets with a single shared tooltip.
  2. Add position settings with closeAnimation set to undefined, and set the position settings to all tooltip targets.
  3. Hover over the targets.
  4. Repeat 2 and 3, but this time set the openAnimation to undefined instead of the closeAnimation.
<igx-icon [igxTooltipTarget]="myTooltip" [positionSettings]="positionSettings">info</igx-icon>
<igx-icon [igxTooltipTarget]="myTooltip" [positionSettings]="positionSettings">favorite</igx-icon>
<!-- More targets here... -->

<div #myTooltip="tooltip" igxTooltip>Tooltip text here.</div>
// Config 1
public positionSettings: PositionSettings = {
    openAnimation: useAnimation(fadeIn, { params: { duration: '100ms' } }),
    closeAnimation: undefined,
};

// Config 2
public positionSettings: PositionSettings = {
    openAnimation: undefined,
    closeAnimation: useAnimation(fadeOut, { params: { duration: '75ms' } }),
};

Result

Config 1 - tooltip seems stuck to the first target.

Image

Config 2 - tooltip is closed immediately (expected), but is not opened for the next target, so it basically disappears. After hovering away from the targets, it is briefly shown.

Image

Expected result

When the tooltip is shown for one target, and the user interacts with another target, the tooltip is instantly hidden for the first target (without the closing animation and without respecting hideDelay) and is shown for the second target (with the appropriate animation and showDelay, if specified).

Image

Metadata

Metadata

Assignees

Type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions