Environment:

• OSX 10.11.6
• Chrome 62.0.3202.94
• [email protected]

Consider the following component:

const Input = () =>
  <input type="text" spellcheck="false" aria-invalid="false" />;

I would expect this to be rendered as:

<input type="text" spellcheck="false" aria-invalid="false" />

But the actual output is:

<input type="text" spellcheck="true" aria-invalid="false" />

I'm able get the desired spellcheck value by setting it to an empty string in the component, but aria-invalid behaves differently

const Input = () =>
  <input type="text" spellcheck="" aria-invalid="" />;

Now the rendered output is:

<input type="text" spellcheck="false" aria-invalid />

Ultimately, I have to pass different values to the spellcheck and aria-invalid attributes in the component to get the same values in the output:

const Input = () =>
  <input type="text" spellcheck="" aria-invalid="false" />;

<input type="text" spellcheck="false" aria-invalid="false" />