igniteui-angular 21.2.16 → 21.2.18

package/fesm2022/igniteui-angular-directives.mjs

@@ -4063,7 +4063,26 @@ class IgxForOfDirective extends IgxForOfToken {
             });
         }
     }
+    /**
+     * @hidden
+     * Resolves the element a view is tracked by.
+     *
+     * The view's root nodes are not always elements: when the template's root is
+     * a control flow block they are comment anchors, and the rendered element
+     * follows the first of them. Both lookups can come up empty - the view may
+     * hold no element at all, or be torn down before its content is rendered -
+     * in which case there is nothing to observe and null is returned.
+     */
+    getViewObservedNode(view) {
+        const rootNodes = view?.rootNodes ?? [];
+        const elementNode = rootNodes.find(node => node?.nodeType === Node.ELEMENT_NODE);
+        const candidate = elementNode ?? rootNodes[0]?.nextElementSibling;
+        return candidate?.nodeType === Node.ELEMENT_NODE ? candidate : null;
+    }
     subscribeToViewObserver(target) {
+        if (!target) {
+            return;
+        }
         if (this.igxForScrollOrientation === 'vertical' && this.viewObserver) {
             this._zone.runOutsideAngular(() => {
                 if (this.platformUtil.isBrowser) {
@@ -4934,7 +4953,16 @@ class IgxForOfDirective extends IgxForOfToken {
     removeLastElem() {
         const oldElem = this._embeddedViews.pop();
         this.beforeViewDestroyed.emit(oldElem);
-        this.viewObserver?.unobserve(oldElem.rootNodes.find(node => node.nodeType === Node.ELEMENT_NODE) || oldElem.rootNodes[0].nextElementSibling);
+        // The observed node is not necessarily a root node of the view: when the
+        // template's root is a control flow block the root nodes are comment
+        // anchors, and the rendered element follows the first of them. Either
+        // lookup can come up empty - the view may hold no element at all, or be
+        // torn down before its content is rendered - and ResizeObserver throws
+        // on anything that is not an Element.
+        const observedNode = this.getViewObservedNode(oldElem);
+        if (observedNode) {
+            this.viewObserver?.unobserve(observedNode);
+        }
         // also detach from ViewContainerRef to make absolutely sure this is removed from the view container.
         this.dc.instance._vcr.detach(this.dc.instance._vcr.length - 1);
         oldElem.destroy();
@@ -5388,7 +5416,7 @@ class IgxGridForOfDirective extends IgxForOfDirective {
         const input = this.igxForOf[elemIndex];
         const embeddedView = this.dc.instance._vcr.createEmbeddedView(this._template, new IgxGridForOfContext(input, this.igxForOf, this.getContextIndex(input), this.igxForOf.length));
         this._embeddedViews.push(embeddedView);
-        this.subscribeToViewObserver(embeddedView.rootNodes.find(node => node.nodeType === Node.ELEMENT_NODE) || embeddedView.rootNodes[0].nextElementSibling);
+        this.subscribeToViewObserver(this.getViewObservedNode(embeddedView));
         this.state.chunkSize++;
     }
     _updateViews(prevChunkSize) {