FormidableLabs / rapscallion

Asynchronous React VirtualDOM renderer for SSR.
MIT License
1.39k stars 50 forks source link

It doesnt seem to work with ImmutableJS #113

Open oskarleonard opened 7 years ago

oskarleonard commented 7 years ago

I am getting this error: TypeError: Unknown node of type: undefined at traverse.js:373:9

When i try to do this in a comp

    return (
        <div className="footer__container">
            {
                links && links.map((link, index) => {
                    return (
                        <p key={index}>dfdfdf</p>
                    );
                })
            }
        </div>
    );

However, if i change the link to a regular js list it will work:

    return (
        <div className="footer__container">
            {
                links && links.toJS().map((link, index) => {
                    return (
                        <p key={index}>dfdfdf</p>
                    );
                })
            }
        </div>
    );

When i log the list to the console, you clearly see the props of the regular list while the ImmutableJS list will only display object. And you can see the type prop on the regular list.

image

image

Razem commented 6 years ago

I've just gotten the exact same error for the exact same reason. It would be really cool if we had support for Immutable.js since lots of people use it in their projects.

kitten commented 6 years ago

Have you tried calling “.toArray()” after “.map”, otherwise React will use immutable’s iterables which rapscallion probably doesn’t support

Razem commented 6 years ago

@philpl Sure, it worked. But since React supports Immutable lists, I would expect the same from Rapscallion.

ryan-roemer commented 6 years ago

To help my understanding of the changes involved, can someone point me to how React handles things or a pseudo-code diff of what the changes would involve to be immutable-compatible?

divmain commented 6 years ago

Hi @wayweary. Can you provide a reduced repro that I can work against? This should definitely be addressable, but it'll be easier if I start without having to recreate your broken experience. @Razem, feel free to jump in, too :)

Razem commented 6 years ago

@divmain Here is an example: https://github.com/Razem/rapscallion-immutable-test

As you can see, it can be successfully rendered using the ReactDOMServer.renderToString method, but Rapscallion fails to recognize Immutable objects as iterables.

I believe the problem is somewhere in src/render/traverse.js.

Also note that since React 16, keys are also rendered for Immutable maps. Which is not happening in React 15. So {testMap.map((item, key) => (<span key={key}>{item} </span>))} would actually render a<span>Hello </span>b<span>World </span> instead of just <span>Hello </span><span>World </span>. But since the Rapscallion is focused on React 15, it should probably render the output wihout the keys.