Vaadin Grid Scrollbar issue in High DPI Screen

[vaadin-bot]

Originally by SriniNathan

---

We use Vaadin Grid in our application. The scrollbar in the grid works just fine in normal resolution monitor. The scrollbar turns into a very thin line when viewing in high DPI 4K laptop monitor. The bar is very thin and it is almost a invisible line. Clicking on that to scroll is very difficult.

Has anyone faced this issue. It can reproduce it with vaadin sampler grid http://demo.vaadin.com/sampler/#ui/grids-and-trees/grid/rest-api

Using Chrome or Firefox as our browser Operating system is Windows 10 home.

---

Imported from https://dev.vaadin.com/ issue #20475

[vaadin-bot]

Originally by SriniNathan

---

Attachment added: vaadinscrollbar.png (76.5 KiB) https://trac-attachments.vaadin.com/trac/20475/vaadinscrollbar.png

[glebfox]

Browser zooming also affects Grid Scrollbar

[pichlerm]

We are also missing the Grid's scrollbars on zooming the application. They dissappear in Vaadin 8 when using Firefox, zooming out to around 50 % and reloading the page (reproducible with the grid demo, see link below). The scrollbar is then only visible while using the mouse wheel for vertical scrolling, but horizontal scrolling is no longer possible. In other browsers (Chrome, Internet Explorer) the scrollbars remain visible.

https://demo.vaadin.com/sampler/#ui/grids-and-trees/grid/features

In firefox then the v-grid-scroller v-grid-scroller-vertical/v-grid-scroller-horizontal elements have an explicit style="visibility: hidden" unless during using the scroll wheel. See screenshot of Firefox f12:

[sisyfos123]

Still facing this same issue. Please fix. 4k screens are getting more and more common place now. The scrollbar does not seem to respond the overall UI scaling in Win 10.

[stale[bot]]

Hello there!

It looks like this issue hasn't progressed lately. There are so many issues that we just can't deal them all within a reasonable timeframe.

There are a couple of things you could help to get things rolling on this issue (this is an automated message, so expect that some of these are already in use):

• Check if the issue is still valid for the latest version. There are dozens of duplicates in our issue tracker, so it is possible that the issue is already tackled. If it appears to be fixed, close the issue, otherwise report to the issue that it is still valid.
• Provide more details how to reproduce the issue.
• Explain why it is important to get this issue fixed and politely draw others attention to it e.g. via the forum or social media.
• Add a reduced test case about the issue, so it is easier for somebody to start working on a solution.
• Try fixing the issue yourself and create a pull request that contains the test case and/or a fix for it. Handling the pull requests is the top priority for the core team.
• If the issue is clearly a bug, use the Warranty in your Vaadin subscription to raise its priority.

Thanks again for your contributions! Even though we haven't been able to get this issue fixed, we hope you to report your findings and enhancement ideas in the future too!

[pichlerm]

I just verified that the bug is still present in the current Firefox Quantum (version 61.0.1; portable application without any changed user settings): when you open https://demo.vaadin.com/sampler/#ui/grids-and-trees/grid/features then zoom out to 50 % and reload the page, the scrollbar of the grid is only visible during scrolling with the mouse wheel (partly overlapping the grid, partly outside the grid).

The bug depends on the page zoom on loading the page, changing it later will neither make it occur (when making it smaller) nor make it go away (when making it larger).

[stale[bot]]

Hello there!

We are sorry that this issue hasn't progressed lately. We are prioritizing issues by severity and the number of customers we expect are experiencing this and haven't gotten around to fix this issue yet.

There are a couple of things you could help to get things rolling on this issue (this is an automated message, so expect that some of these are already in use):

• Check if the issue is still valid for the latest version. There are dozens of duplicates in our issue tracker, so it is possible that the issue is already tackled. If it appears to be fixed, close the issue, otherwise report to the issue that it is still valid.
• Provide more details how to reproduce the issue.
• Explain why it is important to get this issue fixed and politely draw others attention to it e.g. via the forum or social media.
• Add a reduced test case about the issue, so it is easier for somebody to start working on a solution.
• Try fixing the issue yourself and create a pull request that contains the test case and/or a fix for it. Handling the pull requests is the top priority for the core team.
• If the issue is clearly a bug, use the Warranty in your Vaadin subscription to raise its priority.

Thanks again for your contributions! Even though we haven't been able to get this issue fixed, we hope you to report your findings and enhancement ideas in the future too!

[PutTheBitInTheContainer]

Hi,

I'm having this exact same issue. I'v tried it in Chrome and Brave (both vanilla installs), but in Firefox it works perfectly. Here are some screen shots, if somebody could help out it would be awesome! Thanks!

System info: OS Name Microsoft Windows 10 Pro Version 10.0.19041 Build 19041 System Manufacturer LENOVO System Model 20MF000XMH System Type x64-based PC System SKU LENOVO_MT_20MF_BU_Think_FM_ThinkPad X1 Extreme Processor Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz, 2208 Mhz, 6 Core(s), 12 Logical Processor(s) BIOS Version/Date LENOVO N2EET37W (1.19 ), 31/01/2019

Display: Name NVIDIA GeForce GTX 1050 Ti with Max-Q Design Adapter Type GeForce GTX 1050 Ti with Max-Q Design, NVIDIA compatible Adapter Description NVIDIA GeForce GTX 1050 Ti with Max-Q Design Driver Version 26.21.14.3213 Resolution 3840 x 2160 x 60 hertz Bits/Pixel 32

Brave: Version 1.11.97 Chromium: 84.0.4147.89 (Official Build) (64-bit)

Chrome: Version 84.0.4147.89 (Official Build) (64-bit)

I agree with @sisyfos123 we're seeing that 4K laptops/desktop are becoming a standard for senior level clients and nobody wants to upset the boss ;-)

Thanks for taking a look!

[stale[bot]]

Hello there!

We are sorry that this issue hasn't progressed lately. We are prioritizing issues by severity and the number of customers we expect are experiencing this and haven't gotten around to fix this issue yet.

There are a couple of things you could help to get things rolling on this issue (this is an automated message, so expect that some of these are already in use):

• Check if the issue is still valid for the latest version. There are dozens of duplicates in our issue tracker, so it is possible that the issue is already tackled. If it appears to be fixed, close the issue, otherwise report to the issue that it is still valid.
• Provide more details how to reproduce the issue.
• Explain why it is important to get this issue fixed and politely draw others attention to it e.g. via the forum or social media.
• Add a reduced test case about the issue, so it is easier for somebody to start working on a solution.
• Try fixing the issue yourself and create a pull request that contains the test case and/or a fix for it. Handling the pull requests is the top priority for the core team.
• If the issue is clearly a bug, use the Warranty in your Vaadin subscription to raise its priority.

Thanks again for your contributions! Even though we haven't been able to get this issue fixed, we hope you to report your findings and enhancement ideas in the future too!