Bug on Scrollspy
Prerequisites
-
I have searched for duplicate or closed issues -
I have validated any HTML to avoid common problems -
I have read the contributing guidelines
Describe the issue
Scrollspy seems to be broken (Sorry, I've cutted the begining of the video, so it's black at first for few seconds) :
Description of the video above :
- With the example in navbar :
- I click on the
Second
button - I move to the second part but the dropdown button is selected
- I click on the
- With the nested nav :
- I click on the
Item 1.1
button - There is an unintended scroll to the top of the page (I think that's normal with the actual implementation + was here before the reforge of Scrollspy) + the button
Item 1.2
is now highlighted. - I move back to the top
- Then I slowly move until
Item 2
is selected then move up a bit : Nothing is selected anymore - I move back to the top until
Item 1
is selected - Then I slowly move down and
Item 1.1
is never selected +Item 1
is selected then is not selected for some frames before being selected again
- I click on the
To sum up :
- Moving with links seems to apply
.active
on the link just after the one clicked when it throws a ScrollEvent down and works well with ScrollEvent up. - Scrolling up and down seems to break the Scrollspy appearance. Seems like the ScrollEvent down and ScrollEvent up are handled in a different way.
- Optional, but would be great to don't scroll on the whole page when a button is clicked (Appears only for nested nav and list-group examples)
Reduced test cases
Go on https://twbs-bootstrap.netlify.app/docs/5.1/components/scrollspy/#example-with-nested-nav and try to move slowly downwards and upwards on the nested scrollspy.
What operating system(s) are you seeing the problem on?
Windows
What browser(s) are you seeing the problem on?
Chrome, Firefox
What version of Bootstrap are you using?
5.2.0 (current_main_branch)