-
Notifications
You must be signed in to change notification settings - Fork 76
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
fix(input): preventing the input from losing focus on keypress in Safari when autofill occurs #5221
fix(input): preventing the input from losing focus on keypress in Safari when autofill occurs #5221
Conversation
…lharper/5026-safari-input-loses-focus-with-autofill
…ari when autofill occurs
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We can't use inert
until Safari 16 is released (or we could use the polyfill which has performance issues. Regardless, we should figure out an autofill solution that works in all browsers instead preventing it in Safari. I think that means unshadowifying input, unless you find a better alternative
This PR has been automatically marked as stale because it has not had recent activity. Please close your PR if it is no longer relevant. Thank you for your contributions. |
We should be able to start using it later this year when we bump our last 2 Safari major versions to 16 and 17, respectively. I'll update the milestone for this PR and the associated issue accordingly. |
This PR has been automatically marked as stale because it has not had recent activity. Please close your PR if it is no longer relevant. Thank you for your contributions. |
…klharper/5026-safari-input-loses-focus-with-autofill
Closing this due to #5026 (comment) so we will need to revisit the approach to solving the original issue. |
Related Issue: #5026
Summary
This is a workaround of a Safari bug that will allow the focus to stay in the input even when Safari's autofill engages on a
calcite-input
. The drawback to this is that it breaks autofill in Safari only.It is currently not possible in Safari 15.16.1 to engage autofill behavior properly on an
<input>
rendered inside a shadowRoot. This change will prevent the hidden input from gaining focus, which is the Safari-only behavior that took the focus away from the visible input. The hope is that this will get resolved in the future on Safari's end, but there is no known timeline for a fix. Safari is planning on fully supporting form-associated custom elements which could potentially address this issue, but won't be for a while until Calcite can migrate over to supporting it until it has been available at least 2 major versions back.If autofill behavior is required, we could look into creating a version of
calcite-input
that doesn't use shadow dom so that the input can behave correctly as it does when using a plain<input>
inside a form.