-
Notifications
You must be signed in to change notification settings - Fork 4.9k
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 hold to reveal button on mobile browsers #19847
Conversation
CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes. |
import Box from '../../ui/box'; | ||
import { | ||
AlignItems, | ||
DISPLAY, | ||
Display, |
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.
Replacing deprecated code
onPointerDown={onMouseDown} | ||
onPointerUp={onMouseUp} |
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.
"integrates various inputs from mice, touchscreens, and pens, making separate implementations no longer necessary and authoring for cross-device pointers easier. Not to be mistaken with the unrelated "pointer-events" CSS property." https://caniuse.com/pointer
305ac8e
to
57936bf
Compare
8c7ece0
to
c92919b
Compare
Builds ready [81d2271]
Page Load Metrics (1587 ± 34 ms)
Bundle size diffs
|
Codecov Report
@@ Coverage Diff @@
## develop #19847 +/- ##
========================================
Coverage 69.68% 69.68%
========================================
Files 982 982
Lines 37067 37067
Branches 9941 9941
========================================
Hits 25829 25829
Misses 11238 11238
|
LGTM and worked on iPhone RPReplay_Final1688152375.MP4 |
Explanation
Currently users who use the extension on their mobile devices are not able to reveal their SRP because the hold to reveal button is not working. This PR changes the
onMouseDown
andonMouseUp
events toonPointerDown
andonPointerUp
which "integrates various inputs from mice, touchscreens, and pens, making separate implementations no longer necessary and authoring for cross-device pointers easier."https://caniuse.com/pointer
Screenshots/Screencaps
Before
Checking the story of the
HoldToRevealButton
on an iPhone doesn't workhold.to.reveal.button.mp4
After
Checking story of the
HoldToRevealButton
on iPhoneRPReplay_Final1688150899.MP4
Still working in extension in Chrome browsers
hold.to.reveal.desktop.after.mov
Manual Testing Steps
HoldToRevealButton
Pre-merge author checklist
Pre-merge reviewer checklist
If further QA is required (e.g. new feature, complex testing steps, large refactor), add the
Extension QA Board
label.In this case, a QA Engineer approval will be be required.