From 143e4c857bac4d6ca4b118956f4fc1d50bd62af2 Mon Sep 17 00:00:00 2001
From: Nathan Walker <walkerrunpdx@gmail.com>
Date: Sat, 23 May 2026 19:03:08 -0700
Subject: [PATCH] fix: set tagName on NgView for Angular 21 bootstrap
 compatibility

---
 .../angular/src/lib/nativescript-renderer.ts  | 20 +++++++++++++++----
 packages/angular/src/lib/view-util.ts         |  6 ++++++
 .../angular/src/lib/views/invisible-nodes.ts  |  2 ++
 packages/angular/src/lib/views/view-types.ts  |  1 +
 4 files changed, 25 insertions(+), 4 deletions(-)

diff --git a/packages/angular/src/lib/nativescript-renderer.ts b/packages/angular/src/lib/nativescript-renderer.ts
index 0b9d6d1..04db265 100644
--- a/packages/angular/src/lib/nativescript-renderer.ts
+++ b/packages/angular/src/lib/nativescript-renderer.ts
@@ -274,22 +274,34 @@ class NativeScriptRenderer implements Renderer2 {
     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: any, fallback: string) => {
+      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) as View;
+      return ensureTagName((result || this.rootView) as View, 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: NgView) {
     if (NativeScriptDebug.enabled) {
diff --git a/packages/angular/src/lib/view-util.ts b/packages/angular/src/lib/view-util.ts
index 26e83f5..99bc8e5 100644
--- a/packages/angular/src/lib/view-util.ts
+++ b/packages/angular/src/lib/view-util.ts
@@ -405,6 +405,12 @@ export class ViewUtil {
 
     const ngView = view as NgView;
     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
diff --git a/packages/angular/src/lib/views/invisible-nodes.ts b/packages/angular/src/lib/views/invisible-nodes.ts
index 69a0e24..323cb1c 100644
--- a/packages/angular/src/lib/views/invisible-nodes.ts
+++ b/packages/angular/src/lib/views/invisible-nodes.ts
@@ -7,6 +7,7 @@ export abstract class InvisibleNode extends View implements NgView {
   meta: { skipAddToDom: boolean };
   nodeType: number;
   nodeName: string;
+  tagName: string;
   // @ts-expect-error setter
   parentNode: NgView;
   nextSibling: NgView;
@@ -20,6 +21,7 @@ export abstract class InvisibleNode extends View implements NgView {
 
     this.nodeType = 1;
     this.nodeName = getClassName(this);
+    this.tagName = this.nodeName;
   }
 
   toString() {
diff --git a/packages/angular/src/lib/views/view-types.ts b/packages/angular/src/lib/views/view-types.ts
index c0eea47..92bc141 100644
--- a/packages/angular/src/lib/views/view-types.ts
+++ b/packages/angular/src/lib/views/view-types.ts
@@ -7,6 +7,7 @@ export interface ViewExtensions {
   meta: ViewClassMeta;
   nodeType: number;
   nodeName: string;
+  tagName: string;
   parentNode: NgView;
   nextSibling: NgView;
   previousSibling: NgView;