Overview - Angular-devtools

sySantosh Yadav

angular-devtoolsWorkspace

CI Pipeline Executions
- Filtered
Runs
Demo

Insights

Compare tasks
Analytics

Overview

angular-devtools

Loading workspace stats

Loading workspace insights...

Statistics interval

7 days30 days

Latest CI Pipeline Executions

Filter

Fuzzy

Sort by

© 2026 - Nx Cloud

Terms of Service Privacy Policy Changelog Status Docs Contact Nx Cloud Pricing Company @NxDevTools

angular-devtoolsWorkspace

Average execution time

1m 59s

159 CI pipeline executions

Computation time saved

3h 7m

Cache hit rate

34%

Protect cache integrity with sandboxing

Time to Green

2m 17s

Was 2m 39s, improved by 14%

Succeeded
feat/light-theme
80266cf9 feat(store): live entities and events plugin + method calls timings (#62) feat(store): live NgRx Signal Store inspector Adds a real-time inspector for @ngrx/signals stores and the classic @ngrx/store: state, computed values, per-method call counts and durations, withEntities() summaries, a per-patchState change log with diffs and event correlation, restore to any logged state (with watchState notification when registerNgrxSignals is called), dispatch-again for @ngrx/store actions, and MCP/agent tools that expose the same data. Key implementation details: - Subscribes to reducerEvents$ only; dropping the events$ subscription removes the withEventHandlers chain double-log and the dispatchDedup WeakSet entirely - currentDispatchedEvent variable (set synchronously during dispatch) correlates watchState-recorded patchState calls with their event - Component-scoped Dispatchers from provideDispatcher() are picked up in discover() and released when their element is gone - Restore entries skip args and durationMs; "not notified" message now says registerNgrxSignals({ patchState, watchState }) - watchState entries carry durationMs: elapsed from method start to that specific patchState call Co-authored-by: Kam <erkamyaman35@gmail.com>
by Abiram
Failed
feat/light-theme
80266cf9 feat(store): live entities and events plugin + method calls timings (#62) feat(store): live NgRx Signal Store inspector Adds a real-time inspector for @ngrx/signals stores and the classic @ngrx/store: state, computed values, per-method call counts and durations, withEntities() summaries, a per-patchState change log with diffs and event correlation, restore to any logged state (with watchState notification when registerNgrxSignals is called), dispatch-again for @ngrx/store actions, and MCP/agent tools that expose the same data. Key implementation details: - Subscribes to reducerEvents$ only; dropping the events$ subscription removes the withEventHandlers chain double-log and the dispatchDedup WeakSet entirely - currentDispatchedEvent variable (set synchronously during dispatch) correlates watchState-recorded patchState calls with their event - Component-scoped Dispatchers from provideDispatcher() are picked up in discover() and released when their element is gone - Restore entries skip args and durationMs; "not notified" message now says registerNgrxSignals({ patchState, watchState }) - watchState entries carry durationMs: elapsed from method start to that specific patchState call Co-authored-by: Kam <erkamyaman35@gmail.com>
by Abiram
Succeeded
feat/light-theme
7020a99a feat: NativeScript support (native overlay, example app, standalone server fixes) (#16) * refactor(overlay): share the collectors between platforms The component tree, signal graph, injector tree and NgRx collectors walk the host tree through a HostTree adapter (roots, children, parent, tag, selector, lookup) instead of the DOM directly, so an overlay for a platform without a DOM only has to describe its hosts. `domTree()` keeps the DOM walk, the CSS selector paths and the router-outlet lookup the browser overlay had, and stays the default, so its callers and payloads are unchanged. Host ids and the id lookup now take any object with a connected check supplied by the tree, and `installSignalWriteHook` moves to signal-history so another overlay can record signal writes without loading the browser overlay; the overlay still re-exports it. * feat(overlay): add a NativeScript overlay A NativeScript Angular app has no DOM, so the browser overlay cannot run in it. The new `@santoshyadavdev/ng-devtools/overlay-nativescript` entry walks the native view tree from the root component host through the shared collectors and reports over a WebSocket to a devtools server on the developer's machine, with the same page reports the browser overlay sends: the component tree and the selected component's detail, the signal graph of the selected or first signal-bearing component with its write history, the injector tree with the environment injectors above it, NgRx stores, and the highlight event, which outlines the native view. The runtime needs a few things a browser has for free. A WebSocket global must come from the app (for example @valor/nativescript-websockets), and `location` and `navigator` are shimmed for devframe's client. Angular only wires its injector profiler, which backs the DI panel, when `window` exists as the platform is created, so a `window` is defined until core publishes `getComponent` and removed then; the sentinel is that property rather than the `ng` object itself because provideRouter() publishes its own utilities onto that object earlier. The devframe client has no reconnect, and the server and the app restart independently, so a failed or dropped session is replaced after a pause. @nativescript/core is an optional peer dependency and stays external to the build, like Angular. * fix(ui): connect from the page's own base `ng-devtools dev` served the UI at / with its connection beside the page, at /__connection.json, while the UI only looked for it at /__ng-devtools/, which is where the Vite bridge and the Express mount put it, so the standalone UI never connected. The UI now tries its own base first and falls back to /__ng-devtools/. * feat: add a NativeScript example app `app-nativescript/` is an `ns create --ng` project wired to the NativeScript overlay: the WebSocket polyfill in polyfills.ts, the overlay started in main.ts before the app runs, plain-HTTP allowances for the simulator and emulator, and a showcase component with a signal, two computeds, an effect, an input and a component-level provider so every panel has something to show. The app maps the devtools package through tsconfig `paths` to its build output in packages/ng-devtools/dist, which is what the published package serves, rather than to its TypeScript sources. The sources import each other with `.ts` extensions, which the app's compiler rejects, and TypeScript never emits `.ts` sources it resolved through node_modules, so a linked package compiles to an empty module under @nativescript/webpack. `pnpm devtools:nativescript` starts the devtools server scanning the app's sources. Generated directories are left out of the Prettier check. * feat(ui): replace the NativeScript coming-soon card with setup steps The NativeScript dock is no longer marked Coming Soon. Its view shows what the integration does and how to set up an app, with a link to the README section, since a NativeScript app's data shows up in the Angular dock rather than a dock of its own. The card takes an optional heading for its list, which reads "Set up an app" here. * chore(examples): move the NativeScript example app to examples/nativescript The example sits next to the Analog demo, as `nativescript-demo`. It stays out of the pnpm workspace and installs with npm from its own lockfile, so the root install does not pull in the NativeScript toolchain. `pnpm devtools:nativescript` and the README follow the move. * fix: address CodeRabbit review on NativeScript support - overlay: close the socket when session setup fails after connecting, so retries don't leak open sockets - example: getPerson returns Person | undefined; detail page shows a not-found state - README: warn that --host 0.0.0.0 --no-auth exposes the server * docs(docs): add the NativeScript setup guide The NativeScript section of the README moves to guides/nativescript, since the README now points to the docs site. The hub dock tables list the NativeScript dock's setup steps instead of a Coming Soon placeholder. * fix(ui): link the NativeScript card to the docs guide The README no longer has a NativeScript section. Rebuilds extension/ui. * fix(demo): keep the NativeScript server on localhost by default pnpm devtools:nativescript now listens on localhost only, which the iOS simulator and the Android emulator reach. pnpm devtools:nativescript:device listens on every interface for a physical device, and the guide and the panel setup card say which to use and warn about --host with --no-auth. --------- Co-authored-by: Kam <erkamyaman35@gmail.com>
by Nathan Walker
Succeeded
feat/light-theme
9042df28 feat(ui): add light theme support to the panel Add a light neutral palette ($neutrals-light in _palette.scss) and a light-tokens mixin in _theme.scss that activates under prefers-color-scheme: light and :root[data-theme='light']. All WCAG AA contrast requirements met: accent text darkened to #c2780a (~4.9:1), status tokens darkened to accessible green/amber/red on white. Pass chrome.devtools.panels.themeName as ?theme= when the panel iframe loads, and relay live theme changes via setThemeChangeHandler → postMessage. A ThemeService signal reads the initial data-theme attribute (set by the inline flash-prevention script in index.html) and updates it on theme-change messages. The hub-rail shadow DOM style becomes a function that accepts the current theme. Remove hardcoded dark values from app/index.html, extension/panel.html, and the hub-rail inline styles. Rebuild extension/ui. Run pnpm test:axe in both dark and light color schemes; update all six "dark only" prose strings in skills, agents and docs.
by abiramcodes
Succeeded
feat/light-theme
4283acd8 feat(ui): add light theme support to the panel Add a light neutral palette ($neutrals-light in _palette.scss) and a light-tokens mixin in _theme.scss that activates under prefers-color-scheme: light and :root[data-theme='light']. All WCAG AA contrast requirements met: accent text darkened to #c2780a (~4.9:1), status tokens darkened to accessible green/amber/red on white. Pass chrome.devtools.panels.themeName as ?theme= when the panel iframe loads, and relay live theme changes via setThemeChangeHandler → postMessage. A ThemeService signal reads the initial data-theme attribute (set by the inline flash-prevention script in index.html) and updates it on theme-change messages. The hub-rail shadow DOM style becomes a function that accepts the current theme. Remove hardcoded dark values from app/index.html, extension/panel.html, and the hub-rail inline styles. Rebuild extension/ui. Run pnpm test:axe in both dark and light color schemes; update all six "dark only" prose strings in skills, agents and docs.
by abiramcodes
Succeeded
feat/light-theme
2988864a feat(ui): add light theme support to the panel Add a light neutral palette ($neutrals-light in _palette.scss) and a light-tokens mixin in _theme.scss that activates under prefers-color-scheme: light and :root[data-theme='light']. All WCAG AA contrast requirements met: accent text darkened to #c2780a (~4.9:1), status tokens darkened to accessible green/amber/red on white. Pass chrome.devtools.panels.themeName as ?theme= when the panel iframe loads, and relay live theme changes via setThemeChangeHandler → postMessage. A ThemeService signal reads the initial data-theme attribute (set by the inline flash-prevention script in index.html) and updates it on theme-change messages. The hub-rail shadow DOM style becomes a function that accepts the current theme. Remove hardcoded dark values from app/index.html, extension/panel.html, and the hub-rail inline styles. Rebuild extension/ui. Run pnpm test:axe in both dark and light color schemes; update all six "dark only" prose strings in skills, agents and docs.
by abiramcodes
Succeeded
feat/light-theme
5f67f80b feat(ui): add light theme support to the panel Add a light neutral palette ($neutrals-light in _palette.scss) and a light-tokens mixin in _theme.scss that activates under prefers-color-scheme: light and :root[data-theme='light']. All WCAG AA contrast requirements met: accent text darkened to #c2780a (~4.9:1), status tokens darkened to accessible green/amber/red on white. Pass chrome.devtools.panels.themeName as ?theme= when the panel iframe loads, and relay live theme changes via setThemeChangeHandler → postMessage. A ThemeService signal reads the initial data-theme attribute (set by the inline flash-prevention script in index.html) and updates it on theme-change messages. The hub-rail shadow DOM style becomes a function that accepts the current theme. Remove hardcoded dark values from app/index.html, extension/panel.html, and the hub-rail inline styles. Rebuild extension/ui. Run pnpm test:axe in both dark and light color schemes; update all six "dark only" prose strings in skills, agents and docs.
by abiramcodes