Incompatible numbro.js v2.1.2 with HOT

Getting help Questions
1

Hi,

I am using React wrapper of HOT.
I encountered " RangeError: toFixed() digits arguments must be between 0 and 100" error when I input a cell with a number for a specific column.
This only happens with a production build product.
I used React “react-scripts build” cra tool which internally uses a webpack to build.

I found a link that describes exactly what my problem is except I am using React .

The solution to this is using an older version (2.1.1) to avoid incompatible issue with numbro.
But I found that handontable fixed the version to 2.1.2 in January.

Solely doing ‘npm install numbro@2.1.1’ doesn’t help with the issue now.

My versions:
Handsontable @7.4.2
Numbro @2.1.2
react @16.13.1

What I found is that if I downgrade handsontable to “7.3.0” and with a numbro 2.1.1, the issue disappears, everything working fine. However, I don’t want to downgrade handsontable since I need future functionalities. I can only fix numbro version, but that doesn’t work.

Any solution to this?

Thanks,
Terry W

2

Hi @marius.editoiu

I think it worth checking your app with our beta.2 version of 8.0.0.
I know that we haven’t updated our React wrapper. So when we update I inform you about this. And then we could test your app.

Here’s a full list of changes https://github.com/handsontable/handsontable/releases/tag/8.0.0-beta.2 and
NPM https://www.npmjs.com/package/handsontable/v/8.0.0-beta.2

3

Hi @piotr.nowak,
Thanks for your response.
I checked the list of updates of version Beta 2 8.0.0, it only does say numbro will be freeze to version 2.1.2, which is currently the case as of HOT version 7.4.2.
Do you mean that beta2 of v8.0.0 did a fix to the incompatible issue with numbro which eliminates any ‘RangeError’ from numbro?
If so, how was the solution? And when we can expect that to be in react wrapper?
In the meantime, any workarounds?

Thanks,
Terry

4

Our React developer works on this right now. Here is a link to PR - https://github.com/handsontable/react-handsontable/pull/191

As @wojciechczerniak said in the thread you can install v8.0.0-beta.2 with the one that is currently published to NPM https://github.com/handsontable/react-handsontable/pull/191#issuecomment-661035602

We tested it in the vanilla version I the error disappear.
If you want you could try in your react app. Error should disappear.

All feedback’s appreciated.

5

Hi,
I tried to install + handsontable@8.0.0-beta.2 with + numbro@2.3.1 .
The error still appear.

The old error "RangeError: “precision -1 out of range” still appear when a cell input a number or a number value in the cell.

Another new error “o is undefined” pops up when loading an empty HOT table, which never happen before:

console of new error :
TypeError: “o is undefined”
value columnSorting.js:1050
value columnSorting.js:450
value pluginHooks.js:2113
runHooks core.js:4108
value tableView.js:1239
columnHeaders tableView.js:727
value columnHeaders.js:225
value table.js:324
value index.js:126
value table.js:414
value core.js:105
value tableView.js:272
_refreshBorders core.js:4224
render core.js:1812
value columnSorting.js:1028
value columnSorting.js:1093
e _base.js:71
value pluginHooks.js:2113
runHooks core.js:4108
updateSettings core.js:2223
value react-handsontable.js:2404
value react-handsontable.js:2472
React 2
unstable_runWithPriority scheduler.production.min.js:309
React 4
unstable_runWithPriority scheduler.production.min.js:309
React 5
t MaterialDetails.js:96
l runtime.js:45
_invoke runtime.js:265
t runtime.js:98
Babel 2

6

As well as tried, handsontable@8.0.0-beta.2 with numbro @2.1.1
Same two error appear

7

Thank you @marius.editoiu for your help and effort.

It’s not good then.
Could you share with us your implementation?

Here is a base React demo that you can use to pass your code - https://codesandbox.io/s/fetch-data-1bk6y

9

Hello,

I found a fix to this issue.
react dependency “react-scripts”: “3.0.1” is not compatible.
Needs to upgrade to version 3.1.1 or above.

It doesn’t auto-update by ^ in package json file.

Thank you for your help.

Terry

10

Thank you @marius.editoiu for the information.