Tooltip disappears immediately on Android

[kamilchlebek]

Bug description:

NgbTooltip disappears immediately after opening on mobile devices. Same happens when using DevTools with responsive mode enabled.

I got it fixed by enabling wrapAsyncForiOS for everyone.

ng-bootstrap/src/util/autoclose.ts

Line 23 in 59581c7

const wrapAsyncForiOS = fn => iOS ? () => setTimeout(() => fn(), 100) : fn;

Of course I could disable hover trigger, but I'd rather keep if for desktops.

edit: I've found a workaround. Add click at the beginning of default triggers (=> click hover focus)

Link to minimally-working StackBlitz that reproduces the issue:

https://angular-n4vyua.stackblitz.io (forked Quick and easy tooltips demo from docs)

Versions of Angular, ng-bootstrap and Bootstrap:

Angular: 8.2.4
ng-bootstrap: 5.2.2

[igorborborema]

I am working on Angular 11 and ng-tooltip, I am facing this issue at the moment.
First I followed the comment "Add click at the beginning of default" and it worked fine, after that I had mobile and desktop working with tooltip.
Although, in consequence of that, for mobile devices, the first click does not work fine, users have to click for the second time to have the tooltip visible, and then all the next clicks will work properly for the same element.
If user goes to another element, the behaviour will be the same.
Does anyone have similar behaviour of mine ? Thanks

[igorborborema]

I also tried to use different combinations in order of the triggers:

• triggers="hover focus click:blur"
• triggers="hover focus click"
• triggers="click:blur hover focus "
• triggers="click hover focus "

[AntoineBrunelle]

If someone needs it, works for me by doing this :

<span
  triggers="manual"
  #t="ngbTooltip"
  (click)="t.open()"
  ngbTooltip="test"
></span>