fix(tooltip): text fields not editable if tooltip is applied in safari #12959
Conversation
googlebot
added
the
cla: yes
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.
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.
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.
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
devversion
force-pushed
the
fix/tooltip-safari-input
branch
from
3299370 to
6d5e883
Compare
#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