🐛 Mac issue: Additional 17px added to min-width/min-height calculation for [data-name="sizer"]

[jalpajora]

• what edition are you using - enterprise
• version for @inovua/reactdatagrid-communityor @inovua/reactdatagrid-enterprise - ^5.8.0

Both issues has been tested in:

• Windows: Chrome Version 109
• Mac: Ventura, Monterey, Big Sur (Chrome, Safari, Firefox latest versions)

What happened:

The issue only happens in Mac. There are 2 issues but both are related to the min-width and min-height calculation for [data-name="sizer"]. Based from our tests, the size of the space is 17px.

Reproduction repository:

Issue 1: Extra space/padding on the right side of the datagrid when both horizontal and vertical scrollbar is present.

To replicate:

1. Go to https://reactdatagrid.io/docs/api-reference#props-scrollProps-scrollThumbRadius
2. Edit Code
3. Add enableColumnAutosize={false} in as a prop
4. Resize any column to make the size larger than original width until horizontal scrollbar shows.
5. Scroll datagrid to the right until the last column shows

Actual Result: Extra 17px is added on the min-width

Expected Result: No extra space is added. Just like how it is in Windows. (Note: We have tested this in Windows and no issue were found.)

Screen recording: In Mac -> https://recordit.co/fMw1hxvw5k In Windows -> https://recordit.co/wWJSVAT9Qs

Issue 2: Extra space/padding on the bottom of the datagrid when both content is smaller than the container height.

To replicate:

1. Go to https://reactdatagrid.io/demo
2. Set "Results per page" to 5
3. Check the min-height of div[data-name="sizer"]

Actual Result: Extra 17px is added on the min-height

Expected Result: No extra space is added. Just like how it is in Windows. (Note: We have tested this in Windows and no issue were found.)

Screen recording: In Mac -> https://recordit.co/zu3J1VMjwx In Windows -> https://recordit.co/cG7Cp4ocQX

Suggested solution:

Don't know where the bug happens

Hope you can reply the soonest! Thanks in advance!