mui / material-ui

Material UI: Comprehensive React component library that implements Google's Material Design. Free forever.
https://mui.com/material-ui/
MIT License
93.75k stars 32.24k forks source link

Scrubbing using Slider on IPad in Chrome exits full screen #43875

Open upendrku opened 1 month ago

upendrku commented 1 month ago

Steps to reproduce

Link to live example: https://video-player-theta-seven.vercel.app/

Steps:

  1. Open the URL on IPad in Chrome
  2. Play the video on full screen
  3. Use the Slider to navigate to different point in timeline by touching directly on it

Current behavior

It takes the User out of the full screen. Also sometimes the video pauses while this happens.

Expected behavior

The user should remain on the full screen mode while scrubbing using the Slider component. Also video should not pause.

Context

I am using material UI v5.5.2. While scrubbing using slider i can see that everything works fine till useSlider handleTouchStart execution ends. I think the touch event is bubbling up causing this issue.

Your environment

npx @mui/envinfo System: OS: macOS 14.6.1 Binaries: Node: 16.20.2 - /usr/local/bin/node npm: 8.19.4 - /usr/local/bin/npm pnpm: Not Found Browsers: Chrome: 129.0.6668.59 Edge: Not Found Safari: 17.6 npmPackages: @emotion/react: ^11.10.4 => 11.10.4 @emotion/styled: 11.10.4 => 11.10.4 @mui/base: ^5.0.0-beta.10 => 5.0.0-beta.27 @mui/icons-material: ^5.5.1 => 5.5.1 @mui/lab: ^5.0.0-alpha.84 => 5.0.0-alpha.86 @mui/material: ^5.5.2 => 5.5.2 @mui/private-theming: 5.8.4 @mui/styled-engine: 5.8.0 @mui/system: ^5.5.2 => 5.8.4 @mui/types: 7.2.11 @mui/utils: 5.15.0 @mui/x-date-pickers: ^6.18.2 => 6.18.5 @mui/x-tree-view: ^6.17.0 => 6.17.0 @types/react: 17.0.3 => 17.0.3 react: 17.0.2 => 17.0.2 react-dom: 17.0.2 => 17.0.2 typescript: 4.8.4 => 4.8.4

Search keywords: Slider Scrub video on IPad issues

mj12albert commented 1 day ago

@upendrku Are you able to share a minimal repro of the issue (e.g. in CodeSandbox)?