feat: Automatically closes the DropdownContainer when scrolling outside of the component #22287
Conversation
Codecov Report
@@ Coverage Diff @@
## master #22287 +/- ##
=======================================
Coverage 66.89% 66.89%
=======================================
Files 1846 1846
Lines 70297 70302 +5
Branches 7688 7689 +1
=======================================
+ Hits 47023 47027 +4
- Misses 21280 21281 +1
Partials 1994 1994
Flags with carried forward coverage won't be shown. Click here to find out more.
📣 We’re building smart automated test selection to slash your CI/CD build times. Learn more |
| @@ -249,6 +249,14 @@ const DropdownContainer = forwardRef( | |||
| [ref], | |||
| ); | |||
|
|
|||
| // Closes the popover when scrolling on the document | |||
| useEffect(() => { | |||
| document.onscroll = () => setPopoverVisible(false); | |||
There was a problem hiding this comment.
Can we add throttling? Or call it only if popover is open?
There was a problem hiding this comment.
Or we could even add the scroll listener when popover opens and remove it when popover closes
There was a problem hiding this comment.
Good suggestion. I changed the code to remove the listener when closing the popover and tested that it does not require throttling.
|
/testenv up FEATURE_HORIZONTAL_FILTER_BAR=true |
|
@kgabryje Ephemeral environment spinning up at http://34.217.43.34:8080. Credentials are |
michael-s-molina
force-pushed
the
close-dropdown-container-on-scroll
branch
from
1bc6e29
to
1945a5f
Compare
|
Ephemeral environment shutdown and build artifacts deleted. |
mistercrunch
added
🏷️ bot
SUMMARY
Automatically closes the
DropdownContainerwhen scrolling outside of the component.BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF
Screen.Recording.2022-11-30.at.4.23.05.PM.mov
TESTING INSTRUCTIONS
Check the video for instructions.
ADDITIONAL INFORMATION