[Bug / Help] Having separator just break stories

[raulfdm]

Describe the bug

For some reason, after I upgrade SB from 6.0.21 to 6.0.26 together with a BUNCH of other dependencies my stories just had broken.

After some debugging I notice that it's because of the separator (check Gif).

• PR with this problem: https://github.com/raulfdm/raulmelo.dev/pull/1046/files
• Online version: https://5f845c2fe6479bbe743dea45--raulmelo-dev-storybook.netlify.app/

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.
You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of `storyFn`.

To Reproduce

Steps to reproduce the behavior:

1. In your terminal, paste git clone https://github.com/raulfdm/raulmelo.dev.git separator-bug
2. Navigate into the cloned folder: cd separator-bug
3. Then, checkout to the branch I have this problem: git checkout upgrade-deps
4. Install the dependencies using yarn: yarn install
5. navigate to projects/web folder: cd projects/web/
6. run: yarn storybook
7. open localhost:6006 and check the error;
8. Then, open any story inside Blog folder, like: src/screens/Blog/components/AvailableTranslations/AvailableTranslations.stories.tsx
9. remove the separator
10. Check the changed story in the browser

Shell steps:

git clone https://github.com/raulfdm/raulmelo.dev.git separator-bug
cd separator-bug
git checkout upgrade-deps
yarn install
cd projects/web
yarn storybook # It might be needed to run with NODE_ENV=test

Expected behavior

It should work just fine with the separator.

Screenshots

(For better visualize, open in a new tab)

System

Environment Info:

  System:
    OS: macOS 10.15.6
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
  Binaries:
    Node: 12.18.4 - ~/.asdf/installs/nodejs/12.18.4/bin/node
    Yarn: 1.22.4 - /usr/local/bin/yarn
    npm: 6.14.6 - ~/.asdf/installs/nodejs/12.18.4/bin/npm
  Browsers:
    Chrome: 85.0.4183.121
    Edge: 86.0.622.38
    Safari: 14.0

Additional context

As you can see the PR, I upgrade all dependencies from this project and also completely regenerate yarn.lock. I have a gut feelings that it's conflict with the babel config I have inside ./projects/web/.babel.config.js but I cannot explain why.

[raulfdm]

Hey there... Any feedback about this case?

[shilman]

No idea. I'm assuming you also removed node_modules. Did you try clearing yarn cache? Maybe also try:

yarn why @storybook/core

[raulfdm]

I've tried cleaning cache and removing node_modules. Didn't solve this problem.

Btw, I'm gonna close this issue because I no longer have a repo with this setup.