[#9712] fix <input type="number" /> value '.98' should not be equal t…

…o '0.98'. (#9714) (#9929)

* [#9712] fix <input type="number" /> value ".98" should not be equal to "0.98".

* fix eslint error

* fix label error

fixtures/dom/src/components/fixtures/number-inputs/NumberInputDecimal.js

@@ -0,0 +1,33 @@
+const React = window.React;
+
+import Fixture from '../../Fixture';
+
+class NumberInputDecimal extends React.Component {
+  state = { value: '.98' };
+  changeValue = () => {
+    this.setState({
+      value: '0.98',
+    });
+  }
+  render() {
+    const {value} = this.state;
+    return (
+      <Fixture>
+        <div>{this.props.children}</div>
+
+        <div className="control-box">
+          <input
+            type="number"
+            value={value}
+            onChange={(e) => {
+             this.setState({value: e.target.value}); 
+            }}
+          />
+          <button onClick={this.changeValue}>change.98 to 0.98</button>
+        </div>
+      </Fixture>
+    );
+  }
+}
+
+export default NumberInputDecimal;

src/renderers/dom/client/wrappers/ReactDOMInput.js

@@ -220,8 +220,12 @@ var ReactDOMInput = {
         // Simulate `input.valueAsNumber`. IE9 does not support it
         var valueAsNumber = parseFloat(node.value, 10) || 0;
 
-        // eslint-disable-next-line
-        if (value != valueAsNumber) {
+        if (
+          // eslint-disable-next-line
+          value != valueAsNumber ||
+          // eslint-disable-next-line
+          (value == valueAsNumber && node.value != value)
+        ) {
           // Cast `value` to a string to ensure the value is set correctly. While
           // browsers typically do this as necessary, jsdom doesn't.
           node.value = '' + value;

src/renderers/dom/client/wrappers/__tests__/ReactDOMInput-test.js

@@ -86,6 +86,23 @@ describe('ReactDOMInput', () => {
     });
   });
 
+  it('does change the string ".98" to "0.98" with no change handler', () => {
+    class Stub extends React.Component {
+      state = {
+        value: '.98',
+      };
+      render() {
+        return <input type="number" value={this.state.value} />;
+      }
+    }
+
+    var stub = ReactTestUtils.renderIntoDocument(<Stub />);
+    var node = ReactDOM.findDOMNode(stub);
+    stub.setState({value: '0.98'});
+
+    expect(node.value).toEqual('0.98');
+  });
+
   it('should display `defaultValue` of number 0', () => {
     var stub = <input type="text" defaultValue={0} />;
     stub = ReactTestUtils.renderIntoDocument(stub);