Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Slider cannot be initialized in iframe #523

Open
taltmann42 opened this issue Sep 18, 2020 · 3 comments
Open

Slider cannot be initialized in iframe #523

taltmann42 opened this issue Sep 18, 2020 · 3 comments

Comments

@taltmann42
Copy link

I'm trying to use Glide.js for some components and want to showcase that in Storybook. There the component is displayed in an iframe, and when mounting a Glide instance, I get this error:

Root element must be a existing Html node

I am using an element reference in the constructor, not a selector, and double checked that this element does really exist. I tracked the error down to the exist-Function in src/utils/dom.js specifically this part:

node instanceof window.HTMLElement

Apparently, elements inside an iframe are not an instance of window.HTMLElement but rather theiframelement.contentWindow.HTMLElement. I tested these cases:

this.element instanceof window.HTMLElement // false
this.element instanceof HTMLElement // false
this.element instanceof document.querySelector('iframe').contentWindow.HTMLElement // true

Chrome and Safari fail with the root-element error while it works in firefox.

A possible solution with more info can be found here https://stackoverflow.com/questions/384286/how-do-you-check-if-a-javascript-object-is-a-dom-object

@abhi3315
Copy link

Is there any update on this issue? I am facing the same problem while mounting the slider inside an iframe.

@ericmorand
Copy link
Contributor

Hopefully, this PR is reviewed and merged soon:

#669

@ericmorand
Copy link
Contributor

@abhi3315 can you give 3.6.1 a try?

jayelkaake added a commit to feracommerce/glide that referenced this issue Nov 9, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants