test(overlay): make the real app diagnosis and page highlight tests stable

[erkamyaman]

What and why

Two package tests failed under load. Only the two test files change. No product code changes, nothing is skipped, no assertion changes and no timeout is raised.

cd-diagnosis-real. The tests waited fixed delays instead of the real conditions: 20 ms for the signal write hook (a dynamic import) to be installed, and 20 to 60 ms for Angular's zoneless tick. On a busy machine the tick had not run yet, so report.cycles was empty. They now:

• await appRef.whenStable() after bootstrap and after each click or timer write;
• resolve the timer write once its setTimeout callback has run;
• vi.waitFor the write hook instead of sleeping.

page-highlight. "keeps a panel highlight until a clear arrives" imported overlay.ts inside the test body, which took 2 to 3.5 s of the 5 s timeout. vi.useFakeTimers() also faked requestAnimationFrame, so advancing the minute-long safety timer replayed about 4,400 redraw frames. Under load it timed out every time and left its overlay running, which then broke the next test. Now initOverlay is imported at the top of the file, and only setTimeout and clearTimeout are faked.

How it was verified

30 runs of both files each, with 6 busy-loop processes on a 4-core machine for "under load":

	Before	After
Timer test, under load	19/30 failed	0/30
Click test, under load	8/30 failed	0/30
Page highlight test, under load	30/30 timed out	0/30 (median 148 ms)
Page highlight test, alone	median 2.9 s	median 54 ms
Next page highlight test, under load	20/30 failed	0/30

• pnpm commit:check
• pnpm format:check
• pnpm typecheck
• pnpm test:devtools: 3 full runs, all passing
• pnpm test:panel (no app/ change)
• Docs: not needed, test-only change

Summary by CodeRabbit

• Tests
  • Updated change-detection tests to wait for application stability and signal-write readiness, reducing reliance on fixed timing delays.
  • Adjusted overlay tests to use real animation-frame scheduling while keeping timer behavior controlled. These changes make automated test results more consistent without changing user-facing functionality.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

• Configuration used: defaults
• Review profile: CHILL
• Plan: Advanced
• Run ID: b634136d-e07d-402a-acea-fe1f22b691e5

📥 Commits

Reviewing files that changed from the base of the PR and between e91767b and a38e48d.

📒 Files selected for processing: 2

• packages/devtools/src/__tests__/cd-diagnosis-real.test.ts
• packages/devtools/src/__tests__/page-highlight.test.ts

Included review availability: This review used your included allowance. Your plan provides up to 10 included reviews per hour; 5 remain after this review.

📝 Walkthrough

The change updates devtools tests to wait for Angular stability and signal-hook availability. It also changes how overlay tests import initOverlay and mock timers.

Changes: Devtools test updates

Layer / File(s)	Summary
Change-detection test synchronization packages/devtools/src/__tests__/cd-diagnosis-real.test.ts	The tests wait for Angular stability instead of fixed delays. Recording setup polls for the signal-write hook for up to three seconds.
Overlay test timer handling packages/devtools/src/__tests__/page-highlight.test.ts	The tests import initOverlay at module load. The timer test fakes only setTimeout and clearTimeout.

Priority: ⬇️ Low

Estimated code review effort: 2 (Simple) | ~10 minutes

Change: Other

Merge Risk: ⚪ Minimal · up to a38e4

The changes improve test synchronization and timer isolation. No concrete merge-blocking risk remains, so the PR appears ready to merge after normal checks.

Pre-merge checks: 4 · 1

Failed checks: 1 warning

Check name	Status	Explanation	Resolution
Docstring Coverage		Docstring coverage is 33.33% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 3 functions across 2 files.	Write docstrings for the functions missing them to satisfy the coverage threshold.

Passed checks: 4 passed

Check name	Status	Explanation
Description Check		Check skipped - CodeRabbit’s high-level summary is enabled.
Title check		The title clearly and concisely describes the main change: stabilizing the real app diagnosis and page highlight tests.
Linked Issues check		Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check		Check skipped because no linked issues were found for this pull request.

• Fix all pre-merge checks with AI

✨ Finishing Touches: 💡 1

📝 Generate docstrings: 💡

• Commit to this branch
• Create a new PR

🧪 Generate unit tests (beta)

• Commit to this branch
• Create a new PR

• Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

_{Comment @coderabbitai help to get the list of available commands.}

[nx-cloud]

View your CI Pipeline Execution ↗ for commit a38e48d

Command	Status	Duration	Result
nx affected -t test build	✅ Succeeded	51s	View ↗

💡 Verify your cache is correct by running tasks in a sandbox. Read docs ↗

---

☁️ Nx Cloud last updated this comment at 2026-10-13 18:38:24 UTC

[cloudflare-workers-and-pages]

🚀 Deploying Preview to Cloudflare 🚀

Preview Deployments by commit

Status	Deployment URL	Commit	Updated (UTC)	See this deployment's details
Build: Failed ❌ View logs ↗		a38e48d	2026-10-13T18:37:43.022Z	View logs ↗