Isomorphic render issue on 1.0rc2

[dhalbrook]

I haven't looked into this deeply, but i'm seeing render warnings on client-side render in our isomorphic app. Looks like some state is being incremented on persistence? This is using 1.0rc2.

Warning: React attempted to reuse markup in a container but the checksum was invalid. This generally means that you are using server rendering and the markup generated on the server was not what the client was expecting. React injected new markup to compensate which works but you have lost many of the benefits of server rendering. Instead, figure out why the markup being generated is different on the client or server:
 (client) r" id="react-select-2--value" data-react
 (server) r" id="react-select-3--value" data-react

[dhalbrook]

Seems it increments a global InstanceID on mount:

componentWillMount() {
        this._instancePrefix = 'react-select-' + (this.props.instanceId || ++instanceId) + '-';
        const valueArray = this.getValueArray(this.props.value);

        if (this.props.required) {
            this.setState({
                required: this.handleRequired(valueArray[0], this.props.multi),
            });
        }
    }

It appears I can solve this by setting the instanceID as a prop, but it would be nice if this were solved using default settings.

[dhalbrook]

Looks like there is still an issue:

Warning: React attempted to reuse markup in a container but the checksum was invalid. This generally means that you are using server rendering and the markup generated on the server was not what the client was expecting. React injected new markup to compensate which works but you have lost many of the benefits of server rendering. Instead, figure out why the markup being generated is different on the client or server:
 (client) -reactid="7"><input role="combobox" aria
 (server) -reactid="7"><input aria-expanded="false

[dhalbrook]

It appears like Object.assign is not acting consistently between node's runtime and Chrome. From Select.js#820

    ```
// TODO: Check how this project includes Object.assign()
        const inputProps = Object.assign({}, this.props.inputProps, {
            role: 'combobox',
            'aria-expanded': '' + isOpen,

[andreme]

instanceID is also a (undocumented) property. Set it to make sure it's the same on server and client.

[andreme]

Oh just saw you found that - weird, I'm running isomorphic as well and don't have a problem with node and Chrome.

[dhalbrook]

Looks like i'm running into this now: facebook/react#6451

[EgorKluch]

Hi! I get same error in my isomorphic app.

Warning: React attempted to reuse markup in a container but the checksum was invalid. This generally means that you are using server rendering and the markup generated on the server was not what the client was expecting. React injected new markup to compensate which works but you have lost many of the benefits of server rendering. Instead, figure out why the markup being generated is different on the client or server:
(client) r" id="react-select-2--value" data-react
(server) r" id="react-select-5--value" data-react

Please, fix it, or add prop instanceID to Docs.