Storybook 5.x canvas view broken

[cemusta]

We are using storybook 5.x with styled-component-theme addon, here the full versions:

    "@storybook/addon-actions": "5.2.5",
    "@storybook/addon-knobs": "5.2.5",
    "@storybook/addon-notes": "5.2.5",
    "@storybook/addon-options": "5.2.5",
    "@storybook/addon-viewport": "5.2.5",
    "storybook-addon-styled-component-theme": "^1.2.5",
    "@storybook/react": "5.2.5",

There was no error on the browser and the storybook console however when I click the 'canvas view' button, the canvas view only shows a blank page.

After disabling all plugins one by one, I noticed styled-component is the culprit.

Just removing the addDecorator part is enough for making canvas view again.

Live links:
https://mph-global.appspot.com/

Sample story:
https://mph-global.appspot.com/?path=/story/welcome-to--storybook

Not working canvas view:
https://mph-global.appspot.com/iframe.html?id=welcome-to--storybook

[vpapadopou]

I'm having the same issue too, any ideas on what is causing this?

[eyalse]

same here (had to disable) after updating to storybook 5.3

[amitzur]

@echoulen so, this was labelled as a good-first-issue. Can you provide a pointer to how to fix this?
Thanks!

[sami616]

This is also a pain point for me. Also happy to help with anything to fix this

[nicolabella]

I am having this same issue. Is there a fix or workaround?

[majklovec]

Have switched to https://github.com/semoal/themeprovider-storybook and preview works.

[sami616]

Thanks @majklovec this solved my issue

[nicolabella]

Worked for me too. Thanks @majklovec!

[samlucax]

Worked for me too, great! Thanks @majklovec !

[sami616]

I unfortunately ran into some rendering issues with ‘themeprovider-storybook’ so ended up switching to the more generic ‘addon-contexts’ which is perfect!

https://www.npmjs.com/package/@storybook/addon-contexts

[ghernandezr]

Thanks!!! @sami616 , I solved my issue