The panel header stays in view on phones

On a phone, the panel's header could slide out of view. The header holds the assistant's name, the menu and the close button. After a shopper scrolled the conversation, the header could end up under the status bar. The close button was then out of reach, and the conversation ran under the status bar.

It was seen on iPhone Safari. The page behind the panel kept scrolling even though the tag locks it, and the visible area of the screen moved away from the panel.

Now, while the panel fills the screen (a phone, or any window 640 px wide or less), the header stays at the top of what the shopper sees, and the message field stays above the keyboard. The area below the conversation, where the keyboard or the browser's own bar sits, takes the panel's background colour (white by default) instead of showing your storefront. The conversation page also asks the browser not to pass its scrolling on to the page behind, as a second line of defence. Browsers, iOS Safari included, don't always honour that, so the fix doesn't rely on it.

Nothing changes where the problem doesn't occur: on a wider window the panel is exactly as before, and where the visible area already matches the screen the panel covers the same area as before. The panel follows the visible area when the on-screen keyboard opens, and it keeps up smoothly while the keyboard slides in or out, so the header and the message field both stay on screen.

Nothing to set up. The fix ships with the tag, so it reaches your storefront without a change to your snippet.

What we checked. We reproduced the problem on the iOS Simulator (iOS 17.0 and iOS 27.0), and automated tests cover the tag's behavior. We have not tested on a physical iPhone, so we can't say yet that every device and iOS version is covered.