pharos icon indicating copy to clipboard operation
pharos copied to clipboard

Storybook: Tab loses selected state on window resize in React Reports page example

Open daneah opened this issue 1 year ago • 0 comments

Expected behavior

Tabs should maintain their selected state regardless of window resizing

Actual behavior

Tab loses selected state when resizing the window enough to trigger the sidenav reactivity

Steps to reproduce the issue

  1. Visit https://pharos.jstor.org/storybooks/react/?path=/story/pages-reports--reports
  2. Observe the Report history tab is selected
  3. Using either the Storybook chrome or the full browser window, narrow the window until the sidenav collapses
  4. Observe the Report history tab has lost its selected state

Screenshots or code

Screenshot 2024-03-08 at 16 08 32

Pharos version 14.0.0

Additional information

This may be some confluence of Sidenav reactivity logic, Tab selection logic, ResizeObserver behavior, and React hooks behavior.

daneah avatar Mar 08 '24 21:03 daneah