-
Notifications
You must be signed in to change notification settings - Fork 6.8k
fix(tooltip): text fields not editable if tooltip is applied in safari #12959
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
Conversation
src/lib/tooltip/tooltip.ts
Outdated
| } else if (_platform.IOS && (element.nodeName === 'INPUT' || element.nodeName === 'TEXTAREA')) { | ||
| } | ||
|
|
||
| if ((_platform.IOS || _platform.SAFARI) && |
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.
At this point, I think that we should do this on all browsers. Text selection is something pretty fundamental to inputs.
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.
I agree. Also the the user-select: none is mostly needed if something is being panned/dragged. So we should be good always removing the user-select.
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.
Done. I've updated the commit message but kept the title because the changelog should show that the specific safari case has been fixed.
Applying `matTooltip` directly on a `<input>` or `<textarea>` element causes HammerJS to add a `user-select: none` inline style. This prevents users from typing into the text fields in Safari. Since the `user-select: none` is not needed for the `longpress` event, we can just **always reset** the `user-select` if a tooltip is applied on a text-field because we want to avoid such issues. Fixes angular#12953
3299370 to
6d5e883
Compare
crisbeto
left a comment
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.
LGTM
jelbourn
left a comment
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.
LGTM
#12959) Applying `matTooltip` directly on a `<input>` or `<textarea>` element causes HammerJS to add a `user-select: none` inline style. This prevents users from typing into the text fields in Safari. Since the `user-select: none` is not needed for the `longpress` event, we can just **always reset** the `user-select` if a tooltip is applied on a text-field because we want to avoid such issues. Fixes #12953
|
How can I get this fix? Is this in version 6.4.7? |
|
@ArgV04 It's available in |
|
Ok thanks, we cannot currently update to major 7.x.x because we have other dependencies based on version 6.4.x and these not have done the jump to v7 |
|
Any breaking changes from v6 to v7. Does anyone have a upgrade guide? Thanks in advance. |
|
This issue has been automatically locked due to inactivity. Read more about our automatic conversation locking policy. This action has been performed automatically by a bot. |
Applying
matTooltipdirectly on a<input>or<textarea>element causes HammerJS to add auser-select: noneinline style. This prevents users from typing into the text fields in Safari.Since the
user-select: noneis not needed for thelongpressevent, we can just always reset theuser-selectif a tooltip is applied on a text-field because we want to avoid such issues.Fixes #12953