React: Objects are not valid as a React child error occurring in IE11 on Win7 after update to 0.15.4

[ghost]

bug

After updating from 15.3.2 to 15.4.0, the error is showing up in previously working code. The app fails to load in IE11 on Win 7 with the following 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 or wrap the object using createFragment(object) from the React add-ons. Check the render method ofApp. File: bundle.js, Line: 13847, Column: 6

It continues to work fine in all other browsers.

Thanks

[gaearon]

Can you provide a project reproducing this?

[ghost]

Unfortunately providing a project will be difficult to do at this point. However, I did get a little closer to the root cause. It looks like if I remove the babel-polyfill import from the component that sets up all the routes, the app I can get farther along, and now the app blows up when trying to create a Promise. The hunt continues.

[gaearon]

This is a duplicate of https://github.com/facebook/react/issues/8379. Please follow troubleshooting instructions in it.

[gaearon]

Please see https://github.com/facebook/react/issues/8379#issuecomment-264858787.

[quantuminformation]

<script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>

Will fix most of your pain nowadays.

[ai360insights]

<script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>

Will fix most of your pain nowadays.

You saved my arse dude!

[macrozone]

<script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>

Will fix most of your pain nowadays.

You saved my arse dude!

mine as well!

the whole babel env, core-js stuff just does not seem to work or i am too stupid to make it work for ie11. This just solves every problem i had! ... at least when it comes to polyfills!

[marksy]

<script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>

Will fix most of your pain nowadays.

You saved my arse dude!

mine as well!

the whole babel env, core-js stuff just does not seem to work or i am too stupid to make it work for ie11. This just solves every problem i had! ... at least when it comes to polyfills!

What version on React are you on btw?

Because it sounds like IE11 is having issues with React 16.x

[macrozone]

<script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>

Will fix most of your pain nowadays.

You saved my arse dude!

mine as well!
the whole babel env, core-js stuff just does not seem to work or i am too stupid to make it work for ie11. This just solves every problem i had! ... at least when it comes to polyfills!

What version on React are you on btw?

Because it sounds like IE11 is having issues with React 16.x

16.10 or so. Yes, React needs polyfills for react 16, for Set and Map and maybe others. Unfortunatly, its very hard to know what exactly is missing, also configuring babel-env with corejs correctly is very hard. Even if most setups like nextjs should support ie11 out-of-the-box, this is rarely the case, as its very easy to break ie11 compatibility.

it's crazy how big the damage is that microsoft is still doing with the Internet Explorer, it has to be billions of dollars. And every dollar spent to support ie11 just keeps it alive for even longer.

this blog post gives a good answer: we have to stop supporting it.

[marksy]

Yeah totally agree. However it’s been like this since IE6, so that figure is probably in the trillions 🥵

I’m considering sending our ie11 users to a non-react version of a component because I don’t see the value in increasing our bundle size and spending more time on supporting legacy browsers. 👍