@nativescript/angular 21.0.1-alpha.7 → 21.0.1-alpha.8

package/fesm2022/nativescript-angular.mjs

@@ -22,6 +22,7 @@ class InvisibleNode extends View {
         this.name = name;
         this.nodeType = 1;
         this.nodeName = getClassName(this);
+        this.tagName = this.nodeName;
     }
     toString() {
         return `${this.nodeName}(${this.id})-${this.name}`;
@@ -3144,6 +3145,12 @@ class ViewUtil {
         }
         const ngView = view;
         ngView.nodeName = name;
+        // Angular 21+ reads `rootElement.tagName.toLowerCase()` during component bootstrap
+        // (`locateHostElement`) to reject `<script>` host elements. Native Views have no
+        // intrinsic `tagName`, so without this assignment the boot throws
+        // `Cannot read properties of undefined (reading 'toLowerCase')`. Mirror DOM
+        // conventions where `tagName` equals `nodeName` for element nodes.
+        ngView.tagName = name;
         ngView.meta = getViewMeta(name);
         // we're setting the node type of the view
         // to 'element' because of checks done in the
@@ -3545,22 +3552,35 @@ class NativeScriptRenderer {
         if (NativeScriptDebug.enabled) {
             NativeScriptDebug.rendererLog(`NativeScriptRenderer.selectRootElement: ${selectorOrNode}`);
         }
+        // Angular 21+ reads `rootElement.tagName.toLowerCase()` after this call
+        // (`locateHostElement`) to reject `<script>` hosts. Guarantee every return
+        // path produces a View with a non-empty string `tagName`; otherwise the
+        // bootstrap throws `Cannot read properties of undefined (reading 'toLowerCase')`.
+        const ensureTagName = (view, fallback) => {
+            if (view && typeof view.tagName !== 'string') {
+                try {
+                    view.tagName = view.nodeName || fallback || 'view';
+                }
+                catch { }
+            }
+            return view;
+        };
         if (selectorOrNode instanceof View) {
-            return selectorOrNode;
+            return ensureTagName(selectorOrNode, '');
         }
         if (selectorOrNode && selectorOrNode[0] === '#') {
             const result = getViewById(this.rootView, selectorOrNode.slice(1));
-            return (result || this.rootView);
+            return ensureTagName((result || this.rootView), selectorOrNode);
         }
         if (typeof selectorOrNode === 'string') {
             const view = this.viewUtil.createView(selectorOrNode);
             if (getFirstNativeLikeView(view) === view) {
                 // view is nativelike!
                 this.appendChild(this.rootView, view);
-                return view;
+                return ensureTagName(view, selectorOrNode);
             }
         }
-        return this.rootView;
+        return ensureTagName(this.rootView, '');
     }
     parentNode(node) {
         if (NativeScriptDebug.enabled) {