Adding is intersecting check skips over initial load calls on full page infinite scroll

[GrizzlyEnglish]

Not sure if this is still active, but by adding a check if the component is intersecting, stops the initial calls on render if the infinite scroll is a full page.

[GrizzlyEnglish]

@SveNord This might be heavily specific to my issue with trying to utilize this for a school project. When I added this to a full page infinite scroll of postings, it pulled down the first 4 pages of content due to the component trigger being visible on initial render - so in order to fix that, I added

window.Observer = {
    observer: null,
    Initialize: function (component, observerTargetId) {
        this.observer = new IntersectionObserver(e => {
            // Check here
            if (e[0].isIntersecting) {
                component.invokeMethodAsync('OnIntersection');
            }
        });

        let element = document.getElementById(observerTargetId);
        if (element == null) throw new Error("The observable target was not found");
        this.observer.observe(element);
    }
};

Since this is a school project I did not test this outside my specific use case; but wanted to share!

[djflan]

window.Observer = { observer: null, Initialize: function (component, observerTargetId) { this.observer = new IntersectionObserver(e => { // Check here if (e[0].isIntersecting) { component.invokeMethodAsync('OnIntersection'); } });

    let element = document.getElementById(observerTargetId);
    if (element == null) throw new Error("The observable target was not found");
    this.observer.observe(element);
}

};

Experienced the same issue. Your code fixed it, thanks