elastic-charts icon indicating copy to clipboard operation
elastic-charts copied to clipboard

[Bar chart] tooltips longer than the page height cause page to jump

Open mbondyra opened this issue 3 years ago • 1 comments

Describe the issue Here's the bug raised in Lens: https://github.com/elastic/kibana/issues/122782 When a tooltip is longer than the page, the scroll keeps appearing and disappearing in certain positions: Jan-31-2022 13-58-13

Here's the reproducible sandbox (the buggy versions are 35.0.0+) https://codesandbox.io/s/jumpingscroll-35-0-w6sup

Here's the 34.2.1 version, the working one: https://codesandbox.io/s/jumpingscroll-34-2-g256r

mbondyra avatar Jan 31 '22 13:01 mbondyra

this will be fixed with #615

markov00 avatar Feb 28 '22 09:02 markov00

@mbondyra I've tested the example you mentioned working but it doesn't seem to work to me.

With the new tooltip redesign, this bug will be fixed, but we can't fix it with the current version because this problem depends on the style applied to the body. The tooltip DOM is attached to the body so if the body overflow prop is auto/default then the page will scroll and we can't do much (I actually don't have ideas, I really like to avoid testing for the tooltip size to reducing it size depending on the window before rendering it first because this is expensive, second because it is an edge case, third because it can be fixed by the application using the chart itself, and finally because this will be fixed in the near future with the new tooltip design

markov00 avatar Aug 23 '22 08:08 markov00