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

fix(rangeinput): allow input of numbers with precision #5541

Merged
merged 8 commits into from
May 11, 2023

Conversation

Haroenv
Copy link
Contributor

@Haroenv Haroenv commented Mar 13, 2023

Summary

While we set the step correctly based on the precision, we didn't actually allow input of values with decimal separator because the "inbetween" situation (like 1.) isn't a valid number, causing the state to reset.

Vue didn't have this issue, as it wasn't parsing the number until the form is being submitted.

CR-2948
FX-2274

Result

To solve this, we keep the values as a string in the state, we cast them as number when we refine().
Dot decimal separator is working as expected, comma is not supported as before.

While we set the `step` correctly based on the precision, we didn't actually allow input of values with decimal separator because the "inbetween" situation (like 1.) isn't a valid number, causing the state to reset.

To solve this, we prevent saving the value to react state if the value is invalid. The browser will take over from there and show warnings if it's not a number.

CR-2948
@Haroenv Haroenv requested review from aymeric-giraudet, a team and dhayab and removed request for a team March 13, 2023 15:52
@codesandbox-ci
Copy link

codesandbox-ci bot commented Mar 13, 2023

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 10dc88a:

Sandbox Source
InstantSearch.js Configuration
react-instantsearch-app Configuration
example-react-instantsearch-hooks-default-theme Configuration
example-vue-instantsearch-default-theme Configuration

@Haroenv Haroenv marked this pull request as draft March 14, 2023 09:57
@Haroenv Haroenv dismissed aymeric-giraudet’s stale review March 21, 2023 10:40

other problems shown

# Conflicts:
#	packages/instantsearch.js/src/__tests__/common.test.tsx
#	packages/react-instantsearch-hooks-web/src/__tests__/common.test.tsx
#	packages/vue-instantsearch/src/__tests__/common.test.js
#	tests/common/index.ts
@FabienMotte FabienMotte marked this pull request as ready for review April 28, 2023 17:06
Copy link
Contributor Author

@Haroenv Haroenv left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

😎 cool!

@Haroenv Haroenv mentioned this pull request May 2, 2023
@dhayab dhayab merged commit fb48951 into master May 11, 2023
@dhayab dhayab deleted the fix/range-input-precision branch May 11, 2023 10:02
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants