Skip to content

docs: add an Angular Native setup guide and a NativeScript reference page - #226

Merged
erkamyaman merged 2 commits into
pangular-inspector:mainfrom
erkamyaman:docs/native-guides
Oct 7, 2026
Merged

erkamyaman merged 2 commits into
pangular-inspector:mainfrom
erkamyaman:docs/native-guides

Conversation

@erkamyaman

@erkamyaman erkamyaman commented Oct 7, 2026 •

Copy link
Copy Markdown
Member

What and why

Angular Native had a reference page but no step-by-step guide, and NativeScript had a guide but no reference page. Each platform now has both: the guide is the how-to, the reference page covers what the panel shows, the options and how it works, and they link to each other.

  • New guides/angular-native.md ("Set up Angular Native"): install, start the overlay after mount(), run pangular dev (localhost, or --host for a device with the trusted-network warning), open the panel, try the demo. The overlay defaults to localhost:9999 on every platform; Android reaches it with adb reverse.
  • getting-started/angular-native.md is now the reference page and points to the guide for setup.
  • New getting-started/nativescript.md: what the panel shows, controls that have no effect there, where it shows, requirements, options (localhost on iOS, 10.0.2.2 on Android), how it works and an FAQ. guides/nativescript.md links to it.
  • Nav entries for both, the NativeScript overlay entry in the installation table, and the panel's Angular Native card, the README and the example README link to the new guide.

How it was verified

  • pnpm commit:check, pnpm format:check, pnpm typecheck
  • pnpm test:devtools (1173) and pnpm test:panel (107)
  • pnpm docs:build (link guards), pnpm test:axe
  • pnpm extension:build and extension/ui committed
  • Code samples checked against the package: initAngularNativeOverlay options, the overlay's log line, the overlay-nativescript export, the example's scripts and the CLI flags

Notes for reviewers

Writing the NativeScript reference page showed some gaps compared with Angular Native: the panel treats a NativeScript app as a browser page (no platform marker), there's no Pipes data, every reconnect gets a new page id, and the server's config (inspector switches, redaction) never reaches the app. The page describes these as they are.

Summary by CodeRabbit

  • Documentation
    • Added setup guides for Angular Native and NativeScript, with installation, configuration, connection, and troubleshooting guidance.
    • Added a NativeScript getting-started overview covering the overlay’s features, requirements, and limitations.
    • Updated documentation navigation and setup links to point to the new guides, and clarified the NativeScript overlay entry in the installation documentation.

…page

Angular Native had a reference page but no step-by-step guide, and NativeScript had a guide but no reference page. Each platform now has both: the guide is the how-to, the reference page says what the panel shows, the options and how it works, and they link to each other. The panel's Angular Native card and the READMEs link to the new guide, and the installation page lists the NativeScript overlay entry.
@erkamyaman erkamyaman self-assigned this Oct 7, 2026
@github-actions github-actions Bot added area: panel The devtools panel app (app/) area: extension The Chrome extension area: demo The demo apps area: docs The documentation site labels Oct 7, 2026
@coderabbitai

coderabbitai Bot commented Oct 7, 2026 •

Copy link
Copy Markdown
Contributor

Review in Change Stack →

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration
  • Configuration used: defaults
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: 28884dec-4033-4b8f-ba20-598074eed106
📥 Commits

Reviewing files that changed from the base of the PR and between afeff31 and 7f0c959.

⛔ Files ignored due to path filters (1)
  • extension/ui/assets/index-7Nc2FvoE.js is excluded by !**/assets/index-[0-9a-z_-][0-9a-z_-][0-9a-z_-][0-9a-z_-][0-9a-z_-][0-9a-z_-][0-9a-z_-][0-9a-z_-].js
📒 Files selected for processing (12)
  • README.md
  • app/src/__tests__/angular-native-view.test.ts
  • app/src/app.ts
  • apps/docs/src/content/getting-started/angular-native.md
  • apps/docs/src/content/getting-started/installation.md
  • apps/docs/src/content/getting-started/nativescript.md
  • apps/docs/src/content/guides/angular-native.md
  • apps/docs/src/content/guides/nativescript.md
  • apps/docs/src/ngmd.config.ts
  • examples/angular-native/README.md
  • extension/ui/assets/browser-agent-rpc-BXhoSh1z-mmdhzSnZ.js
  • extension/ui/index.html

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


📝 Walkthrough

Walkthrough

The pull request adds an Angular Native setup guide and a NativeScript overview, updates links and navigation for both, and changes the JavaScript bundle references in the extension UI.

Changes

Setup documentation

Layer / File(s) Summary
Angular Native setup guide and links
apps/docs/src/content/guides/angular-native.md, apps/docs/src/content/getting-started/angular-native.md, README.md, app/src/app.ts, app/src/__tests__/angular-native-view.test.ts, examples/angular-native/README.md, apps/docs/src/ngmd.config.ts
The new guide documents installation, overlay initialization, server setup, networking, and demo commands. The getting-started page directs readers to the guide. Related setup links and navigation point to the new guide.
NativeScript overview and references
apps/docs/src/content/getting-started/nativescript.md, apps/docs/src/content/getting-started/installation.md, apps/docs/src/content/guides/nativescript.md, apps/docs/src/ngmd.config.ts
The new overview documents NativeScript overlay setup and behavior. The installation table and NativeScript guide link to the overview and its options. The overview appears in navigation.

Extension UI bundle references

Layer / File(s) Summary
Updated JavaScript bundle references
extension/ui/index.html, extension/ui/assets/browser-agent-rpc-BXhoSh1z-mmdhzSnZ.js
The HTML module script and browser-agent RPC bundle now reference index-7Nc2FvoE.js.

Priority: ⬇️ Low

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

Change: Other

Merge Risk: ⚪ Minimal · up to 7f0c9

The documentation markers render as intended links, and the updated UI bundle references the asset that provides its import. No actionable merge risk remains.

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 4 functions across 4 files. (8 skipped: 8 … Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title clearly summarizes the main changes: adding an Angular Native setup guide and a NativeScript reference page.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
Full details: Docstring Coverage

Explanation

Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 4 functions across 4 files. (8 skipped: 8 unsupported.)

  • Fix all pre-merge checks with AI
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create a new PR
  • Autopilot · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

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

@erkamyaman
erkamyaman merged commit 98611a1 into pangular-inspector:main Oct 7, 2026
7 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area: demo The demo apps area: docs The documentation site area: extension The Chrome extension area: panel The devtools panel app (app/)

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant