15

I was following this example and found out that the table takes quite some time to render the tooltip. It doesn't seem to have any delay whatsoever, and I have tried both defaultBrowserTooltip as well as the custom one but both of them are slow. Any given tips on this?

P/S: I'm using React

Some way that I have tried:

tooltipField: 'myTooltipField'

tooltip: (value: string): string => value
Tree Nguyen
  • 937
  • 11
  • 33
  • instead of putting a bounty on this, you may want to reconsider and provide an MVCE (see: https://stackoverflow.com/help/minimal-reproducible-example). This might also help you understand the problem a bit better. As it is now, there is simply nothing to go on. The problem could be anything, including hell of a slow developer machine... – konqi May 27 '19 at 15:44
  • @konqi The issue is present in the linked library demo page, not inherent to a specific set-up. – Etheryte Aug 07 '19 at 09:31

4 Answers4

13

Ag-grid uses an internal service called TooltipManager to display the given tooltips.
For some reason it uses a default delay of 2 seconds:

private readonly MOUSEOVER_SHOW_TOOLTIP_TIMEOUT = 2000;

This value is currently not configurable by any settings interface, making it available is in the backlog.

If you're brave of heart and don't mind breaking changes when updating the library in the future, you can hack it by getting the correct reference from the bean bag.

private onGridReady(params: GridReadyEvent) {
    // NB! This is unsupported and may break at any time
    try {
      (params.api as any).context.beanWrappers.tooltipManager.beanInstance.MOUSEOVER_SHOW_TOOLTIP_TIMEOUT = 0;
    } catch (e) {
      console.error(e);
    }
}

Caveat emptor, but currently this seems to be the only way to remove the built-in delay.

Etheryte
  • 20,940
  • 10
  • 58
  • 98
  • 1
    This works. Another problem I'm facing is, there seems to be no delay at all after the initial appearance. So if I set the delay to 500ms, this only works for the first time. When I move my mouse over to another element with tooltip, it will display immediately instead of delaying for 500ms. Which is annoying. Do you know if theres a solution to this as well? – FeCH Oct 17 '19 at 20:00
  • 1
    @FeCH Haven't looked into it myself since we didn't need that usage, you can check out [the tooltipManager.ts source](https://github.com/ag-grid/ag-grid/blob/master/packages/ag-grid-community/src/ts/widgets/tooltipManager.ts#L81) for more implementation details. – Etheryte Oct 17 '19 at 20:53
  • it is deprecated in v23.0 – shutsman May 27 '20 at 12:52
  • how about this issue? do you know any solution? https://stackoverflow.com/questions/62047444/ag-grid-keep-open-tooltip-for-a-certain-predefined-time – shutsman May 27 '20 at 16:08
5

There is now a property for this called tooltipShowDelay, it was included in version 23.0.0 released on march 17th 2020. Docs https://www.ag-grid.com/javascript-grid-properties/#miscellaneous and changelog https://www.ag-grid.com/ag-grid-changelog/?fixVersion=23.0.0

Mathias
  • 5,422
  • 2
  • 29
  • 44
4

This is directly "borrowed" from user demostheneslld who commented on the ag-grid GitHub feature request, but you can set enableBrowserTooltips: true on the grid options object and then the tooltips will be displayed natively by the browser, rather than formatted by ag-grid. The tooltips then appear almost instantly.

S. Baggy
  • 894
  • 9
  • 20
  • Did not work for me on chrome. It just changed the style of the tooltip, but still seemed to take ~2seconds. – DannyMoshe May 03 '20 at 18:23
1

There is a new prop released now:

tooltipShowDelay={0}

this above code will show tooltip instantly. More Info

Arty
  • 721
  • 9
  • 26