autotel-devtools 27.0.0 → 27.2.0

package/README.md

@@ -176,7 +176,8 @@ process. Point them at the bound port, or free the original.
 - ✅ Service map visualization
 - ✅ Resources view (derived from telemetry)
 - ✅ GenAI run summaries + narrated walkthrough
-- ✅ **Agents view**: observe coding agents (Claude Code, opencode) from their OTel metrics + log events
+- ✅ **Agents view**: observe coding agents (Claude Code, opencode), with cost split by model, effort, skill, sub-agent and prompt
+- ✅ **WebMCP tools**: the full-page viewer offers its stored telemetry to an agent driving the page (see below)
 - ✅ Global time window shared by every tab
 - ✅ Live tail that freezes while you read, with a "N new" pill to catch up
 - ✅ Configurable telemetry limits (env vars)
@@ -202,10 +203,11 @@ on top of the per-span detail:
 
 ### Agents: observe Claude Code (and other coding agents)
 
-Coding agents like **Claude Code** emit OpenTelemetry **metrics and log events**
-(no traces). The **Agents** tab reconstructs them into a session-centric view.
-Powered by the [`autotel-agents`](../autotel-agents) package, which also handles
-opencode and is one adapter away from Codex.
+Coding agents like **Claude Code** emit OpenTelemetry **metrics and log events**.
+The **Agents** tab reconstructs them into a session-centric view, and splits the
+spend by model, effort, skill, sub-agent and prompt. Powered by the
+[`autotel-agents`](../autotel-agents) package, which also handles opencode and is
+one adapter away from Codex.
 
 One command starts the receiver _and_ launches Claude Code wired to it:
 
@@ -214,9 +216,11 @@ npx autotel-devtools claude
 ```
 
 This sets the telemetry env for a live local view: OTLP **`http/protobuf`**, 1s
-export intervals, and `session.id` kept on metrics. The receiver also accepts
-standard OTLP/gRPC on `:4317`. Then open the UI
-and switch to **Agents**.
+export intervals, and `session.id` kept on metrics. It also turns on Claude
+Code's span hierarchy — `claude_code.interaction` → `llm_request` / `tool`, with
+the sub-agent tree on `parent_agent_id` — which lands in the **Traces** tab. The
+receiver also accepts standard OTLP/gRPC on `:4317`. Then open the UI and switch
+to **Agents**.
 
 - `--print-env`: print the env block instead of launching (for managed-settings
   / MDM / VS Code), e.g. `npx autotel-devtools claude --print-env`.
@@ -325,6 +329,32 @@ The same store backs `autotel-mcp`'s `devtools` backend, so `autotel diagnose`,
 autotel diagnose errors --backend devtools --devtools-base-url http://localhost:4318
 ```
 
