From 06ab12e2ce5a73b1bf122d86b393cdd6ef5586cd Mon Sep 17 00:00:00 2001 From: Shammamah Hossain Date: Mon, 13 Jan 2020 13:44:20 -0500 Subject: [PATCH 1/7] Manually convert values to numbers. --- src/components/Input.react.js | 17 ++++++++++++++--- 1 file changed, 14 insertions(+), 3 deletions(-) diff --git a/src/components/Input.react.js b/src/components/Input.react.js index 4d7f6727f..83ab26e96 100644 --- a/src/components/Input.react.js +++ b/src/components/Input.react.js @@ -28,10 +28,12 @@ export default class Input extends PureComponent { this.onKeyPress = this.onKeyPress.bind(this); this.setInputValue = this.setInputValue.bind(this); this.setPropValue = this.setPropValue.bind(this); + this.getValueAsNumber = this.getValueAsNumber.bind(this); } componentWillReceiveProps(nextProps) { - const {value, valueAsNumber} = this.input.current; + const {value} = this.input.current; + const valueAsNumber = this.getValueAsNumber(value); this.setInputValue( isNil(valueAsNumber) ? value : valueAsNumber, nextProps.value @@ -42,7 +44,8 @@ export default class Input extends PureComponent { } componentDidMount() { - const {value, valueAsNumber} = this.input.current; + const {value} = this.input.current; + const valueAsNumber = this.getValueAsNumber(value); this.setInputValue( isNil(valueAsNumber) ? value : valueAsNumber, this.props.value @@ -89,6 +92,13 @@ export default class Input extends PureComponent { ); } + getValueAsNumber(value) { + if (parseInt(value, 10) !== parseFloat(value)) { + return parseFloat(value); + } + return parseInt(value, 10); + } + setInputValue(base, value) { const __value = value; base = this.input.current.checkValidity() ? convert(base) : NaN; @@ -109,7 +119,8 @@ export default class Input extends PureComponent { } onEvent() { - const {value, valueAsNumber} = this.input.current; + const {value} = this.input.current; + const valueAsNumber = this.getValueAsNumber(value); if (this.props.type === 'number') { this.setPropValue( this.props.value, From 79142f9fad57fa805631f607dc245d3db0dc1407 Mon Sep 17 00:00:00 2001 From: Shammamah Hossain Date: Mon, 13 Jan 2020 17:06:35 -0500 Subject: [PATCH 2/7] Update CHANGELOG. --- CHANGELOG.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index d61b96152..e85fb875b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -10,6 +10,9 @@ This project adheres to [Semantic Versioning](http://semver.org/). - Added responsiveness on graph parent element resize (previously only worked on window.resize) - Added new `dash-graph--pending` class to dcc.Graph, present while resizing, (re-)rendering, loading +### Fixed +- [#731](https://github.com/plotly/dash-core-components/pull/731) Fixed bug in which input components with type `number` did not correctly update their values. + ### Changed - [#723](https://github.com/plotly/dash-core-components/pull/723) Changed npm package content to allow source code inclusion from other projects - [#725](https://github.com/plotly/dash-core-components/pull/725) Improve async graph performance by parallelizing resource fetching instead of fetching sequentially From cb9f69b8456d63c36c91ea80af9aed2c47b594ee Mon Sep 17 00:00:00 2001 From: Shammamah Hossain Date: Tue, 14 Jan 2020 10:17:32 -0500 Subject: [PATCH 3/7] Save parseInt and parseFloat values. --- src/components/Input.react.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/Input.react.js b/src/components/Input.react.js index 83ab26e96..dada3e644 100644 --- a/src/components/Input.react.js +++ b/src/components/Input.react.js @@ -93,10 +93,10 @@ export default class Input extends PureComponent { } getValueAsNumber(value) { - if (parseInt(value, 10) !== parseFloat(value)) { - return parseFloat(value); - } - return parseInt(value, 10); + let intVal = parseInt(value, 10); + let floatVal = parseFloat(value); + + return intVal == floatVal ? intVal : floatVal; } setInputValue(base, value) { From 096f0139c461f18da16dd0e2513c2728f79cecbc Mon Sep 17 00:00:00 2001 From: Shammamah Hossain Date: Tue, 14 Jan 2020 10:34:18 -0500 Subject: [PATCH 4/7] Use unary plus to convert to number. --- src/components/Input.react.js | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/src/components/Input.react.js b/src/components/Input.react.js index dada3e644..0d8ab10ea 100644 --- a/src/components/Input.react.js +++ b/src/components/Input.react.js @@ -93,10 +93,8 @@ export default class Input extends PureComponent { } getValueAsNumber(value) { - let intVal = parseInt(value, 10); - let floatVal = parseFloat(value); - - return intVal == floatVal ? intVal : floatVal; + const numericValue = convert(value); + return numericValue % 1 === 0 ? Math.floor(numericValue) : numericValue; } setInputValue(base, value) { From 24b3b9d3ba179f4965473d82c300264bbcb14244 Mon Sep 17 00:00:00 2001 From: Shammamah Hossain Date: Tue, 21 Jan 2020 11:06:19 -0500 Subject: [PATCH 5/7] Directly return result of convert. --- src/components/Input.react.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/Input.react.js b/src/components/Input.react.js index 0d8ab10ea..31be316ca 100644 --- a/src/components/Input.react.js +++ b/src/components/Input.react.js @@ -93,8 +93,7 @@ export default class Input extends PureComponent { } getValueAsNumber(value) { - const numericValue = convert(value); - return numericValue % 1 === 0 ? Math.floor(numericValue) : numericValue; + return convert(value); } setInputValue(base, value) { From 21281dec3be2bafb98ea01fa056a1f1209ee7f21 Mon Sep 17 00:00:00 2001 From: Shammamah Hossain Date: Tue, 21 Jan 2020 12:47:46 -0500 Subject: [PATCH 6/7] Remove unnecessary wrapper function. --- src/components/Input.react.js | 11 +++-------- 1 file changed, 3 insertions(+), 8 deletions(-) diff --git a/src/components/Input.react.js b/src/components/Input.react.js index 31be316ca..50304459f 100644 --- a/src/components/Input.react.js +++ b/src/components/Input.react.js @@ -28,12 +28,11 @@ export default class Input extends PureComponent { this.onKeyPress = this.onKeyPress.bind(this); this.setInputValue = this.setInputValue.bind(this); this.setPropValue = this.setPropValue.bind(this); - this.getValueAsNumber = this.getValueAsNumber.bind(this); } componentWillReceiveProps(nextProps) { const {value} = this.input.current; - const valueAsNumber = this.getValueAsNumber(value); + const valueAsNumber = convert(value); this.setInputValue( isNil(valueAsNumber) ? value : valueAsNumber, nextProps.value @@ -45,7 +44,7 @@ export default class Input extends PureComponent { componentDidMount() { const {value} = this.input.current; - const valueAsNumber = this.getValueAsNumber(value); + const valueAsNumber = convert(value); this.setInputValue( isNil(valueAsNumber) ? value : valueAsNumber, this.props.value @@ -92,10 +91,6 @@ export default class Input extends PureComponent { ); } - getValueAsNumber(value) { - return convert(value); - } - setInputValue(base, value) { const __value = value; base = this.input.current.checkValidity() ? convert(base) : NaN; @@ -117,7 +112,7 @@ export default class Input extends PureComponent { onEvent() { const {value} = this.input.current; - const valueAsNumber = this.getValueAsNumber(value); + const valueAsNumber = convert(value); if (this.props.type === 'number') { this.setPropValue( this.props.value, From d6b72307503bf478881cd7c53622ad5db035e4d0 Mon Sep 17 00:00:00 2001 From: Shammamah Hossain Date: Tue, 21 Jan 2020 13:28:18 -0500 Subject: [PATCH 7/7] Update CHANGELOG.md MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-Authored-By: Marc-André Rivet --- CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index d55374c75..662d6e504 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -20,7 +20,7 @@ This project adheres to [Semantic Versioning](http://semver.org/). - Added new `dash-graph--pending` class to dcc.Graph, present while resizing, (re-)rendering, loading ### Fixed -- [#731](https://github.com/plotly/dash-core-components/pull/731) Fixed bug in which input components with type `number` did not correctly update their values. +- [#730](https://github.com/plotly/dash-core-components/pull/730) Fixed bug in which input components with type `number` did not correctly update their values. ### Changed - [#723](https://github.com/plotly/dash-core-components/pull/723) Changed npm package content to allow source code inclusion from other projects