react-component / react-component/slider

High-precision step values throw an error in toFixed

Open
#533 0 comments 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
3.1k
Forks
768
Avg merge
11d 22h
Merged PRs (30d)
5

Description

If a slider has a step with a very long string of decimal places, ensureValuePrecision will try to make the shortest string possible to represent that value.

The problem is that it makes a call to Number.prototype.toFixed with a value that can potentially be quite high, but if the argument to toFixed is too high, it will throw an error and crash the rendering code.

In the latest ECMAScript draft the maximum value is 100, which is what Chrome and Firefox implement. But Safari and Edge use the ES 2015 maximum of 20.

You could cap the precision at 20, but per the newer draft spec, if the number of digits is higher than that, it just returns the original string anyway. So I'd probably recommend doing that.

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start in src/utils.js at ensureValuePrecision, where the issue identifies the toFixed call that receives excessive precision. Verify the behavior with a slider step containing many decimal places, then confirm rendering no longer throws in browsers with different toFixed limits and that the value remains represented as described in the issue.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react
Domain
frontend
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.