[TextField] Server Rendering Warning

[puradox]

Problem description

The TextField inputId is differing between client and server. This is causing React to inject the client-side version of the TextField, resulting in the lose of isomorphic benefits.

I don't believe this to be a userAgent issue since the style is not being affected. I also don't believe this to be a NODE_ENV issue since both webpack and the server have NODE_ENV=development prefixed to their execution in package.json.

Warning

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) il-undefined-Email-15170" data-reactid="
 (server) il-undefined-Email-14601" data-reactid="

Resulting HTML

<label 
   style="position: absolute; line-height: 22px; top: 38px; transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; z-index: 1; cursor: text; transform: scale(1) translate3d(0px, 0px, 0px); transform-origin: left top 0px; pointer-events: auto; color: rgba(0, 0, 0, 0.298039); margin-left: 20px; -webkit-user-select: none;" 
   for="email-undefined-Email-15170" 
   data-reactid="9"
>
   Email
</label>

Versions

• Material-UI: 0.15.0
• React: 15.1.0
• Browser: Chrome Version 50.0.2661.94 (64-bit)

[puradox]

After some digging, I've found that this seemingly random number is actually random, thanks to Math.floor(Math.random() * 0xFFFF) from here.

Is it really wise to generate a random number for a React id? I would understand if there was a way to specify a seed for the random generator, but JavaScript's Math.random():

selects the initial seed to the random number generation algorithm; it cannot be chosen or reset by the user - MDN

Doesn't this introduce problems to server rendering?

[mbrookes]

3757 Friendly reminder to please use the search.