Modal button is not visible, not clickable on iPhone 6s, iOS: 15.6.1

[szommeragi]

Package

filament/filament

Package Version

v.2.16.55

Laravel Version

v.9.33

Livewire Version

v.2.10.7

PHP Version

php 8.1

Problem description

If the modal is open, the button at the bottom of the pop-up window cannot be clicked because the browser's control bar is above.
The error occurred on iPhone 6s, iOS: 15.6.1, but it works fine on android. Cancel button is not showing, not clickable.

Expected behavior

We can click the button of the modal window.

Steps to reproduce

Open the filament demo page on iPhone 6s, iOS: 15.6.1 mobile phone (https://demo.filamentphp.com/shop/customers/1/edit?activeRelationManager=0), log in, open the customer menu. Edit any customer. Click the "New address" button.

Reproduction repository

https://github.com/filamentphp/filament

Relevant log output

No response

[github-actions]

Hey @szommeragi! We're sorry to hear that you've hit this issue. 💛

However, it looks like you forgot to fill in the reproduction repository URL. Can you edit your original post and then we'll look at your issue?

We need a public GitHub repository which contains a Laravel app with the minimal amount of Filament code to reproduce the problem. Please do not link to your actual project, what we need instead is a minimal reproduction in a fresh project without any unnecessary code. This means it doesn't matter if your real project is private / confidential, since we want a link to a separate, isolated reproduction. That would allow us to download it and review your bug much easier, so it can be fixed quicker. Please make sure to include a database seeder with everything we need to set the app up quickly.

[danharrin]

Chrome? Safari? The screenshot looks like Chrome but did you try Safari?

[szommeragi]

both in Chrome and Safari
First screenshot was in Chrome.
This is the new screenshot in Safari:

[zepfietje]

@szommeragi, can you scroll down to view the entire modal or is isn't that possible?

[szommeragi]

It isn't possible in Chrome. But if I sroll by the edge of modal, sometimes I can scroll in Safari.

[awcodes]

This a vh / h-screen bug in WebKit based browsers. There been a lot of discussion about it on the web, but the browser vendors don't seem to want to fix it or care.

[awcodes]

There is a work around but would have to do some testing to make sure it doesn't break some other things in Filament.