Storybook crashes - TypeError: Cannot read property 'isLeaf' of undefined

[Rafsonic]

The storybook crashes after we updated it to the latest versions. But if we removed all MDX documents then the storybook runs correctly as expected. If we have a least one MDX document then the StoryBook crashes again.

Versions:
"react": "^17.0.1",
"@storybook/addon-actions": "6.1.14",
"@storybook/addon-docs": "6.1.14",
"@storybook/addon-knobs": "6.1.14",
"@storybook/addon-links": "6.1.14",
"@storybook/addon-viewport": "6.1.14",
"@storybook/react": "6.1.14",

Environment Info:

System:
OS: macOS 11.1
CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
Binaries:
Node: 14.15.2 - ~/.nvm/versions/node/v14.15.2/bin/node
Yarn: 1.22.10 - /usr/local/bin/yarn
npm: 6.14.9 - ~/.nvm/versions/node/v14.15.2/bin/npm
Browsers:
Chrome: 87.0.4280.141
Safari: 14.0.2

┆Issue is synchronized with this Asana task by Unito

[ethancrook99]

I've run into this as well, but only if I have a *.stories.mdx file. If I just use a regular *.mdx file for documentation, it works as normal.

[flammangj]

Happens to me as well when using *.stories.mdx alongside *.stories.tsx and assign the same title on both.

button.stories.tsx
export default { title: 'Button', component: ButtonComponent, } as Meta;

button.stories.mdx
This works:
<Meta title="Button/Documentation"/>

This will break:
<Meta title="Button"/>

[Weffe]

I've experienced the same bug on the latest stable version, v6.1.20.

What's weird in my case is I have a folder with both an *.stories.js and *.stories.mdx and the same title that seems to be working just fine. But creating the same set up in another folder for a new component I built will fail with the error message like OP's error message.

I can confirm flammangj's comment about changing the title for either the mdx or js file will fix the issue for me.

[shilman]

This sounds like a bug with the new sidebar implementation introduced in 6.1. Does anybody have a repro repo they can share?

[YozhEzhi]

@shilman I'll make demo repo tomorrow.

[YozhEzhi]

https://github.com/YozhEzhi/storybook-6-crash-demo

Steps to reproduce:

• yarn
• yarn start
• [all is fine]
• remove /DELETE_ME_AND_I_WILL_CRASH_STORYBOOK in packages/button/stories/readme.stories.mdx
• [app crashed]

[gregStevenard]

Does anyone know if this has been fixed yet ? What is the way around it ?

[shilman]

If you inspect your browser console, you should see this warning:

Duplicate title used in multiple files; use unique titles or a primary file for a component with re-exported stories.

So the workaround is to follow the instructions: this isn't intended to work in Storybook.

That said, Storybook shouldn't crash in this state, so we'll fix the bug in the next week or two.

[ghengeveld]

☝️ This should fix it.

[shilman]

Huzzah!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.2.6 containing PR #14502 that references this issue. Upgrade today to the @latest NPM tag to try it out!

npx sb upgrade

Closing this issue. Please re-open if you think there's still more to do.