question-mark
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.

Error `TypeError: event is undefined` in manager.bundle.js after upgrade

See original GitHub issue

Describe the bug After updating the vite builder (https://github.com/eirslett/storybook-builder-vite) to 0.0.6, and updating Storybook to 6.3.0-alpha.25, we are greeted by the following error in the browser console:

TypeError: event is undefined

This is the line that triggers the error, because event is undefined: https://github.com/storybookjs/storybook/blob/643e7eb011a880e2b4b8d82ad360752aa9461dd6/lib/channel-postmessage/src/index.ts#L176

And the event in question is:

"message":{
   "target":"Window",
   "isTrusted":true,
   "data":"{\"key\":\"storybook-channel\",\"refId\":\"_undefined_\"}",
   "origin":"http://localhost:3000",
   "lastEventId":"",
   "source":"Window",
   "ports":"Restricted",
   "srcElement":"Window",
   "currentTarget":"Window",
   "eventPhase":2,
   "…"
}

To Reproduce Unfortunately this isn’t really easy for me to extract from our use-case. If it turns out to be hard to reproduce, I’d try my hand on a smaller repro.

System

Environment Info:

  System:
    OS: Linux 5.11 Arch Linux
    CPU: (12) x64 Intel(R) Core(TM) i7-8850H CPU @ 2.60GHz
  Binaries:
    Node: 12.22.1 - ~/.nvm/versions/node/v12.22.1/bin/node
    Yarn: 1.22.10 - /usr/bin/yarn
    npm: 6.14.12 - ~/.nvm/versions/node/v12.22.1/bin/npm
  Browsers:
    Firefox: 87.0

Additional context Not entirely sure if this error originates in Storybook, the vite builder or the unique combination of both!

Let me know if I can help further!

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:7 (5 by maintainers)

github_iconTop GitHub Comments

2reactions
Dschungelabenteuercommented, May 14, 2021

I hope I’m not completely mistaken but from what I’ve seen while taking a look at this issue, it seems like telejson’s stringify function call in @storybook/channel-postmessage’s send method does not apply properly when using the vite-builder (tested against a Vite + Vue 3 + Storybook environment). It shows no problem processing the key and refId keys. However, when processing the event key, it looks like it systematically catches a TypeError stating that isObject is not a function and returns undefined, resulting in @julrich’s error.

This happens for the following messages:

  • currentStoryWasSet
  • docsRendered
  • storySpecified
  • setStories

And this may be why:

issue-14910

shilman, if you see this, I plead not guilty Your Honor 😄

1reaction
julrichcommented, May 19, 2021

Can confirm, fixes the issue for us! Thanks a lot for the quick turnaround!

Read more comments on GitHub >

github_iconTop Results From Across the Web

Uncaught TypeError: undefined is not a function on loading ...
For me it was the json2.min.js file from version 1.0.2 of a NuGet package which was causing the problem. I switched it to...
Read more >
Uncaught TypeError: Cannot read property of undefined
If you get undefined error, you need to make sure that which ever variables throws undefined error, is assigned a value to it....
Read more >
Cannot Read Property Length of Undefined in JavaScript
The JavaScript TypeError: Cannot read property 'length' of undefined occurs when the length property is read on an undefined variable.
Read more >
How to Read React Errors (fix 'Cannot read property of ...
This error usually means you're trying to use .map on an array, but that array isn't defined yet. That's often because the array...
Read more >
TypeError: "x" is not a function - JavaScript - MDN Web Docs
Maybe there is a typo in the function name? Maybe the object you are calling the method on does not have this function?...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found