@absolutejs/absolute 0.19.0-beta.750 → 0.19.0-beta.752

package/dist/dev/client/handlers/angular.ts

@@ -606,6 +606,34 @@ const tickAngularApp = () => {
 	}
 };
 
+/* Resolve when Angular reports the application is stable: no pending
+   microtasks, scheduled CD, or in-flight lazy chunk loads. Used to gate
+   the close of the HMR restoration window so lazy-route components get
+   a chance to construct (and call `preserveAcrossHmr`) before
+   `rebootInProgress` flips back to false. Falls back after a generous
+   ceiling in the unlikely case `whenStable` never resolves (e.g. an
+   infinite retry on a service the new app never finishes initializing) —
+   we'd rather close the window than leave HMR wedged forever. */
+const APP_STABLE_FALLBACK_MS = 10_000;
+
+const waitForAppStable = async () => {
+	const app = window.__ANGULAR_APP__;
+	if (!app || typeof app.whenStable !== 'function') return;
+
+	let timer: ReturnType<typeof setTimeout> | undefined;
+	const fallback = new Promise<void>((resolve) => {
+		timer = setTimeout(resolve, APP_STABLE_FALLBACK_MS);
+	});
+
+	try {
+		await Promise.race([app.whenStable(), fallback]);
+	} catch {
+		/* ignored — fallback timer still resolves */
+	} finally {
+		if (timer !== undefined) clearTimeout(timer);
+	}
+};
+
 /* `runWithViewTransition` wraps a callback in `document.startViewTransition`
    for a smooth crossfade across full re-bootstraps. Queueing is NOT needed
    here because `handleAngularUpdate` already serializes incoming messages
@@ -714,12 +742,14 @@ const handleFullUpdate = async (message: HMRMessage) => {
 			// `bootstrapAngularModule` returns — the route activation
 			// chain (loadComponent → dynamic import → instantiate) runs
 			// asynchronously after the root app reports bootstrapped.
-			// Keep the flag on for a brief grace window so those lazy
-			// components also restore from cache. 750ms is generous
-			// enough for typical chunk loads (~50-200ms cold) and short
-			// enough that a user can't navigate within the window —
-			// preventing stale-state on subsequent navigations.
-			setTimeout(endHmrPreservedReboot, 750);
+			// Wait for the application to become stable so those lazy
+			// components have constructed and called `preserveAcrossHmr`
+			// before we close the restoration window. `whenStable`
+			// resolves when there are no pending tasks (lazy chunk
+			// loads, microtasks, scheduled CD) — strictly event-based,
+			// no fixed timer needed.
+			await waitForAppStable();
+			endHmrPreservedReboot();
 		}
 	};
 
@@ -744,6 +774,7 @@ type HmrPreserveScope = typeof globalThis & {
 	__ABS_HMR_TRACKED_INSTANCES__?: Set<WeakRef<object>>;
 	__ABS_HMR_INSTANCE_KEYS__?: WeakMap<object, string>;
 	__ABS_HMR_REBOOT_IN_PROGRESS__?: { value: boolean };
+	__ABS_HMR_REBOOT_STATS__?: { captured: number; restoredKeys: Set<string> };
 };
 
 const isPreservableValue = (value: unknown, depth = 0): boolean => {
@@ -768,11 +799,20 @@ const isPreservableValue = (value: unknown, depth = 0): boolean => {
 	return false;
 };
 
+const getHmrRebootStats = (scope: HmrPreserveScope) =>
+	(scope.__ABS_HMR_REBOOT_STATS__ ??= {
+		captured: 0,
+		restoredKeys: new Set<string>()
+	});
+
 const captureHmrPreservedInstanceStates = () => {
 	const scope = globalThis as HmrPreserveScope;
 	const tracker = scope.__ABS_HMR_TRACKED_INSTANCES__;
 
 	const flag = (scope.__ABS_HMR_REBOOT_IN_PROGRESS__ ??= { value: false });
+	const stats = getHmrRebootStats(scope);
+	stats.captured = 0;
+	stats.restoredKeys.clear();
 
 	if (!tracker || tracker.size === 0) {
 		// Nothing tracked, but still flip the flag so any service/component
@@ -786,17 +826,15 @@ const captureHmrPreservedInstanceStates = () => {
 
 	const cache = (scope.__ABS_HMR_INSTANCE_STATE__ ??= new Map());
 	const keyMap = scope.__ABS_HMR_INSTANCE_KEYS__;
-	const dead: WeakRef<object>[] = [];
 	const seen = new Set<string>();
 
 	cache.clear();
 
 	for (const ref of tracker) {
 		const instance = ref.deref();
-		if (!instance) {
-			dead.push(ref);
-			continue;
-		}
+		// Skip already-GC'd refs. We don't bother bookkeeping a "dead"
+		// list because the entire tracker is cleared after this loop.
+		if (!instance) continue;
 
 		const className = instance.constructor?.name;
 		if (!className || className === 'Object') continue;
@@ -815,9 +853,17 @@ const captureHmrPreservedInstanceStates = () => {
 			if (isPreservableValue(value)) props[prop] = value;
 		}
 		cache.set(fullKey, props);
+		stats.captured++;
 	}
 
-	dead.forEach((ref) => tracker.delete(ref));
+	// Every instance just captured is about to die: `destroyAngularApp()`
+	// runs immediately after this. New instances from the next bootstrap
+	// repopulate the tracker via their own `preserveAcrossHmr(this)`
+	// calls. If we left existing WeakRefs in place, the JS engine often
+	// won't have GC'd the old objects yet at the next capture — those
+	// zombies would inflate the captured count and trigger spurious
+	// collision warnings against the new generation's instances.
+	tracker.clear();
 
 	flag.value = true;
 };
@@ -826,4 +872,16 @@ const endHmrPreservedReboot = () => {
 	const scope = globalThis as HmrPreserveScope;
 	const flag = scope.__ABS_HMR_REBOOT_IN_PROGRESS__;
 	if (flag) flag.value = false;
+
+	const stats = scope.__ABS_HMR_REBOOT_STATS__;
+	if (stats && stats.captured > 0) {
+		const restored = Array.from(stats.restoredKeys)
+			.map((k) => k.replace(/:$/, ''))
+			.sort();
+		console.info(
+			`[HMR] Full re-bootstrap: restored state for ${restored.length}/${stats.captured} tracked instance(s)${
+				restored.length > 0 ? ` — ${restored.join(', ')}` : ''
+			}. Components without preservation reset to defaults; opt in via \`preserveAcrossHmr(this)\`.`
+		);
+	}
 };

package/dist/dev/client/handlers/angularRuntime.ts

@@ -25,6 +25,7 @@ import type {} from '../../../types/globals';
 type AngularComponentDefinition = {
 	providers?: unknown;
 	providersResolver?: unknown;
+	selectors?: unknown[];
 };
 
 type ComponentCtor = (abstract new (...args: never[]) => unknown) & {
@@ -72,6 +73,35 @@ const updateCounter: { value: number } =
 	globalScope.__ANGULAR_HMR_UPDATE_COUNT__ ??
 	(globalScope.__ANGULAR_HMR_UPDATE_COUNT__ = { value: 0 });
 
+/* Cheap structural fingerprint. Functions render as 'fn' (treated as
+   opaque — they change on every module reload but the static config
+   like provider tokens, useValue payloads, etc. is what we care
+   about). Objects walk depth-bounded with sorted keys so key order
+   doesn't cause spurious diffs. Used both for component-level
+   provider arrays and for page-level `routes`/`providers` exports. */
+const fingerprint = (value: unknown, depth = 0): string => {
+	if (depth > 6) return '~deep~';
+	if (value === null) return 'null';
+	if (value === undefined) return 'undef';
+	if (typeof value === 'function') return 'fn';
+	if (typeof value === 'symbol') return value.toString();
+	if (Array.isArray(value)) {
+		return (
+			'[' + value.map((v) => fingerprint(v, depth + 1)).join(',') + ']'
+		);
+	}
+	if (typeof value === 'object') {
+		const obj = value as Record<string, unknown>;
+		const entries = Object.entries(obj)
+			.map(([k, v]): [string, string] => [k, fingerprint(v, depth + 1)])
+			.sort(([a], [b]) => a.localeCompare(b));
+
+		return '{' + entries.map(([k, v]) => `${k}:${v}`).join(',') + '}';
+	}
+
+	return JSON.stringify(value);
+};
+
 const hasInjectorProviderChanges = (
 	oldCtor: ComponentCtor,
 	newCtor: ComponentCtor
@@ -81,7 +111,7 @@ const hasInjectorProviderChanges = (
 	const newP = newCtor.ɵinj?.providers;
 	if (!Array.isArray(oldP) || !Array.isArray(newP)) return false;
 
-	return oldP.length !== newP.length;
+	return fingerprint(oldP) !== fingerprint(newP);
 };
 
 const hasComponentProviderChanges = (
@@ -91,8 +121,21 @@ const hasComponentProviderChanges = (
 	if (!oldCtor.ɵcmp || !newCtor.ɵcmp) return false;
 	const oldResolver = oldCtor.ɵcmp.providersResolver;
 	const newResolver = newCtor.ɵcmp.providersResolver;
+	// Defined-ness flip — added/removed `providers: [...]` entirely.
+	if ((oldResolver === undefined) !== (newResolver === undefined))
+		return true;
+	if (typeof oldResolver !== 'function' || typeof newResolver !== 'function')
+		return false;
 
-	return (oldResolver === undefined) !== (newResolver === undefined);
+	// `providersResolver` is the function the Angular compiler emits to
+	// merge a component's `providers` array into the element injector.
+	// Its source body inlines the provider tokens and useValue/useFactory
+	// references, so a change to the user's `providers: [...]` array
+	// produces a different function body. Comparing `toString()` catches
+	// content changes that the old length/defined-ness check missed —
+	// e.g. swapping `useValue: 'foo'` for `useValue: 'bar'` while
+	// keeping the array length identical.
+	return oldResolver.toString() !== newResolver.toString();
 };
 
 const hasProviderChanges = (oldCtor: ComponentCtor, newCtor: ComponentCtor) => {
@@ -175,6 +218,55 @@ const patchConstructor = (entry: RegistryEntry, newCtor: ComponentCtor) => {
 	entry.registeredAt = Date.now();
 };
 
+/* The fast-patch swap of `ɵcmp` and prototype methods doesn't mark
+   live OnPush components as dirty — `applicationRef.tick()` alone
+   only checks views that are already marked dirty. So a template
+   edit on an OnPush component would silently fail to render until
+   the user clicked something that triggered a markForCheck.
+   We collect every successfully-patched ctor here, then `refresh()`
+   walks the DOM for each ctor's selector, gets the live instance via
+   the `ng` debug API, and calls `applyChanges` on it (which marks
+   the view dirty AND runs CD on its subtree). */
+const pendingFastPatchRefresh: Set<ComponentCtor> = new Set();
+
+type AngularDebugWindow = Window & {
+	ng?: {
+		applyChanges?: (component: unknown) => void;
+		getComponent?: (element: Element) => unknown;
+	};
+};
+
+const componentTagSelectors = (ctor: ComponentCtor): string[] => {
+	const selectors = ctor.ɵcmp?.selectors;
+	if (!Array.isArray(selectors)) return [];
+	const tags: string[] = [];
+	for (const tuple of selectors) {
+		if (!Array.isArray(tuple)) continue;
+		const head = tuple[0];
+		// Component selectors lead with the tag name (a hyphenated
+		// element name); attribute selectors lead with `''`. Skip the
+		// attribute case — those are directives, not OnPush views.
+		if (typeof head === 'string' && head.includes('-')) tags.push(head);
+	}
+
+	return tags;
+};
+
+const markPatchedDirty = (ctor: ComponentCtor) => {
+	const ng = (window as AngularDebugWindow).ng;
+	if (!ng?.getComponent || !ng?.applyChanges) return;
+	for (const tag of componentTagSelectors(ctor)) {
+		document.querySelectorAll(tag).forEach((el) => {
+			try {
+				const instance = ng.getComponent?.(el);
+				if (instance) ng.applyChanges?.(instance);
+			} catch {
+				/* dev-only debug API — ignore failures */
+			}
+		});
+	}
+};
+
 const applyUpdate = (id: string, newCtor: unknown) => {
 	if (!isComponentCtor(newCtor)) return false;
 
@@ -209,6 +301,13 @@ const applyUpdate = (id: string, newCtor: unknown) => {
 
 	try {
 		patchConstructor(entry, newCtor);
+		// Queue this ctor for `refresh()` to mark its live instances
+		// dirty — the patch swapped metadata in place, but OnPush
+		// components need an explicit markForCheck to re-render.
+		// `liveCtor` is the on-page constructor (we patched into it);
+		// we use that for selector lookup since the swap may have
+		// updated `ɵcmp` on `liveCtor` itself.
+		pendingFastPatchRefresh.add(liveCtor);
 
 		return true;
 	} catch (err) {
@@ -220,6 +319,15 @@ const applyUpdate = (id: string, newCtor: unknown) => {
 
 const refresh = () => {
 	if (!window.__ANGULAR_APP__) return;
+	// Mark every live instance of every patched component dirty before
+	// ticking. `tick()` alone wouldn't re-render OnPush components,
+	// since they only re-check on `markForCheck`. `applyChanges` marks
+	// the view dirty and runs CD on its subtree — covers both OnPush
+	// and Default change-detection components correctly.
+	for (const ctor of pendingFastPatchRefresh) {
+		markPatchedDirty(ctor);
+	}
+	pendingFastPatchRefresh.clear();
 	try {
 		window.__ANGULAR_APP__.tick();
 	} catch (err) {
@@ -265,29 +373,6 @@ const pageExportRecords = ((
 	globalThis as { __ABS_HMR_PAGE_EXPORTS__?: Map<string, PageExportRecord> }
 ).__ABS_HMR_PAGE_EXPORTS__ ??= new Map<string, PageExportRecord>());
 
-const fingerprint = (value: unknown, depth = 0): string => {
-	if (depth > 6) return '~deep~';
-	if (value === null) return 'null';
-	if (value === undefined) return 'undef';
-	if (typeof value === 'function') return 'fn';
-	if (typeof value === 'symbol') return value.toString();
-	if (Array.isArray(value)) {
-		return (
-			'[' + value.map((v) => fingerprint(v, depth + 1)).join(',') + ']'
-		);
-	}
-	if (typeof value === 'object') {
-		const obj = value as Record<string, unknown>;
-		const entries = Object.entries(obj)
-			.map(([k, v]): [string, string] => [k, fingerprint(v, depth + 1)])
-			.sort(([a], [b]) => a.localeCompare(b));
-
-		return '{' + entries.map(([k, v]) => `${k}:${v}`).join(',') + '}';
-	}
-
-	return JSON.stringify(value);
-};
-
 const recordPageExports = (
 	sourceId: string,
 	routes: unknown,

package/dist/src/angular/preserveAcrossHmr.d.ts

@@ -17,9 +17,13 @@ export declare const preserveAcrossHmr: (instance: object, key?: string | number
  *  are skipped — the new instance gets fresh ones from its new
  *  injector, just like at first bootstrap. */
 export declare const captureTrackedInstanceStates: () => void;
-/** Clear the active-reboot flag. Called by the HMR client after the
- *  new app has finished bootstrapping (success or failure — wrap in
- *  `try/finally`). After this, `preserveAcrossHmr` calls will track
- *  but won't restore — so navigating to a route after HMR doesn't
- *  resurrect stale state from the last reboot. */
+/** Clear the active-reboot flag and emit a one-line summary so
+ *  developers can see at-a-glance which classes had state preserved.
+ *  Helps surface the existence of `preserveAcrossHmr` to anyone whose
+ *  state was reset because they hadn't opted in.
+ *  Called by the HMR client after the new app has finished
+ *  bootstrapping (success or failure — wrap in `try/finally`). After
+ *  this, `preserveAcrossHmr` calls will track but won't restore — so
+ *  navigating to a route after HMR doesn't resurrect stale state from
+ *  the last reboot. */
 export declare const endHmrReboot: () => void;

package/dist/types/globals.d.ts

@@ -56,7 +56,11 @@ declare global {
 		__SVELTE_COMPONENT__?: Record<string, unknown>;
 		__ABS_SVELTE_ISLAND_HTML__?: Record<string, string>;
 		__SVELTE_UNMOUNT__?: () => void;
-		__ANGULAR_APP__?: { destroy: () => void; tick: () => void } | null;
+		__ANGULAR_APP__?: {
+			destroy: () => void;
+			tick: () => void;
+			whenStable: () => Promise<void>;
+		} | null;
 		__HMR_SKIP_HYDRATION__?: boolean;
 		__HMR_NEW_PAGE_CLASS__?: unknown;
 		__NG_REPLACE_METADATA__?: (...args: unknown[]) => void;

package/package.json

@@ -349,5 +349,5 @@
 			]
 		}
 	},
-	"version": "0.19.0-beta.750"
+	"version": "0.19.0-beta.752"
 }