feat: Add option to disable seeking while scrubbing on mobile #8903
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
On desktop, a user can hover over the progress bar while content plays, which makes it possible to seek to a relatively precise location without disrupting playback. On mobile there is no hovering, so in order to seek during inline playback the user can only tap a location on the progress bar (very hard to do precisely on a small screen) or scrub to try to hone in on a specific location (can be very clunky because seeks are constantly being executed). This PR adds a feature to treat scrubbing on mobile more like hovering on desktop-- while scrubbing, seeks are disabled and playback continues, only when the user finishes scrubbing is a single seek executed to the desired location.
One key use-case for this feature is thumbnail seeking integrations on mobile, where the user can scrub through different thumbnail images until they find their desired seek location.
Specific Changes proposed
This behavior is similar to the existing
enableSmoothSeeking
behavior in that thePlayProgressBar
slider visibly updates with the scrubbing movements, but differs in a few ways:touchend
.TimeTooltip
component displays the target seek time while scrubbing, rather than theCurrentTimeDisplay
(which continues to show the current time of the playing content).Requirements Checklist
npm run docs:api
to error