From 76d8f0b2900875887067c93c46500ba97760b20d Mon Sep 17 00:00:00 2001
From: Nathan Walker <walkerrunpdx@gmail.com>
Date: Fri, 14 Aug 2026 22:58:34 -0700
Subject: [PATCH] fix: bootstrap NG0210 when the runtime exposes a global
 PerformanceObserver
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Angular's dev-mode ImagePerformanceWarning only bails out early when
PerformanceObserver is missing or both image warnings are disabled.
NativeScript runtimes that ship a Web Performance API now define that
global, so the service proceeds to getDocument() and throws NG0210,
failing every debug boot.

Default IMAGE_CONFIG to disabled for both warnings — NativeScript has no
<img> elements for them to scan. Apps can still override it, since their
own providers are applied after the NativeScript ones.
---
 .../src/tests/image-config.spec.ts            | 20 +++++++++++++++++++
 packages/angular/src/lib/nativescript.ts      | 10 ++++++++--
 2 files changed, 28 insertions(+), 2 deletions(-)
 create mode 100644 apps/nativescript-demo-ng/src/tests/image-config.spec.ts

diff --git a/apps/nativescript-demo-ng/src/tests/image-config.spec.ts b/apps/nativescript-demo-ng/src/tests/image-config.spec.ts
new file mode 100644
index 00000000..f4ff3131
--- /dev/null
+++ b/apps/nativescript-demo-ng/src/tests/image-config.spec.ts
@@ -0,0 +1,20 @@
+import { IMAGE_CONFIG } from '@angular/common';
+import { TestBed } from '@angular/core/testing';
+import { NativeScriptModule } from '@nativescript/angular';
+
+describe('IMAGE_CONFIG', () => {
+  beforeEach(() => {
+    return TestBed.configureTestingModule({
+      imports: [NativeScriptModule],
+    }).compileComponents();
+  });
+
+  // Both flags are required: with either one unset, Angular reaches for `document` during
+  // bootstrap on any runtime that exposes a global PerformanceObserver.
+  it('disables both dev-mode image warnings', () => {
+    const config = TestBed.inject(IMAGE_CONFIG);
+
+    expect(config.disableImageSizeWarning).toBe(true);
+    expect(config.disableImageLazyLoadWarning).toBe(true);
+  });
+});
diff --git a/packages/angular/src/lib/nativescript.ts b/packages/angular/src/lib/nativescript.ts
index 7fb656d8..bb7aaccd 100644
--- a/packages/angular/src/lib/nativescript.ts
+++ b/packages/angular/src/lib/nativescript.ts
@@ -1,4 +1,4 @@
-import { ViewportScroller, XhrFactory, ɵNullViewportScroller as NullViewportScroller } from '@angular/common';
+import { IMAGE_CONFIG, ViewportScroller, XhrFactory, ɵNullViewportScroller as NullViewportScroller } from '@angular/common';
 import { ApplicationModule, ErrorHandler, Inject, NgModule, NO_ERRORS_SCHEMA, Optional, Provider, RendererFactory2, SkipSelf, StaticProvider, ɵINJECTOR_SCOPE as INJECTOR_SCOPE } from '@angular/core';
 import { Color, Device, View } from '@nativescript/core';
 import { AppHostView } from './app-host-view';
@@ -40,7 +40,13 @@ export const NATIVESCRIPT_MODULE_STATIC_PROVIDERS: StaticProvider[] = [
   { provide: DEVICE, useValue: Device },
   { provide: XhrFactory, useClass: NativescriptXhrFactory, deps: [] },
 ];
-export const NATIVESCRIPT_MODULE_PROVIDERS: Provider[] = [{ provide: ViewportScroller, useClass: NullViewportScroller }];
+export const NATIVESCRIPT_MODULE_PROVIDERS: Provider[] = [
+  { provide: ViewportScroller, useClass: NullViewportScroller },
+  // Angular's dev-mode image warnings scan the DOM for <img> elements, which
+  // NativeScript has none of. Angular only skips them when both flags are set,
+  // and reaches for `document` as soon as a global PerformanceObserver exists.
+  { provide: IMAGE_CONFIG, useValue: { disableImageSizeWarning: true, disableImageLazyLoadWarning: true } },
+];
 
 @NgModule({
   imports: [ApplicationModule, DetachedLoader, NativeScriptCommonModule],