Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Eliminate unnecessary numeric equality checks #11751

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
55 changes: 55 additions & 0 deletions packages/react-dom/src/__tests__/ReactDOMInput-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -248,6 +248,23 @@ describe('ReactDOMInput', () => {
}
});

it('performs a state change from "" to 0', () => {
class Stub extends React.Component {
state = {
value: '',
};
render() {
return <input type="number" value={this.state.value} readOnly={true} />;
}
}

var stub = ReactTestUtils.renderIntoDocument(<Stub />);
var node = ReactDOM.findDOMNode(stub);
stub.setState({value: 0});

expect(node.value).toEqual('0');
});

it('distinguishes precision for extra zeroes in string number values', () => {
spyOnDev(console, 'error');
class Stub extends React.Component {
Expand Down Expand Up @@ -595,6 +612,7 @@ describe('ReactDOMInput', () => {
var node = container.firstChild;

expect(node.value).toBe('0');
expect(node.defaultValue).toBe('0');
});

it('should properly transition from 0 to an empty value', function() {
Expand All @@ -606,6 +624,43 @@ describe('ReactDOMInput', () => {
var node = container.firstChild;

expect(node.value).toBe('');
expect(node.defaultValue).toBe('');
});

it('should properly transition a text input from 0 to an empty 0.0', function() {
var container = document.createElement('div');

ReactDOM.render(<input type="text" value={0} />, container);
ReactDOM.render(<input type="text" value="0.0" />, container);

var node = container.firstChild;

expect(node.value).toBe('0.0');
expect(node.defaultValue).toBe('0.0');
});

it('should properly transition a number input from "" to 0', function() {
var container = document.createElement('div');

ReactDOM.render(<input type="number" value="" />, container);
ReactDOM.render(<input type="number" value={0} />, container);

var node = container.firstChild;

expect(node.value).toBe('0');
expect(node.defaultValue).toBe('0');
});

it('should properly transition a number input from "" to "0"', function() {
var container = document.createElement('div');

ReactDOM.render(<input type="number" value="" />, container);
ReactDOM.render(<input type="number" value="0" />, container);

var node = container.firstChild;

expect(node.value).toBe('0');
expect(node.defaultValue).toBe('0');
});

it('should have the correct target value', () => {
Expand Down
13 changes: 3 additions & 10 deletions packages/react-dom/src/client/ReactDOMFiberInput.js
Original file line number Diff line number Diff line change
Expand Up @@ -181,18 +181,11 @@ export function updateWrapper(element: Element, props: Object) {
var value = getSafeValue(props.value);

if (value != null) {
if (value === 0 && node.value === '') {
node.value = '0';
// Note: IE9 reports a number inputs as 'text', so check props instead.
} else if (props.type === 'number') {
// Simulate `input.valueAsNumber`. IE9 does not support it
var valueAsNumber = parseFloat(node.value) || 0;

if (props.type === 'number') {
if (
(value === 0 && node.value === '') ||
// eslint-disable-next-line
value != valueAsNumber ||
// eslint-disable-next-line
(value == valueAsNumber && node.value != value)
node.value != value
) {
node.value = '' + value;
}
Expand Down