Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Upgrading to React 17 on app level breaks UI

See original GitHub issue

Here’s the repro: https://github.com/Hypnosphi/test-storybook-react-17

Error I get is:

react.development.js:1431 Uncaught Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://fb.me/react-invalid-hook-call for tips about how to debug and fix this problem.
    at resolveDispatcher (react.development.js:1431)
    at Object.useContext (react.development.js:1439)
    at useTheme (emotion-theming.browser.esm.js:112)
    at useMenu (vendors~main.619dfba2fee0a3e45bd3.bundle.js:25841)
    at Object.mapper [as current] (vendors~main.619dfba2fee0a3e45bd3.bundle.js:26274)
    at ManagerConsumer (vendors~main.619dfba2fee0a3e45bd3.bundle.js:1484)
    at renderWithHooks (vendors~main.619dfba2fee0a3e45bd3.bundle.js:42664)
    at mountIndeterminateComponent (vendors~main.619dfba2fee0a3e45bd3.bundle.js:45343)
    at beginWork (vendors~main.619dfba2fee0a3e45bd3.bundle.js:46457)
    at HTMLUnknownElement.callCallback (vendors~main.619dfba2fee0a3e45bd3.bundle.js:28049)

Brief debugging showed that useTheme imports React from DLL while the rest of manager UI imports it from node_modules/@storybook/ui/node_modules/react