Slate: Slate fails in IE11. Objects are not valid as a React child (found: List)

Created on 14 Aug 2017  Â·  9Comments  Â·  Source: ianstormtaylor/slate

Bug in IE11.

Slate fails in IE because it uses Symbol data type.

I have add this to my webpack config to polyfill Symbol:

config.entries = [
  "core-js/es6/array.js", // because Slate uses Array.prototype.find
  "core-js/es6/symbol.js",
  "core-js/fn/symbol/iterator.js",
  ...
]

But still get an error in IE11.

Objects are not valid as a React child (found: List [ [object Object] ]). 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 of Node.

I found, it can be fixed by modify Slate's Node code. We should add .toJS() call

renderText() {
   ...
   return (
     <span data-key={node.key}>
        {leaves.toJS()}
     </span>
    );
   ...
}

Will you approve pull request with this change or easier just make a fork?

Or maybe someone have another idea how to fix it in better way?

bug âš‘ cross platform

All 9 comments

Have made changes here. leaves.toJS() were redundant.

For the for of loops, wouldn't it just be a question of tweaking that Babel config that Slate uses for its exported files? I'm assuming that for of is supported everywhere else, so we haven't been transpiling it before now, but I'm open to adding support for that.

I found old discussion at babel repo.
@kittens (on of main contributors of babel) claims that:

It's impossible to replicate for...of without a Symbol and iterator polyfill. Babel ships with a version of core-js that you can use, see the docs for more info.

@ianstormtaylor should I make a pull request?

@kvolkovich-sc that would be great, thank you! For the find util, can we use lodash/find instead? Thanks!

Merged in master. Closed.

@kvolkovich-sc did you get to the bottom of Objects being Lists in IE11? Was that a problem with your code?

@danburzo As it turned out, this was not a problem. I did not go into details. Works - do not touch. =)

Was this page helpful?
0 / 5 - 0 ratings

Related issues

Slapbox picture Slapbox  Â·  3Comments

bunterWolf picture bunterWolf  Â·  3Comments

ianstormtaylor picture ianstormtaylor  Â·  3Comments

gorillatron picture gorillatron  Â·  3Comments

chrpeter picture chrpeter  Â·  3Comments