Storybook: Polymer element results in error (Uncaught TypeError: Failed to construct 'HTMLElement' ...)

[danielvanmil]

Describe the bug

Storybook 5.1.3 web components with a Polymer 3 element doesn't work.

To Reproduce
Steps to reproduce the behavior:

1. Create a Polymer 3 element project by npx polymer cli. Select element project and name the element my-element.
2. Add Storybook by npx -p @storybook/cli sb init -t web_components
3. Change the default generated story to:

import "../my-element.js";

export default { title: 'Button' };

export const withText = () => '<my-element></my-element>';

export const withEmoji = () => {
  const button = document.createElement('button');
  button.innerText = '😀 😎 👍 💯';
  return button;
};

1. Start storybook

Expected behavior
The story is rendered nice in Storybook

Actual behavior
Browser error log

Uncaught TypeError: Failed to construct 'HTMLElement': Please use the 'new' operator, this DOM object constructor cannot be called as a function.
    at MyElement.PropertiesChanged (vendors~main.caaeb58bfdf70783410b.bundle.js:1456)
    at MyElement.PropertyAccessors (vendors~main.caaeb58bfdf70783410b.bundle.js:2416)
    at MyElement.TemplateStamp (vendors~main.caaeb58bfdf70783410b.bundle.js:6307)
    at MyElement.PropertyEffects (vendors~main.caaeb58bfdf70783410b.bundle.js:3950)
    at MyElement.PropertiesMixin (vendors~main.caaeb58bfdf70783410b.bundle.js:2085)
    at MyElement.PolymerElement (vendors~main.caaeb58bfdf70783410b.bundle.js:857)
    at new MyElement (main.caaeb58bfdf70783410b.bundle.js:159)
    at renderMain (vendors~main.caaeb58bfdf70783410b.bundle.js:13125)
    at _callee$ (vendors~main.caaeb58bfdf70783410b.bundle.js:12222)
    at tryCatch (vendors~main.caaeb58bfdf70783410b.bundle.js:74787)

[LambyPants]

I had this problem, too, and was able to solve it by adding to my storyfile

import '@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js';

Based on this solution https://github.com/ionic-team/ionic/issues/17411#issuecomment-461427751

[stale[bot]]

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

[stale[bot]]

Hey there, it's me again! I am going close this issue to help our maintainers focus on the current development roadmap instead. If the issue mentioned is still a concern, please open a new ticket and mention this old one. Cheers and thanks for using Storybook!