metalabdesign / flowtip / 282

57%

Pull #63

travis-ci

Fix position jank when constrained to viewport edge

When the target is scrolled outside of the viewport and the tooltip is constrained to the edge of the window, Chrome's behavior of apparently debouncing window scroll events causes the tooltip position to shift around slightly as the user scrolls. This is a consequence of the absolute positioned tooltip being transformed to appear to be fixed to the viewport edge.

To fix this, we detect scenarios where the tooltip is constrained at the viewport edge and the bounds rect is the viewport. In such scenarios, the `position` property of the rendered element is changed from `absolute` to `fixed`, which results in a constant, non-janky style property while the page scroll changes.

430 of 507 branches covered (84.81%)

94 of 94 new or added lines in 6 files covered. (100.0%)

349 of 402 relevant lines covered (86.82%)

43.87 hits per line