From 4c7aca2e6a4a5ef2fc299fc8c7b7462778022d72 Mon Sep 17 00:00:00 2001 From: Vladimir Komolov <77komolovvladimir@gmail.com> Date: Fri, 15 Dec 2023 15:46:52 +0300 Subject: [PATCH] Fix OuiPopover does not change position on the scroll (#1184) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Vladimir Komolov <77komolovvladimir@gmail.com> Signed-off-by: Комолов Владимир --- CHANGELOG.md | 1 + src/components/popover/popover.tsx | 8 ++++---- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index fe54402711..ca23a5215e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -40,6 +40,7 @@ - Prevent action buttons of OuiDataGridCell from moving the content ([#1224](https://github.com/opensearch-project/oui/pull/1224)) - Fix vertical alignment and font weight of breadcrumbs that are buttons or links ([#1232](https://github.com/opensearch-project/oui/pull/1232)) - Fix datagrid lines ([#1250](https://github.com/opensearch-project/oui/pull/1250)) +- Fix OuiPopover does not change position on the scroll ([#1184](https://github.com/opensearch-project/oui/pull/1184)) ### 🚞 Infrastructure diff --git a/src/components/popover/popover.tsx b/src/components/popover/popover.tsx index 02d8d6788a..faca7bc75f 100644 --- a/src/components/popover/popover.tsx +++ b/src/components/popover/popover.tsx @@ -532,7 +532,7 @@ export class OuiPopover extends Component { } if (this.props.repositionOnScroll) { - window.addEventListener('scroll', this.positionPopoverFixed); + window.addEventListener('scroll', this.positionPopoverFixed, true); } } @@ -545,9 +545,9 @@ export class OuiPopover extends Component { // update scroll listener if (prevProps.repositionOnScroll !== this.props.repositionOnScroll) { if (this.props.repositionOnScroll) { - window.addEventListener('scroll', this.positionPopoverFixed); + window.addEventListener('scroll', this.positionPopoverFixed, true); } else { - window.removeEventListener('scroll', this.positionPopoverFixed); + window.removeEventListener('scroll', this.positionPopoverFixed, true); } } @@ -565,7 +565,7 @@ export class OuiPopover extends Component { } componentWillUnmount() { - window.removeEventListener('scroll', this.positionPopoverFixed); + window.removeEventListener('scroll', this.positionPopoverFixed, true); clearTimeout(this.respositionTimeout); clearTimeout(this.closingTransitionTimeout); cancelAnimationFrame(this.closingTransitionAnimationFrame!);