Possible to make Embla carousel work inside iframe?

[M-Joyce]

Hello, I'm trying to get embla to work inside an iframe (react/ts), but it looks like it's only detecting events outside of the iframe. Everything else seems to work fine, and I'm using and generating the embla ref within a component living inside the iframe.

Anything anyone can think of to get embla to listen to events inside my iframe?

[davidjerleke]

Hi @M-Joyce,

Thank you for your question. What kind of events? Drag events like mouse and touch? Would you mind explaining more in detail? For example, you can describe how to reproduce the problem.

Best,
David

[M-Joyce]

Hi, yes Drag Events like mouse and touch (maybe all events?). This should be recreatable by creating an iframe with several divs inside, and then setting up to use embla on the div within the iframe. Here is an issue from swiper that matches my experience exactly: nolimits4web/swiper#2411
Maybe the fix is similar?

[davidjerleke]

Thanks for the additional details @M-Joyce.

It makes sense to try fixing this with the suggestion in the link you shared 👍. I can't give an ETA when this could happen though. Are you open to testing a draft when I've had the time to work on this?

Best,
David

[davidjerleke]

There is now an issue for this:

• Make carousel events work inside an iframe #455

[davidjerleke]

Released with v8.0.0-rc04.