Skip to content

support for shadow root as container #597

@patrickkmatias

Description

@patrickkmatias

Is your support request related to a problem? Please describe.
I'm creating a webapp using web components and I'm trying to lazy load a video that's inside my component, which has a shadow root, and to access its elements it's only possible accessing first the shadowRoot prop. and then selecting it with querySelector() for example.

So I try to use a shadow root prop. as value for the container property of the options object like this:

const lazy = new LazyLoad({
      container: document
        .querySelector("home-page")
        .shadowRoot.querySelector("contact-section").shadowRoot,
    });

and it throws the following error:

TypeError: Failed to construct 'IntersectionObserver': Failed to read the 'root' property from 'IntersectionObserverInit': The provided value is not of type '(Document or Element)'.
    at lazyload.min.js:1:7380
    at new En (lazyload.min.js:1:7543)
    at main.js:20:18

trying to select contact-section without shadowRoot won't select any element

To Reproduce
Create a web component and use it as container for the LazyLoad class, through the options argument.

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions