[Bug] React 18 is not working

[ablackoff]

Describe the bug

When updating to React 18, the error drops:

reactDomClient.createRoot is not a function. (In 'reactDomClient.createRoot(el)', 'reactDomClient.createRoot' is undefined)

Steps to reproduce the behavior

1. Run the react-18 example
2. Click on "Button"

Expected behavior

Well at least there shouldn't be a mistake.

Screenshots and/or logs

Environment

• OS: MacOS
• Node.js version: v16.14.2
• NPM version: 8.5.0
• Browser (if applicable): chrome, safari

Additional context

I checked, the problem started with this line: https://github.com/storybookjs/builder-vite/compare/v0.1.27...v0.1.28?diff=split#diff-bd0c0785607831a0bfe079077208f5a4ec1b10ef8205c7b733c25b2e973312edR13

[IanVS]

Thanks for the report! I see what's going on, the dynamic import is missing a .default. I wonder why the storybook e2e tests passed, and why our own CI passed. It seems to me this has been broken since it was released...

[IanVS]

Interesting, when building for production, the methods from the default export are hoisted up directly to the parent import(). As far as I know, that's not correct behavior per the spec, but it might be some kind of esm/cjs interop helper or something. These are the lines in storybook, fwiw: https://github.com/storybookjs/storybook/blob/0de0719db837041bf937cb6aeaa2233313c001c3/app/react/src/client/preview/render.tsx#L77-L78. I'll submit a PR to storybook to address this.

[ablackoff]

I have upgraded to version 6.5.0-alpha.64, everything is working now.
Thank you.