-
Notifications
You must be signed in to change notification settings - Fork 888
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Weird interactions between dialog and select elements on Safari #5514
Comments
This looks like this is the popover issue with dialogs. Can you try adding a |
Unfortunately that didn’t seem to help. I’ve put together a simple reproduction here in the playground just to confirm it wasn’t anything related to what I mentioned in the original link that could have been interfering. https://lit.dev/playground/#gist=6bca317bec6c6ebea62feaefa2ef2525 Note: Also confirmed this bug exists in Safari for iOS 16.7.6 |
Gotcha, I think it might be limited to Safari iOS. I wasn't able to reproduce on Safari macOS (and Chrome on iOS is just webkit safari under the hood). My simulator is giving me trouble so I might not be able to look into this for a bit. Do you know if it happens in iOS 17? |
I had a chance to confirm that it behaves as expected in iOS 17. |
What is affected?
Accessibility, Component
Description
When trying to nest a select element inside of a dialog the drop-down doesn’t overflow the dialog as expected on iOS.
Here is an example screenshot showing you what I mean.
Reproduction
https://lit.dev/playground/#gist=6bca317bec6c6ebea62feaefa2ef2525
Workaround
Currently in search of one, presumably trying to make the dialog much larger would be one approach here.
Is this a regression?
No or unsure. This never worked, or I haven't tried before.
Affected versions
1.3.0
Browser/OS/Node environment
Browser: Chrome
Operating System: iOS 16.7.5
Material Web Version: 1.3.0
The text was updated successfully, but these errors were encountered: