eui
eui copied to clipboard
[Docs] page no longer scrolls to section when clicking in the sidenav
The logic in scroll_to_hash.tsx still fires correctly to focus the section & scroll to it, but the added EuiScreenReaderLive+EuiSkipLink combination fights back, taking focus again & I believe that is also reverting the scroll position.
Great catch! I was wondering why this was happening 😬
Actually - am I going crazy or does this focus fighting primarily seem to only happen on webpack dev hot reload? It isn't happening at all on prod during normal run of the mill browsing or page refreshing (e.g. https://elastic.github.io/eui/#/theming/theme-provider#simple-instance-overrides)
Ah, it happens for me in prod&dev but only when navigating to a sub-section through the sidenav - initial page load always scrolls to the target section.
Dug in a little more and it looks like the scrolling issue is solved by passing { preventScroll: true } to the focus call in EuiScreenReaderLive. There's still a fight between this focus code and similar in scroll_to_hash.tsx, so we need to decide how we want to handle that instead of trying to focus 2 locations 😅
It's not happening for me on prod/latest Firefox or Chrome personally:

Can you take a screencap of what you're seeing?
I have seen it happen on local dev but I think that was during hot reloads 🤔
Ah, there are so many ways to get somewhere! It happens when going from one page to another page's subsection.
https://user-images.githubusercontent.com/313125/183977504-4e6ed747-5d26-446b-abe7-6226400938fc.mov
ohh i totally brainfarted on search! that makes sense, thank you!