Interacting with a dropdown within the slider starts drag and drop behaviour

[ChristianHoffmannS2]

Bug is related to

• embla-carousel (core package)

Embla Carousel version

• v7.0.0

Describe the bug

• When interacting with a dropdown element inside of the slides, safari will be locked into free-drag state

CodeSandbox

- The link to a CodeSandbox that demonstrates the bug clearly.

Steps to reproduce

1. Go to the sandbox with a safari browser
2. Click on the dropdown and make a selection
3. Move the mouse without clicking anything
4. See error

Expected behavior

• Interacting with input elements should not be an interaction with the slider

Additional context

• This might effect mobile safari as well. This might be related to drag- and touch events.
• Behaviour might be fixed with a stopPropagation at the right place
• Its unclear why this only happens when using Safari

[davidjerleke]

Hi @ChristianHoffmannS2,

Thank you for your bug report. I can’t find a dropdown in the provided CodeSandbox? Did you share the wrong link?

Best,
David

[davidjerleke]

Hi again @ChristianHoffmannS2,

Not to rush you or anything, but have you seen my response? Do you want to pursue this?

Best,
David

[ChristianHoffmannS2]

Hi again @ChristianHoffmannS2,

Not to rush you or anything, but have you seen my response? Do you want to pursue this?

Best, David

Hi David,

I am sorry that I missed out your response!

Does this include it?

https://codesandbox.io/s/embla-carousel-dragfree-react-forked-e3mvkh?file=/src/js/EmblaCarousel.js

[davidjerleke]

Hi @ChristianHoffmannS2,

Thanks. That’s the CodeSandbox 🙂. I can confirm that this is a bug. Scanning the code, it seems to be a simple mistake because the select name is missing in the list of elements that shouldn’t trigger dragging.

I can create a CodeSandbox an add select to that list if you wouldn’t mind testing it?

Kindly,
David

[ChristianHoffmannS2]

Hi @davidjerleke,

thanks. That would be good to test against :)

[davidjerleke]

Sorry @ChristianHoffmannS2,

I’ve must have been really tired when writing my previous comment. The node type SELECT is in that list. I will have to investigate this a bit more to understand why this is happening.

I will let you know when I have something.

Best,
David

[ChristianHoffmannS2]

All good @davidjerleke .

I didn't payed enough attention neither :)

[davidjerleke]

Hi @ChristianHoffmannS2,

This bug has been fixed in v7.0.7. Give it a go if you like. Thanks for creating the bug report 👍.

Cheers,
David