storybook: Storybook not working in IE11

Bug summary

It seems that something broke in v4.0.0-alpha.16 and has remained broken through v4.0.0-alpha.18. Using a fresh install of storybook into a brand new CRA, the storybook doesn’t load.

Having done some cursory research, this issue looks potentially relevant and in particular this comment.

Steps to reproduce

yarn global add create-react-app @storybook/cli@4.0.0-alpha.18 @babel/core
create-react-app cra
cd cra
getstorybook
yarn storybook

Navigate to the storybook page in IE11. The page is blank, and the console has 2 instances of this error:

SCRIPT5022: Objects are not valid as a React child (found: object with keys {$$typeof, type, key, ref, props, _owner, _store}). If you meant to render a collection of children, use an array instead.
File: manager.bundle.js, Line 30065, Column: 1

Please specify which version of Storybook and optionally any affected addons that you’re running

@storybook/react @4.0.0-alpha.16+

Affected platforms

IE11

About this issue

Original URL
State: closed
Created 6 years ago
Reactions: 8
Comments: 33 (21 by maintainers)

Most upvoted comments

I just added import '@babel/polyfill'; as first import in the addons.js which solved the problem.

ranzwertig on Oct 9, 2018

@shilman unfortunately it doesn’t seem to have fixed it.

pelotom on Jan 4, 2019

I’m experiencing this problem on 4.1.11… Too early to say it needs to be re-opened - it could be my funky TypeScript / Babel / Vue setup, but the issue looks to be the exact same at face value.

Edit: Disregard - it was absolutely me - I had some TS that wasn’t going through babel - works perfectly 😃

jlandrum on Jan 31, 2019

found a solution

// .storybook/.babelrc
{
  "presets": [
    [
      "@babel/preset-env",
      {
        "useBuiltIns": "entry"
      }
    ]
  ]
}

and we need to exclude it from the exclude 🎉 😁

// .storybook/webpack.config.js
const path = require('path');

module.exports = (storybookBaseConfig, configType, defaultConfig) => {
  defaultConfig.resolve.modules.push('bower_components');

  defaultConfig.module.rules[0].exclude = /regep\/path\/to\/node_modules(?!\/lit-html)/;

  return defaultConfig;
};

I will clean this exclude of exclude up later… so if anyone is interested just let me know… have to run now

daKmoR on Oct 13, 2018

sorry again. updated to 5.2.4 and it seems it works without a problem now. would you still like a reproduction repo?

danbirle on Nov 1, 2019

Just released https://github.com/storybooks/storybook/releases/tag/v4.1.9 that I’m pretty sure fixes it (just tested it with https://storybooks-official.netlify.com/). Closing this now, but … famous last words. Please re-open if you still have problems. Fingers crossed!!!

shilman on Jan 23, 2019