Vision

The gap between seeing a bug and editing the code that causes it is pure overhead:
you spot the misaligned button, then go hunting through a component tree in your
editor to find which file renders it. Inspekt closes that gap to one click. The
inspector knows the source location of every element because the bundler plugin
wrote it there at build time — so clicking is the lookup.

That same context is exactly what a coding agent needs and almost never gets.
"Fix this button" is useless without a file and a line; Inspekt turns the element
you clicked into a grab the agent can read over MCP, carrying the file, line,
component name, surrounding source, and page URL.

The problem

Browser devtools show you the DOM, not your source. Framework devtools show you
the component tree, but stop at the boundary of your editor and know nothing
about your agent. And each of them is a separate extension per framework, so the
workflow resets every time you switch stacks.

Meanwhile, describing a UI element to an AI agent in prose is the slowest part of
using one. The information the agent needs is already on screen and already in
the build output — it just has no path from the browser to the agent.

How it's different

Framework-agnostic by construction. The source location is injected at
build time onto every element, so the inspector works the same whether the app
is React, Vue, Svelte, or Solid — and a generic DOM adapter covers the rest.
Any bundler. Vite gets a first-class plugin with a dev-server integration;
Webpack, Rspack, esbuild, and Rollup get the same transform through unplugin.
Built for the handoff. The daemon holds a grab queue and the MCP server
exposes it to agents over stdio, so an element you clicked in Chrome becomes a
file and line in Claude Code, Cursor, Codex, Gemini CLI, or Antigravity.
Docker is a first-class case. When the app runs in a container, paths point
at /app/...; Inspekt reads the volume mounts out of docker-compose.yaml and
maps them back to your real checkout.
Works without a build step too. The Chrome extension carries global
settings across projects and can inject the inspector into a page that has no
plugin installed at all.

MIT licensed and published to npm as @aylith/inspekt-* — install
@aylith/inspekt for everything at once, or just the plugin for your bundler.

Inspekt Changelog