storybook: Storybook 6.1.4 UI completely broken: TypeError: Cannot read property 'source' of undefined

Describe the bug I’m trying to upgrade my Storybook from 6.1.0-beta.2 to 6.1.4 without changing anything else and the UI is badly broken. The spinner runs forever and there are console errors.

To Reproduce Steps to reproduce the behavior:

Upgrade Storybook from 6.1.0-beta.2 to 6.1.4 without changing anything else.

Expected behavior The UI should work.

System

  System:
    OS: Windows 10 10.0.19042
    CPU: (4) x64 Intel(R) Core(TM) i7-6600U CPU @ 2.60GHz
  Binaries:
    Node: 14.15.0 - C:\Program Files\Node.js\node.EXE
    Yarn: 1.22.5 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 6.14.8 - C:\Program Files\Node.js\npm.CMD
  Browsers:
    Chrome: 87.0.4280.66
    Edge: Spartan (44.19041.423.0), Chromium (86.0.622.69)
  npmPackages:
    @storybook/addon-actions: 6.1.4 => 6.1.4
    @storybook/addon-knobs: 6.1.4 => 6.1.4
    @storybook/addons: 6.1.4 => 6.1.4
    @storybook/core: 6.1.4 => 6.1.4
    @storybook/react: 6.1.4 => 6.1.4
    @storybook/theming: 6.1.4 => 6.1.4

Additional context I see this error and stack trace in the console twice:

TypeError: Cannot read property 'source' of undefined
    at getEventMetadata (vendors~main.f3edf003926dde8721bc.bundle.js:31937)
    at handler (vendors~main.f3edf003926dde8721bc.bundle.js:34867)
    at vendors~main.f3edf003926dde8721bc.bundle.js:108401
    at Array.forEach (<anonymous>)
    at Channel.handleEvent (vendors~main.f3edf003926dde8721bc.bundle.js:108400)
    at PostmsgTransport.<anonymous> (vendors~main.f3edf003926dde8721bc.bundle.js:108287)
    at PostmsgTransport.handler (vendors~main.f3edf003926dde8721bc.bundle.js:71540)
    at PostmsgTransport.handleEvent (vendors~main.f3edf003926dde8721bc.bundle.js:71714)

About this issue

Original URL
State: closed
Created 4 years ago
Comments: 15 (8 by maintainers)

Most upvoted comments

Welcome to web development in 2020! 🤦‍♂️

Sadly this has been the state of web-development for some time.

tmeasday on Nov 25, 2020

After a morning’s worth of installing packages over and over, it turns out this was some weird issue with my node_modules. Every version of Storybook I tried (even going back to 6.0) was broken in the same way, in every browser, but was working just fine for a coworker. I hadn’t done a clean install in a while (i.e. blow away node_modules and all my caches and reinstall all packages from scratch), so I did that and - wouldn’t you know? - everything is working just fine now. Welcome to web development in 2020! 🤦‍♂️

Sorry for the trouble. I just installed 6.1.5 and it seems to be running normally for me.

kaiyoma on Nov 24, 2020

@ghengeveld pair programming meeting to fix it?

ndelangen on Nov 24, 2020

Im experiencing something similar, Im also on 6.1.4, using composition, everything loads OK first time, but when I try to load a new version from an external ref, spinner goy stuck and I dont see iframe.html refreshing for new version.

I dig a liitle and found that if I add a key (key = src) to https://github.com/storybookjs/storybook/blob/db9b0bd6fe8ef007334651299148d6d6ede3083d/lib/ui/src/components/preview/iframe.tsx component, now iframe.html is loaded and spinner goes by OK.

Don’t know if it’s related, but is annoying XD.

jesusmpc on Nov 24, 2020