Dialogflow CX Messenger - Unwanted scroll in Safari on iOS

[EricaP]

Hello,

I’m having an issue with my Dialogflow CX Messenger on Safari for iOS. When I focus on the textarea, it is possible to scroll down, revealing the content at the bottom. I’ve tried setting the height to 100% or 100vh, but it doesn’t work.

I’ve already added <meta name="viewport" content="width=device-width, initial-scale=1"> to my code as recommended in the documentation. It works just fine on other browsers and devices.

This is an example of what it looks like, the purple color is the background.

Does anyone know how to fix this? We can’t go live with the messenger until this problem is resolved.

[cassandramae]

Hi @EricaP,

I tried to reproduce the behavior you've encountered but the Dialogflow CX Messenger UI is working properly on my end. To help you isolate its possible root cause, you may try the following:

• Use a different simulator to see if it's a device issue. You may also check if this is happening to physical devices as well
• Use a different Safari version (latest if possible)
• If the Request Desktop Website is turned on, try turning it off to provide a more user-friendly experience

If the issue persists, you may contact the Google Cloud Support for further investigation so they can check if this could be a potential bug or project-specific issue only.

Hope it helps.

[EricaP]

Hello,
Interesting that you weren't able to reproduce it. I discovered this issue at first when I tried to use the messenger from my physical phone. My colleagues gets the same error as well. I have done some more digging and I think that this might be a common issue in general, I have found multiple articles about this issue. This post describes exactly what I am experiencing My Battle with Whitespace Issues in Mobile Safari: The New Internet Explorer for Web Developers | Me... .

I'm curious,  how did you set up the Dialogflow CX Messenger UI and how did you test it? I would be so glad if it's just me that have made an error, and I think that it could be useful to see it work properly so that I can compare a working version with mine.