Closed
Description
Do you want to request a feature or report a bug?
Bug
What is the current behavior?
When the following is rendered to string using ReactDOM:
<select value=""><option>a ({`b`})</option></select>
I get
<select data-reactroot=""><option>a (b)</option></select>
When hydrating the above code, I get this warning:
Warning: Text content did not match. Server: "a (b)" Client: "a ("
Fiddle: https://jsfiddle.net/z1q0azjL/1/
What is the expected behavior?
I should get:
<select data-reactroot=""><option>a (<!-- -->b<!-- -->)</option></select>
Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?
16.1.1
This has something to do with flattenOptionChildren
in ReactPartialRenderer.js.
PS:
When browsing ReactPartialRenderer.js, I found this code:
props = Object.assign(
{
selected: undefined,
children: undefined,
},
props,
{
selected: selected,
children: optionChildren,
},
);
What is the point of those undefined
props when they are overwritten later on?