fix(switch): make Switch toggle work on Safari - FE-7667#8004
Conversation
| const StyledSwitchThumb = styled.span<StyledSwitchThumbProps>` | ||
| ${({ $checked, $disabled, $size, $disableTransitions }) => css` | ||
| position: absolute; | ||
| pointer-events: none; |
There was a problem hiding this comment.
Not sure why AI decided to set this. It can likely be removed if we want. When I hover, it still shows the pointer on Safari.
There was a problem hiding this comment.
I think we're ok to remove this. Unless I'm missing something obvious why we need this. The MDN docs state that:
The element on its own is never the target of pointer events. However its subtree could be kept targetable by setting pointer-events to some other value. In these circumstances, pointer events will trigger event listeners on this parent element as appropriate on their way to or from the descendant during the event capture and bubble phases.
There was a problem hiding this comment.
Yeah, nothing to add from me, happy to approve once this is addressed 👍
Registers an on-click handler on the track to ensure that Safari appropriately handles the on click fix Sage#7980
|
🎉 This PR is included in version 159.13.1 🎉 The release is available on: Your semantic-release bot 📦🚀 |
6 participants
Proposed behaviour
Fixes #7980
Registers an on-click handler on the track to ensure that Safari appropriately handles the on click.
Current behaviour
On-click for Safari doesn't work for Switch.
Checklist
d.tsfile added or updated if requiredQA
Additional context
Testing instructions
I checked out locally on safari; works on all of our pages. Testing may require checking out locally to confirm or check playwright/storybook.