Returning plain string from component renders collapsed text nodes on server

[laverdet]

Observed this on [email protected]

import React from 'react';
import { renderToString } from 'react-dom/server';

const B = () => 'b';

console.log(renderToString(<div>{'a'}<B />{'c'}</div>));

This renders as <div data-reactroot="">a<!-- -->bc</div>. If you try to hydrate this you'll get the error: Text content did not match. Server: "bc" Client: "b".

[gaearon]

I suppose the bug here is that we do not separate b from c here but we should.

[gaearon]

React 16.1.0-beta has been released. Please update react, react-dom, and react-test-renderer (if you use it) to this version and let us know if it solved the issue! We’d appreciate if you could test before Monday when we plan to get 16.1.0 out.

[laverdet]

Everything looks good on my end, thanks!