ScrollPanel: Default scroll bars start to appear when zooming out with the browser

[ThomDevine]

Describe the bug

The further I shrink the browser zoom, the more some browser-default scrollbars appear in the ScrollPanel. Viewable on the ScrollPanel demo page.

While researching the issue to see if other scroll panel libraries are affected by it, I came across this one which had the same problem reported, and was able to fix it: sakhnyuk/rc-scrollbars#15 Their panel structure looks pretty similar to how PrimeReact's is built.

Reproducer

https://primereact.org/scrollpanel/

PrimeReact version

9.3.1

React version

17.x

Language

ES5

Build / Runtime

Vite

Browser(s)

Chrome 114, FIrefox 114

Steps to reproduce the behavior

1. Go to the ScrollPanel Demo page: https://primereact.org/scrollpanel/
2. Zoom out using browser zoom

On my machine, the bars start to appear at 80% as tiny strips, and keep "growing" the more I zoom out.

Expected behavior

Only the scroll bar styled by ScrollPanel should be displayed.

[SoyDiego]

@ThomDevine Can you post a screenshot or something to show the problem. I did the steps, but I cannot see the problem.

[ThomDevine]

I sure can, thanks for investigating! Both screenshots come from viewing the ScrollPanel doc page in Chrome.

67% zoom:

50% zoom:

My Windows desktop zoom is set to 125%, which may affect how the issue presents; we've seen different desktop zoom levels affect browser zoom behavior before.

[SoyDiego]

I sure can, thanks for investigating! Both screenshots come from viewing the ScrollPanel doc page in Chrome.

67% zoom:

50% zoom:

My Windows desktop zoom is set to 125%, which may affect how the issue presents; we've seen different desktop zoom levels affect browser zoom behavior before.

Thanks for your screenshot. I will try to check later ^^

[SoyDiego]

Hi @ThomDevine. I think I solved the problem. Ihave created a PR.
You can check here #4743.
Now we should wait the PrimeReact Team (@habubey) approve it if it's ok for them :)

[ThomDevine]

Thanks @SoyDiego ! I laughed out loud when I saw what the fix was. It's the classic case of "99% of solving the problem is knowing where to look" 😄

[SoyDiego]

Thanks @SoyDiego ! I laughed out loud when I saw what the fix was. It's the classic case of "99% of solving the problem is knowing where to look" 😄

haha no problem! happy to help :)