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
Make the panel a place you stay in: commands, settings, one timeline, errors, and a one-command setup. Devframe already ships most of the shell (ctx.commands, ctx.messages, ctx.terminals, settings), and the devtools use only docks.register, rpc, sharedState and agent today, so most of this phase is wiring. Rough size: 4 to 6 weeks. Follows #340 and #341.
Shell
Command palette (Cmd/Ctrl+K) through ctx.commands, with a command for every tab and action (pick, record change detection, clear, dock mode). Use a local palette when there is no hub. Add a global popup shortcut, configurable through popup.hotkey.
Settings page: theme toggle, hide, pin and reorder tabs, and a passive mode where the popup stays hidden until the shortcut.
A splitter for the docked popup, and pop-out into its own window.
Deep links to an item, not just a tab (#tab=&id=&page=), plus an open-in-panel agent tool.
One timeline with toggleable layers for router, HTTP, NgRx, change detection, forms and signals, instead of five separate timelines.
Errors inspector: wrap ErrorHandler, error and unhandledrejection, parse NG0xxx codes with a doc link, and link the owning component. Replace the three console patches with one console tap. Add list-errors, explain-error and list-console agent tools.
A terminals dock (ctx.terminals) for ng build and ng test output.
Reuse devframe plugins and services where they fit (@devframes/plugin-a11y, @devframes/plugin-data-inspector, @devframes/plugin-messages, @devframes/service-open) instead of building the same thing again.
Setup and distribution
An ng add schematic that patches main.ts and server.ts, plus a dev-server builder that mounts the hub middleware. This removes the CLI, proxy and one-time-code steps from the client-only setup.
Publish the extension to the Chrome Web Store and Edge Add-ons, and ship a Firefox build.
Docs: a one-path quick start and screenshots on every inspector page.
Push deltas instead of full snapshots for the component tree, injectors, change detection and forms. Use MutationObserver dirty flags, throttle to about once a second, and add an activity lease so idle pages stop pushing.
Virtualize long lists and trees (2,000-row tables), starting with content-visibility.
Done when
Every tab and action is reachable from the command palette.
Goal
Make the panel a place you stay in: commands, settings, one timeline, errors, and a one-command setup. Devframe already ships most of the shell (
ctx.commands,ctx.messages,ctx.terminals, settings), and the devtools use onlydocks.register,rpc,sharedStateandagenttoday, so most of this phase is wiring. Rough size: 4 to 6 weeks. Follows #340 and #341.Shell
ctx.commands, with a command for every tab and action (pick, record change detection, clear, dock mode). Use a local palette when there is no hub. Add a global popup shortcut, configurable throughpopup.hotkey.#tab=&id=&page=), plus anopen-in-panelagent tool.ErrorHandler,errorandunhandledrejection, parse NG0xxx codes with a doc link, and link the owning component. Replace the three console patches with one console tap. Addlist-errors,explain-errorandlist-consoleagent tools.ctx.terminals) forng buildandng testoutput.@devframes/plugin-a11y,@devframes/plugin-data-inspector,@devframes/plugin-messages,@devframes/service-open) instead of building the same thing again.Setup and distribution
ng addschematic that patchesmain.tsandserver.ts, plus a dev-server builder that mounts the hub middleware. This removes the CLI, proxy and one-time-code steps from the client-only setup.Platforms
Performance and scale
content-visibility.Done when
Generated by Claude Code