Scrolling in a grid on iOS (Safari, Chrome) impossible

[darmro]

Description

I can't scoll down a grid im my web app on iOS, both on Safari and Chrome (using browserstack test tool).
So I've checked if bakery demo works fine, but it's not, unfortunately.
I've choose iPhone 12 (the latest iOS), the latest Safari and Chrome- scrolling is impossible.
Everything is fine on Android (except for firefox on Android, but I know FF on Android is unsupported for Vaadin, unfortunately).

Live Demo / Steps to reproduce

Just run https://bakery-flow.demo.vaadin.com/ on iOS.

Browsers Affected

• [ X] iOS Safari
• [ X] iOS Chrome

Is this a Vaadin bug or browserstact bug?
If Vaadin bug, how to workaround this?

I have to admit this is a big problem for us, cause a lot of our users are using iPhones.

Thansk!

[web-padawan]

Thanks for the issue. We have already fixed this issue but the demo is not updated as it still uses older vaadin-grid version.

Can you please try the live demos here: https://vaadin.com/components/vaadin-grid/java-examples

Also, please let us know which Vaadin version you are using?

[darmro]

Thanks.
I've just tested https://vaadin.com/components/vaadin-grid/java-examples/assigning-data on browserstack test tool.
Result of scrolling the first grid (in Assigning data page):

1. iPhone 6 and 8 (Safari): OK (I can scroll down)
2. iPhone 11 and 12 (Safari): scrolling is impossible :(

I assume that https://vaadin.com/components/vaadin-grid/java-examples/assigning-data runs on the latest Vaadin version with the fix you mentioned?

[web-padawan]

Actually, the website is also using an older version (5.6.6).

The HTML demos using the latest version 5.7.7 are here: https://cdn.vaadin.com/vaadin-grid/5.7.7/demo/
This is the version which is included to Vaadin 18 and Vaadin 14.4

[darmro]

Tested https://cdn.vaadin.com/vaadin-grid/5.7.7/demo/#grid-basic-demos: On iPhone 12 grid scrolls fine :)

We are on Vaadin 14.1.28 and cannot upgrade to 14.4 unfortunately, due to vaadin/flow#8543
We are using WebComponentExporter to serve "widgets" to our CMS. From V 14.2 there's a problem with styling. The fix will be included in Vaadin 19 (new Vaadin theme strategy).

1. Do you know when Vaadin 19 will be shipped (specifically)? :)
2. Will the workaround mentioned in Scroll in grid inside a dialog is not working on iOS #1682 will work in Vaadin 14.1.28?
   Thansk!

[rolfsmeds]

1. V19 is expected to ship in early March. You will then need to apply the css required for your embedded components using hte new theme folder feature. The new theming system will also be backported to V14 at some point, but the schedule for that is still unclear.
2. I don't see why the workaround mentioned in Scroll in grid inside a dialog is not working on iOS #1682 wouldn't work in 14.1.28.

[darmro]

Thank You :)