You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
Repository navigation
Commit bd654b4
Browse filesBrowse the repository at this point in the historyBrowse files
Copy file name to clipboardExpand all lines: apps/docs/src/content/agents/tools.md
+8-7Lines changed: 8 additions & 7 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -665,7 +665,7 @@ Stores that report through the Redux DevTools extension API, such as NGXS, Elf a
665
665
666
666
All router tools read the page, except `scan-render-mode`, which also reads your `*.routes.server.ts` files.
667
667
668
-
On a page that runs more than one Angular app with a Router, `inspect-route`, `explain-navigation`, `diff-navigations`, `preview-navigation`, `list-routes`, `lint-routes` and `router-config` take an optional `app`: the app's id (the tag of its root, such as `app-root`) or its root component name. Without `app` they answer for the first app, and the answer ends with a line that names the other apps. An unknown `app` is refused with the list of apps. See [Several apps on one page](../inspectors/router.md#several-apps-on-one-page).
668
+
On a page that runs more than one Angular app with a Router, `inspect-route`, `explain-navigation`, `diff-navigations`, `follow-navigations`, `preview-navigation`, `list-routes`, `lint-routes` and `router-config` take an optional `app`: the app's id (the tag of its root, such as `app-root`) or its root component name. Without `app` they answer for the first app, and the answer ends with a line that names the other apps. An unknown `app` is refused with the list of apps. See [Several apps on one page](../inspectors/router.md#several-apps-on-one-page).
669
669
670
670
### Read the current route
671
671
@@ -683,13 +683,14 @@ Use `diff-navigations` for "why did this work last time". Without `b`, it takes
683
683
684
684
`follow-navigations` returns the navigations that are new or changed since a cursor, oldest first, across every page. Use it to follow a login and redirect flow step by step without calling `explain-navigation` in a loop. Reads: page.
|`since`| The cursor a previous call returned. Without it, the tool lists the last 5 navigations and the current cursor. |
689
-
|`waitMs`| With `since`: how long to wait, at most 30000 ms, when no navigation came after the cursor yet. The tool answers as soon as one comes. Default 0. |
|`since`| The cursor a previous call returned. Without it, the tool lists the last 5 navigations and the current cursor. |
689
+
|`waitMs`| With `since`: how long to wait, at most 30000 ms, when no navigation came after the cursor yet. The tool answers as soon as one comes. Default 0. |
690
+
|`page`| Only the navigations of this page. |
691
+
|`app`| On a page that runs several Angular apps with a Router, the app to follow: its id or root component name. Without it, the tool follows the first app of each page. |
691
692
692
-
Each line has the sequence number, the page, the navigation id, the URL, the outcome, the time, a redirect target and the reason it failed. The answer ends with **Next cursor**: pass it as `since` on the next call. A navigation that was still pending comes again with `(updated)` once it ends, is redirected or changes target. Probes are left out. The server keeps the last 500 changes, and says how many a cursor missed. A cursor from before the server started lists everything it kept.
693
+
Each line has the sequence number, the page, the app (for an app other than the first), the navigation id, the URL, the outcome, the time, a redirect target and the reason it failed. The answer ends with **Next cursor**: pass it as `since` on the next call. A navigation that was still pending comes again with `(updated)` once it ends, is redirected or changes target. Probes are left out. The server keeps the last 500 changes, and says how many a cursor missed. A cursor from before the server started lists everything it kept.
Copy file name to clipboardExpand all lines: apps/docs/src/content/inspectors/router.md
+12-10Lines changed: 12 additions & 10 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -179,18 +179,20 @@ The overlay reads the helper `provideRouter()` publishes (`ng.ɵgetRouterInstanc
179
179
180
180
A page can bootstrap more than one Angular app, with several `bootstrapApplication()` calls or micro-frontends. Each app root (an element with `ng-version`) that has its own Router counts as an app. Roots that share one Router count once.
181
181
182
-
When a page has more than one, the **Live router** heading shows an **App** picker. Each app is listed by its root component and tag, such as `ShellApp <app-root>`. The first app is the router that has routes or has navigated, else the first root. Pick another app to see its route, navigations, config, setup and lint. The buttons that act on the router (**Go**, **Read lazy**, **Abort**, **Probe in app** and **Replay**) run on the app you picked. A page with one app shows no picker.
182
+
When a page has more than one, the **Live router** heading shows an **App** picker. Each app is listed by its root component and tag, such as `ShellApp <app-root>`. The first app is the router that has routes or has navigated, else the first root. Pick another app to see its route, navigations, config, setup, outlets, links, preloads and lint. The buttons that act on the router (**Go**, **Read lazy**, **Abort**, **Probe in app** and **Replay**) run on the app you picked. A page with one app shows no picker.
183
183
184
184
Each app has an id: the tag of its root, with `-2`, `-3` and so on for a second root with the same tag. The id stays the same while the root is on the page, and a root that replaces a removed one with the same tag gets the same id back. The router agent tools take that id, or the root component name, as `app`.
185
185
186
-
Some parts stay with the first app:
186
+
The overlay watches each app's Router on its own, so nothing one app does shows under another:
| Navigations and callers | The app whose Router navigated. A `RouterLink` click counts for the app whose Router the link uses. |
191
+
| Outlets | The app whose Router fills them. |
192
+
| Links | The app whose Router the `RouterLink` or `RouterLinkActive` directive uses. A link that names no Router goes to the first app. Each app lists at most 100 links, and the 2000-element check covers the whole page. |
193
+
| Preloads | The app whose preloader ran them. |
194
+
| Guard and resolver runs | The app that ran them. A guard two apps share (one class, or one routes array) is wrapped once, and each run goes to the app with a navigation in progress. **Record each guard and resolver** covers every app. |
195
+
| History changes made outside the router | The first app. They come from the browser's Navigation API, which the whole page shares. |
194
196
195
197
### Development builds
196
198
@@ -260,7 +262,7 @@ Without that recording, the guards listed for a navigation are candidates: the `
|`pangular:explain-navigation`| Why a navigation failed or redirected, with any loop and the cause of each hop. Pass `url` or `id` to narrow it, `limit` for more than the last 5 (up to `limits.navigations`), `perf` for the slowest ones, or `format: "repro"` for a markdown repro of one navigation. |
262
264
|`pangular:diff-navigations`| What changed between two navigations: params, data, guards, resolvers, outlets, components and timing. Pass `a` and `b`, or leave them out to compare the newest navigation with the last one to the same path. |
263
-
|`pangular:follow-navigations`| New and changed navigations since a cursor, across pages. Pass the cursor back as `since`, with `waitMs` to wait for the next navigation. |
265
+
|`pangular:follow-navigations`| New and changed navigations since a cursor, across pages. Pass the cursor back as `since`, with `waitMs` to wait for the next navigation, and `app` to follow another app.|
264
266
|`pangular:preview-navigation`| What going to a URL would do, from the live config and without navigating: redirects, the route chain, guards, lazy chunks, resolvers and components in order, source files and render mode. |
265
267
|`pangular:inspect-route`| The route the page is on. Pass `component` (a component class, tag or link text) for the route a component was rendered for, or a link state. |
266
268
|`pangular:list-routes`| The live config with source files and example URLs. `match` predicts a URL, `audit` lists the guards of each page, `resolveLazy` loads the routes of a lazy route first. |
@@ -273,7 +275,7 @@ Without that recording, the guards listed for a navigation are candidates: the `
273
275
|`pangular:record-guards`| Turns per-guard and per-resolver recording on or off. |
274
276
|`pangular:router` (resource) | The active route tree and recent navigations of each page. |
275
277
276
-
On a page that runs several apps, `inspect-route`, `explain-navigation`, `diff-navigations`, `preview-navigation`, `list-routes`, `lint-routes` and `router-config` take an optional `app`: the app's id or root component name. Without it they answer for the first app and name the others.
278
+
On a page that runs several apps, `inspect-route`, `explain-navigation`, `diff-navigations`, `follow-navigations`, `preview-navigation`, `list-routes`, `lint-routes` and `router-config` take an optional `app`: the app's id or root component name. Without it they answer for the first app and name the others.
277
279
278
280
`navigate` and `probe-route` only accept same-origin relative URLs that start with `/`. With [`actions.router`](../getting-started/configuration.md#actions) set to `false`, the server drops `navigate` and `probe-route`, and keeps `record-guards` and `list-routes` with `resolveLazy`. See [Tools](../agents/tools.md).
0 commit comments