+### Asking an in-page agent
+
+The full-page viewer also registers itself as a set of [WebMCP](https://github.com/webmachinelearning/webmcp)
+tools, so an AI agent driving the browser can read the same telemetry without a
+CLI, an API key or a screenshot. Open the viewer in a browser that supports
+WebMCP and the tools are there:
+
+| Tool                       | Answers                                                           |
+| -------------------------- | ----------------------------------------------------------------- |
+| `autotel_query_traces`     | Search traces — one row each: name, service, status, duration     |
+| `autotel_get_trace`        | Every span of one trace, by id                                    |
+| `autotel_list_errors`      | What is failing, grouped by fingerprint                           |
+| `autotel_query_logs`       | Search log records, with the trace id when there is one           |
+| `autotel_webmcp_inventory` | The page's own WebMCP tool surface, including dropped annotations |
+
+They take the [query language](#querying) above, so "show me failing checkouts
+over 500ms" reaches the agent as `status = ERROR name contains checkout duration > 500`.
+Results are projected down to the columns the panel lists and capped per call,
+because a page of full span trees is mostly context the agent pays for and does
+not read.
+
+Read-only, and **full-page only**: the embedded widget is a guest in someone
+else's page, where `document.modelContext` belongs to that page. Registered
+against the browser's WebMCP API directly, with no runtime dependency; in a
+browser without WebMCP nothing is registered.
+
 ## Configuration
 
 ### Environment Variables

package/dist/cli.cjs

@@ -103,12 +103,14 @@ function parseBytes(value) {
 	if (!value) return void 0;
 	const match = value.trim().toLowerCase().match(/^(\d+(?:\.\d+)?)\s*(b|kb|mb|gb)?$/);
 	if (!match) return void 0;
-	return Math.floor(Number(match[1]) * {
+	const factors = {
 		b: 1,
 		kb: 1024,
 		mb: 1024 ** 2,
 		gb: 1024 ** 3
-	}[match[2] || "b"]);
+	};
+	const unit = match[2] || "b";
+	return Math.floor(Number(match[1]) * factors[unit]);
 }
 function parsePort(value) {
 	const n = Number(value);
@@ -174,6 +176,8 @@ async function startReceiver(options) {
 function buildAgentEnv(uiBase, logPrompts) {
 	const env = {
 		CLAUDE_CODE_ENABLE_TELEMETRY: "1",
+		CLAUDE_CODE_ENHANCED_TELEMETRY_BETA: "1",
+		OTEL_TRACES_EXPORTER: "otlp",
 		OTEL_METRICS_EXPORTER: "otlp",
 		OTEL_LOGS_EXPORTER: "otlp",
 		OTEL_EXPORTER_OTLP_PROTOCOL: "http/protobuf",
@@ -182,8 +186,10 @@ function buildAgentEnv(uiBase, logPrompts) {
 		OTEL_LOGS_EXPORT_INTERVAL: "1000",
 		OTEL_METRICS_INCLUDE_SESSION_ID: "true"
 	};
-	if (logPrompts) env.OTEL_LOG_USER_PROMPTS = "1";
-	return env;
+	return logPrompts ? {
+		...env,
+		OTEL_LOG_USER_PROMPTS: "1"
+	} : env;
 }
 function printEnvBlock(env) {
 	for (const [key, value] of Object.entries(env)) process.stdout.write(`export ${key}=${value}\n`);

package/dist/cli.js

@@ -103,12 +103,14 @@ function parseBytes(value) {
 	if (!value) return void 0;
 	const match = value.trim().toLowerCase().match(/^(\d+(?:\.\d+)?)\s*(b|kb|mb|gb)?$/);
 	if (!match) return void 0;
-	return Math.floor(Number(match[1]) * {
+	const factors = {
 		b: 1,
 		kb: 1024,
 		mb: 1024 ** 2,
 		gb: 1024 ** 3
-	}[match[2] || "b"]);
+	};
+	const unit = match[2] || "b";
+	return Math.floor(Number(match[1]) * factors[unit]);
 }
 function parsePort(value) {
 	const n = Number(value);
@@ -174,6 +176,8 @@ async function startReceiver(options) {
 function buildAgentEnv(uiBase, logPrompts) {
 	const env = {
 		CLAUDE_CODE_ENABLE_TELEMETRY: "1",
+		CLAUDE_CODE_ENHANCED_TELEMETRY_BETA: "1",
+		OTEL_TRACES_EXPORTER: "otlp",
 		OTEL_METRICS_EXPORTER: "otlp",
 		OTEL_LOGS_EXPORTER: "otlp",
 		OTEL_EXPORTER_OTLP_PROTOCOL: "http/protobuf",
@@ -182,8 +186,10 @@ function buildAgentEnv(uiBase, logPrompts) {
 		OTEL_LOGS_EXPORT_INTERVAL: "1000",
 		OTEL_METRICS_INCLUDE_SESSION_ID: "true"
 	};
-	if (logPrompts) env.OTEL_LOG_USER_PROMPTS = "1";
-	return env;
+	return logPrompts ? {
+		...env,
+		OTEL_LOG_USER_PROMPTS: "1"
+	} : env;
 }
 function printEnvBlock(env) {
 	for (const [key, value] of Object.entries(env)) process.stdout.write(`export ${key}=${value}\n`);