Navigation broken after adding showRoots option
See original GitHub issueDescribe the bug
First time loading the site doesn’t show showRoots
group titles. Refreshing the page after first load shows the group titles but now navigation doesn’t work.
This is only a problem here storybook.canopytax.com. Running this locally works.
To Reproduce Steps to reproduce the behavior:
- Go to storybook.canopytax.com
- Notice
showRoots
groups are not there, but navigation works - Refresh page
showRoots
group titles are now there- try clicking on other stories - navigation doesn’t work - requires a page refresh to load correct page
Expected behavior
- I expect the
showRoots
group titles to show on first load - I expect navigation to work
Code snippets
addParameters({
options: {
showRoots: true,
},
});
System:
System:
OS: macOS 10.15.5
CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
Binaries:
Node: 12.16.0 - ~/.nvm/versions/node/v12.16.0/bin/node
Yarn: 1.22.0 - ~/.nvm/versions/node/v12.16.0/bin/yarn
npm: 6.13.7 - ~/.nvm/versions/node/v12.16.0/bin/npm
Browsers:
Chrome: 83.0.4103.116
Firefox: 74.0
Safari: 13.1.1
npmPackages:
@storybook/addon-actions: ^6.0.0-beta.38 => 6.0.0-beta.38
@storybook/addon-docs: ^6.0.0-beta.38 => 6.0.0-beta.38
@storybook/addon-knobs: ^6.0.0-beta.38 => 6.0.0-beta.38
@storybook/addon-links: ^6.0.0-beta.38 => 6.0.0-beta.38
@storybook/addon-notes: ^5.3.19 => 5.3.19
@storybook/addon-storysource: ^6.0.0-beta.38 => 6.0.0-beta.38
@storybook/addons: ^6.0.0-beta.38 => 6.0.0-beta.38
@storybook/cli: ^6.0.0-beta.38 => 6.0.0-beta.38
@storybook/preset-scss: ^1.0.2 => 1.0.2
@storybook/react: ^6.0.0-beta.38 => 6.0.0-beta.38
Additional context
- Running it locally works
- sometimes stories don’t render
- sometimes the docs tab doesn’t render
Issue Analytics
- State:
- Created 3 years ago
- Comments:6 (1 by maintainers)
Top Results From Across the Web
Sidebar & URLS - Storybook - JS.ORG
Storybook's sidebar lists all your stories grouped by component. When you have many components, you may also wish to group those components.
Read more >Common mistakes - React Navigation
Common mistakes. This section attempts to outline issues that users frequently encounter when first getting accustomed to using React Navigation and serves ...
Read more >Visualizing Your Portal Navigation - Oracle Help Center
Typically, you add navigation visualization to page templates, so that it can be defined in one place and propagated consistently across the whole...
Read more >MIGRATION.md - Storybook - Fossies
Removed Legacy Story APIs; Can no longer add decorators/parameters after stories ... The top-level showRoots option will be removed in Storybook 7.0.
Read more >Storybook: emphasize top-level grouping (!50) · Merge requests ...
This adds top-level grouping in the storybook navigation by adding a showRoots parameter option to storybook configuration: before: image. after:.
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
I ran into a similar issue today on
6.2.8
. My initial setup hadshowRoots: false
which worked fine. Later on, I decided that I actually wanted to show top level headings. I removed the line and restarted Storybook, but the root headings still didn’t show up. I re-added the line but set it totrue
instead and restarted Storybook – still no headings.I dug around and discovered the
--no-manager-cache
flag. I restarted Storybook with this flag and they finally showed up 🎉 ! Removing theshowRoots
line also worked and I was able to launch Storybook without the flag later on.reverting back to
5.3.19
fixed the issue (version disparity somewhere?)then we followed the migration instructions to update to v6 and there’s still no issue 🤷♀️