search

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.38k stars 32.14k forks source link

Stepper with swipable views doesn't work well #37391

Open thany opened 1 year ago

thany commented 1 year ago

Duplicates

Latest version

Steps to reproduce 🕹

Link to live example: https://mui.com/material-ui/react-stepper/#text-with-carousel-effect

Steps:

  1. Swipe it, I guess

Current behavior 😯

In Firefox, it selects and drag one of the images (default browser behaviour), not the carousel. After letting go, the carousel still thinks it's being grabbed.

In Chrome, it initially works correctly, but when swiping outside the carousel, you can still see the dragged image from default browser behaviour.

Expected behavior 🤔

It grabs the carousel and drags that. Nothing else. No weirdness 🙂

Context 🔦

No response

Your environment 🌎

Not applicable. I'm just looking at the demo. So whatever that demo is built with, I guess.

Only thing worth nothing is my browser, which is Firefox 113 / Chrome 113.

mnajdova commented 1 year ago

I can't reproduce. What OS are you using? Can you share recording of the behavior?

thany commented 1 year ago

Windows 10, animations disabled.

Also important: do it with a mouse. On a touchscreen, it'll probably work fine (don't actually know, I have mine disabled in the UEFI so I'm can't test it easily).

I was able to fix it by adding draggable={false} to the images. Perhaps this also hints towards why you're not able to reproduce the problem?

jaisaichand commented 7 months ago

@mnajdova @thany I can reproduce it in my mac.. can't we have draggable={false} by default to the images inside carousel and let user explicitly set it to true if wanted? I can do it if it is fine for you both

thany commented 7 months ago

I said Windows 10, didn't I? That ain't a mac then, innit 😉

Perhaps Firefox (assuming you did try that at least) behaves differently in terms of drag&drop because it's on another OS. Wouldn't surprise me.

mnajdova commented 7 months ago

@thany adding draggable={false} makes sense to me 👍 Would you like to create a PR for updating the demo and tag me there? Thanks!