browser-debugger-cli 0.7.2 → 0.9.0

package/dist/ui/formatters/a11y.js

@@ -1,4 +1,5 @@
-import { OutputFormatter } from '../../ui/formatting.js';
+import { OutputFormatter, areHintsHidden } from '../formatting.js';
+import { a11yMoreMatchesNote } from '../messages/commands.js';
 /**
  * Maximum number of nodes to display in tree output before truncating.
  * Prevents overwhelming terminal output for large accessibility trees.
@@ -20,18 +21,68 @@ const SEPARATOR_WIDTH = 50;
 export function formatA11yTree(tree) {
     const fmt = new OutputFormatter();
     fmt.text(`Accessibility Tree (${tree.count} nodes)`).separator('─', SEPARATOR_WIDTH).blank();
-    const nodes = Array.from(tree.nodes.values()).slice(0, MAX_TREE_NODES_DISPLAY);
-    for (const node of nodes) {
-        fmt.text(formatA11yNodeOneLine(node));
-    }
-    if (tree.count > MAX_TREE_NODES_DISPLAY) {
+    const { lines, truncated } = treeLines(tree);
+    lines.forEach((line) => fmt.text(line));
+    if (truncated) {
         fmt
             .blank()
-            .text(`... and ${tree.count - MAX_TREE_NODES_DISPLAY} more nodes`)
-            .text('Use --json flag for complete output');
+            .text(`Showing the first ${MAX_TREE_NODES_DISPLAY} nodes (text boxes and repeated text left out)`)
+            .text('Use --json flag for complete output, or bdg dom a11y query "role:<role>" to search');
     }
     return fmt.build();
 }
+/** Roles that only lay out their children and say nothing themselves */
+const LAYOUT_ROLES = new Set([
+    'generic',
+    'none',
+    'presentation',
+    'LayoutTable',
+    'LayoutTableRow',
+    'LayoutTableCell',
+]);
+/**
+ * The tree as indented lines, depth-first from the root. Text boxes, blank
+ * text, text that repeats its parent's name, and nameless layout wrappers are left out
+ * (their children move up a level), so the budget goes to meaningful nodes.
+ *
+ * @param tree - Accessibility tree
+ * @returns Up to {@link MAX_TREE_NODES_DISPLAY} lines, and whether nodes were left
+ */
+function treeLines(tree) {
+    const lines = [];
+    const visited = new Set();
+    let truncated = false;
+    const visit = (node, depth, parentName) => {
+        if (visited.has(node.nodeId))
+            return;
+        visited.add(node.nodeId);
+        if (lines.length >= MAX_TREE_NODES_DISPLAY) {
+            truncated = true;
+            return;
+        }
+        const skip = node.role === 'InlineTextBox' ||
+            (node.role === 'StaticText' && (node.name === parentName || !node.name?.trim())) ||
+            (LAYOUT_ROLES.has(node.role) && !node.name);
+        if (!skip)
+            lines.push('  '.repeat(depth) + formatA11yNodeOneLine(node));
+        for (const childId of node.childIds ?? []) {
+            const child = tree.nodes.get(childId);
+            if (child)
+                visit(child, skip ? depth : depth + 1, node.name ?? parentName);
+        }
+    };
+    visit(tree.root, 0, undefined);
+    return { lines, truncated };
+}
+/** Roles whose elements take a value (the next step is fill, not click) */
+const FILLABLE_ROLES = new Set([
+    'textbox',
+    'searchbox',
+    'combobox',
+    'spinbutton',
+    'slider',
+    'listbox',
+]);
 /**
  * Format query result for human-readable output.
  *
@@ -58,7 +109,18 @@ export function formatA11yQueryResult(result) {
         .separator('─', SEPARATOR_WIDTH)
         .blank();
     for (const node of result.nodes) {
-        fmt.text(formatA11yNodeOneLine(node)).blank();
+        const index = node.index !== undefined ? `[${node.index}] ` : '';
+        fmt.text(index + formatA11yNodeOneLine(node)).blank();
+    }
+    if (result.omitted)
+        fmt.text(a11yMoreMatchesNote(result.omitted)).blank();
+    const first = result.nodes[0];
+    if (first?.index !== undefined && !areHintsHidden()) {
+        const fillable = FILLABLE_ROLES.has(first.role.toLowerCase());
+        fmt.section('Next steps:', [
+            'Inspect:  bdg dom a11y describe 0',
+            fillable ? 'Fill:     bdg dom fill 0 "<value>"' : 'Click:    bdg dom click 0',
+        ]);
     }
     return fmt.build();
 }
@@ -151,6 +213,10 @@ function formatA11yNodeOneLine(node) {
     if (node.value !== undefined && node.value !== '') {
         states.push(`value: ${truncate(node.value, 30)}`);
     }
+    const checked = node.properties?.['checked'];
+    if (checked !== undefined) {
+        states.push(checked === 'mixed' ? 'partly checked' : checked ? 'checked' : 'unchecked');
+    }
     if (node.focused) {
         states.push('focused');
     }

package/dist/ui/formatters/console/chronological.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Chronological list view (--list mode): all messages with timestamps,
+ * level prefixes, and navigation reload markers.
+ */
+import type { ConsoleMessage } from '../../../types.js';
+import { type ConsoleFormatOptions } from './shared.js';
+/**
+ * Format console output as chronological list (--list mode).
+ *
+ * Shows all messages in order with timestamps and levels. Includes
+ * navigation markers when page reloads are detected.
+ */
+export declare function formatConsoleChronological(messages: ConsoleMessage[], options: ConsoleFormatOptions): string;
+/**
+ * The messages `--last` selects: the last N (all for 0 or none).
+ *
+ * @param messages - Messages after the page and level filters
+ * @param last - `--last` value
+ * @returns The messages to list
+ */
+export declare function lastMessages(messages: ConsoleMessage[], last: number | undefined): ConsoleMessage[];
+//# sourceMappingURL=chronological.d.ts.map

package/dist/ui/formatters/console/chronological.js

@@ -0,0 +1,71 @@
+/**
+ * Chronological list view (--list mode): all messages with timestamps,
+ * level prefixes, and navigation reload markers.
+ */
+import { OutputFormatter } from '../../formatting.js';
+import { consoleIndexGapNote } from '../../messages/consoleMessages.js';
+import { truncateByLength } from '../../../utils/strings.js';
+import { formatSourceLocation, formatTimestamp } from './shared.js';
+const MAX_LIST_TEXT_LENGTH = 200;
+/**
+ * Format console output as chronological list (--list mode).
+ *
+ * Shows all messages in order with timestamps and levels. Includes
+ * navigation markers when page reloads are detected.
+ */
+export function formatConsoleChronological(messages, options) {
+    const fmt = new OutputFormatter();
+    const displayMessages = lastMessages(messages, options.last);
+    const headerSuffix = options.history ? ' (all navigations)' : '';
+    const header = displayMessages.length === messages.length
+        ? `Console Messages (${messages.length} total)${headerSuffix}`
+        : `Console Messages (last ${displayMessages.length} of ${messages.length})${headerSuffix}`;
+    fmt.text(header);
+    fmt.separator('━', 50);
+    if (displayMessages.length === 0) {
+        fmt.text('No console messages');
+        return fmt.build();
+    }
+    const baseIndex = messages.length - displayMessages.length;
+    const indexOf = (msg, i) => msg.index ?? baseIndex + i;
+    const indexWidth = Math.max(...displayMessages.map((m, i) => `[${indexOf(m, i)}]`.length));
+    const levelWidth = Math.max(7, ...displayMessages.map((m) => m.type.length));
+    const sourceIndent = ' '.repeat(indexWidth + 2 + levelWidth + 1);
+    let lastNavigationId;
+    for (const [i, msg] of displayMessages.entries()) {
+        const index = `[${indexOf(msg, i)}]`.padEnd(indexWidth);
+        const time = formatTimestamp(msg.timestamp);
+        const level = msg.type.padEnd(levelWidth);
+        if (msg.navigationId !== undefined && msg.navigationId !== lastNavigationId) {
+            if (lastNavigationId !== undefined) {
+                fmt.blank();
+                fmt.text(`─── Next page (navigation #${msg.navigationId}) ───`);
+                fmt.blank();
+            }
+            lastNavigationId = msg.navigationId;
+        }
+        const truncatedText = truncateByLength(msg.text, MAX_LIST_TEXT_LENGTH);
+        fmt.text(`${index}  ${level} ${time}  ${truncatedText}`);
+        const source = formatSourceLocation(msg.stackTrace);
+        if (source) {
+            fmt.text(`${sourceIndent}→ ${source}`);
+        }
+    }
+    const { skipped } = options;
+    if (skipped && skipped.otherPages + skipped.otherLevels > 0) {
+        fmt.blank();
+        fmt.text(consoleIndexGapNote(skipped));
+    }
+    return fmt.build();
+}
+/**
+ * The messages `--last` selects: the last N (all for 0 or none).
+ *
+ * @param messages - Messages after the page and level filters
+ * @param last - `--last` value
+ * @returns The messages to list
+ */
+export function lastMessages(messages, last) {
+    return last && last > 0 ? messages.slice(-last) : messages;
+}
+//# sourceMappingURL=chronological.js.map

package/dist/ui/formatters/console/follow.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Follow-mode (live streaming) view. Compact format optimised for
+ * repeated polling output.
+ */
+import type { ConsoleMessage } from '../../../types.js';
+/**
+ * Lines of the console stream: the new messages since the last poll, with
+ * the stream header the first time and a separator after a navigation.
+ *
+ * @param messages - New messages
+ * @param options - `header` the first time; `navigationId` when the page changed
+ * @returns Text to print (empty when there is nothing new)
+ */
+export declare function formatConsoleFollowLines(messages: ConsoleMessage[], options?: {
+    header?: boolean;
+    navigationId?: number;
+}): string;
+//# sourceMappingURL=follow.d.ts.map

package/dist/ui/formatters/console/follow.js

@@ -0,0 +1,36 @@
+/**
+ * Follow-mode (live streaming) view. Compact format optimised for
+ * repeated polling output.
+ */
+import { OutputFormatter } from '../../formatting.js';
+import { formatSourceLocation, formatTimestamp } from './shared.js';
+/**
+ * Lines of the console stream: the new messages since the last poll, with
+ * the stream header the first time and a separator after a navigation.
+ *
+ * @param messages - New messages
+ * @param options - `header` the first time; `navigationId` when the page changed
+ * @returns Text to print (empty when there is nothing new)
+ */
+export function formatConsoleFollowLines(messages, options = {}) {
+    const fmt = new OutputFormatter();
+    if (options.header) {
+        fmt.text('Streaming console... (Ctrl+C to stop)');
+        fmt.separator('━', 40);
+        if (messages.length === 0)
+            fmt.text('Waiting for messages...');
+    }
+    if (options.navigationId !== undefined) {
+        fmt.text(`── Next page (navigation #${options.navigationId}) ──`);
+    }
+    for (const msg of messages) {
+        const time = formatTimestamp(msg.timestamp);
+        const level = msg.type.padEnd(7);
+        fmt.text(`${time} ${level} ${msg.text}`);
+        const source = formatSourceLocation(msg.stackTrace);
+        if (source)
+            fmt.text(`                → ${source}`);
+    }
+    return fmt.build();
+}
+//# sourceMappingURL=follow.js.map

package/dist/ui/formatters/console/json.d.ts

@@ -0,0 +1,21 @@
+/**
+ * JSON output for console command. Includes summary statistics and
+ * deduplicated errors/warnings; full message list is included only when
+ * --list is set.
+ */
+import type { ConsoleMessage } from '../../../types.js';
+import { type ConsoleFormatOptions, type ConsoleJsonOutput } from './shared.js';
+/**
+ * Build the rich JSON output shape (summary + deduped errors/warnings, plus
+ * the full message list when --list is requested).
+ *
+ * Returns a plain object so callers (e.g. runCommand's JSON envelope) can
+ * embed it without re-parsing a stringified payload.
+ */
+export declare function buildConsoleJsonOutput(messages: ConsoleMessage[], options: ConsoleFormatOptions): ConsoleJsonOutput;
+/**
+ * Format console output as a JSON string. Thin wrapper around
+ * buildConsoleJsonOutput for callers that want a serialized payload.
+ */
+export declare function formatConsoleJson(messages: ConsoleMessage[], options: ConsoleFormatOptions): string;
+//# sourceMappingURL=json.d.ts.map

package/dist/ui/formatters/console/json.js

@@ -0,0 +1,52 @@
+/**
+ * JSON output for console command. Includes summary statistics and
+ * deduplicated errors/warnings; full message list is included only when
+ * --list is set.
+ */
+import { lastMessages } from './chronological.js';
+import { analyzeMessages, } from './shared.js';
+function toJsonError(dedup, includeStackTrace) {
+    const source = dedup.message.stackTrace?.[0];
+    return {
+        count: dedup.count,
+        level: dedup.message.type,
+        text: dedup.message.text,
+        ...(dedup.message.index !== undefined && { index: dedup.message.index }),
+        ...(source && {
+            source: {
+                url: source.url,
+                ...(source.lineNumber >= 0 && {
+                    line: source.lineNumber + 1,
+                    column: source.columnNumber + 1,
+                }),
+            },
+        }),
+        ...(includeStackTrace && dedup.message.stackTrace && { stackTrace: dedup.message.stackTrace }),
+    };
+}
+/**
+ * Build the rich JSON output shape (summary + deduped errors/warnings, plus
+ * the full message list when --list is requested).
+ *
+ * Returns a plain object so callers (e.g. runCommand's JSON envelope) can
+ * embed it without re-parsing a stringified payload.
+ */
+export function buildConsoleJsonOutput(messages, options) {
+    const { grouped, summary } = analyzeMessages(messages);
+    const output = {
+        summary,
+        errors: grouped.errors.map((d) => toJsonError(d, true)),
+        warnings: grouped.warnings.map((d) => toJsonError(d, false)),
+    };
+    if (options.list)
+        output.messages = lastMessages(messages, options.last);
+    return output;
+}
+/**
+ * Format console output as a JSON string. Thin wrapper around
+ * buildConsoleJsonOutput for callers that want a serialized payload.
+ */
+export function formatConsoleJson(messages, options) {
+    return JSON.stringify(buildConsoleJsonOutput(messages, options), null, 2);
+}
+//# sourceMappingURL=json.js.map

package/dist/ui/formatters/console/shared.d.ts

@@ -0,0 +1,148 @@
+/**
+ * Shared types, constants, and helpers used by every console formatter.
+ */
+import type { ConsoleLevel, ConsoleMessage, StackFrame } from '../../../types.js';
+export type { ConsoleLevel } from '../../../types.js';
+/**
+ * Internal console level including 'other' for classification.
+ */
+export type ConsoleInternalLevel = ConsoleLevel | 'other';
+/**
+ * Deduplicated console message with occurrence count.
+ */
+export interface DeduplicatedMessage {
+    /** First occurrence of the message */
+    message: ConsoleMessage;
+    /** Number of times this message appeared */
+    count: number;
+}
+/**
+ * Summary statistics for console messages.
+ */
+export interface ConsoleSummary {
+    /** Total number of messages */
+    total: number;
+    /** Error statistics */
+    errors: {
+        total: number;
+        unique: number;
+    };
+    /** Warning statistics */
+    warnings: {
+        total: number;
+        unique: number;
+    };
+    /** Info message count */
+    info: number;
+    /** Debug message count */
+    debug: number;
+    /** Other message type count */
+    other: number;
+}
+/**
+ * Options for console formatting.
+ */
+export interface ConsoleFormatOptions {
+    /** Output as JSON */
+    json?: boolean | undefined;
+    /** List all messages chronologically (--list flag) */
+    list?: boolean | undefined;
+    /** Follow mode (live streaming) */
+    follow?: boolean | undefined;
+    /** Limit to last N messages */
+    last?: number | undefined;
+    /** Show messages from all navigations (default: current only) */
+    history?: boolean | undefined;
+    /** Filter by level (error, warning, info, debug) */
+    level?: ConsoleLevel | undefined;
+    /** Messages between the first and last listed index that the filters left out */
+    skipped?: ConsoleSkipped | undefined;
+}
+/**
+ * Messages the page and level filters left out between the first and last
+ * listed index (session indices then skip numbers).
+ */
+export interface ConsoleSkipped {
+    /** Logged by another page load (`--history` lists them) */
+    otherPages: number;
+    /** Of another level (`--level`) */
+    otherLevels: number;
+}
+/**
+ * JSON error/warning entry structure.
+ */
+export interface JsonErrorEntry {
+    count: number;
+    level: string;
+    text: string;
+    /** Position in the session's message list (what `details console <n>` takes) */
+    index?: number;
+    /** Where it came from; no line/column for a resource URL (e.g. a failed load) */
+    source?: {
+        url: string;
+        line?: number;
+        column?: number;
+    };
+    stackTrace?: StackFrame[];
+}
+/**
+ * JSON output structure for console command.
+ */
+export interface ConsoleJsonOutput {
+    summary: ConsoleSummary;
+    errors: JsonErrorEntry[];
+    warnings: Omit<JsonErrorEntry, 'stackTrace'>[];
+    messages?: ConsoleMessage[];
+}
+/**
+ * Messages grouped by level with deduplication applied.
+ */
+export interface GroupedMessages {
+    errors: DeduplicatedMessage[];
+    warnings: DeduplicatedMessage[];
+    counts: Record<ConsoleInternalLevel, number>;
+}
+/**
+ * Result from message analysis.
+ */
+export interface AnalysisResult {
+    grouped: GroupedMessages;
+    summary: ConsoleSummary;
+}
+/**
+ * Mapping from console message types to level categories.
+ * Exported for use by console command filtering.
+ */
+export declare const LEVEL_MAP: Record<ConsoleMessage['type'], ConsoleInternalLevel>;
+/**
+ * Format timestamp with milliseconds precision.
+ */
+export declare function formatTimestamp(timestamp: number): string;
+/**
+ * Analyze console messages: group, deduplicate, and summarize.
+ */
+export declare function analyzeMessages(messages: ConsoleMessage[]): AnalysisResult;
+/**
+ * Format source location as "file:line:col".
+ *
+ * A frame without a position (lineNumber -1, e.g. the URL of a failed load)
+ * is shown as its full URL.
+ */
+export declare function formatSourceLocation(stackTrace?: StackFrame[]): string | undefined;
+/**
+ * Format count prefix for deduplicated messages.
+ */
+export declare function formatCountPrefix(count: number): string;
+/**
+ * Format section header with unique/total counts.
+ */
+export declare function formatSectionHeader(label: string, unique: number, total: number): string;
+/**
+ * A stack frame as "url:line:column" (1-based), or just the URL for a frame
+ * without a position (lineNumber -1, e.g. a failed resource load).
+ *
+ * @param frame - Stack frame
+ * @returns Location text
+ */
+export declare function formatFramePosition(frame: StackFrame): string;
+//# sourceMappingURL=shared.d.ts.map

package/dist/ui/formatters/console/shared.js

@@ -0,0 +1,158 @@
+/**
+ * Shared types, constants, and helpers used by every console formatter.
+ */
+/**
+ * Mapping from console message types to level categories.
+ * Exported for use by console command filtering.
+ */
+export const LEVEL_MAP = {
+    error: 'error',
+    warning: 'warning',
+    info: 'info',
+    log: 'info',
+    debug: 'debug',
+    trace: 'debug',
+    dir: 'other',
+    dirxml: 'other',
+    table: 'other',
+    clear: 'other',
+    startGroup: 'other',
+    startGroupCollapsed: 'other',
+    endGroup: 'other',
+    assert: 'error',
+    profile: 'other',
+    profileEnd: 'other',
+    count: 'other',
+    timeEnd: 'other',
+};
+function classifyLevel(type) {
+    return LEVEL_MAP[type];
+}
+/**
+ * Format timestamp with milliseconds precision.
+ */
+export function formatTimestamp(timestamp) {
+    const date = new Date(timestamp);
+    const hours = date.getHours().toString().padStart(2, '0');
+    const minutes = date.getMinutes().toString().padStart(2, '0');
+    const seconds = date.getSeconds().toString().padStart(2, '0');
+    const ms = date.getMilliseconds().toString().padStart(3, '0');
+    return `${hours}:${minutes}:${seconds}.${ms}`;
+}
+function getDeduplicationKey(message) {
+    const source = message.stackTrace?.[0];
+    if (source) {
+        return `${message.text}|${source.url}|${source.lineNumber}|${source.columnNumber}`;
+    }
+    return message.text;
+}
+function deduplicate(messages) {
+    const groups = new Map();
+    for (const message of messages) {
+        const key = getDeduplicationKey(message);
+        const existing = groups.get(key);
+        if (existing) {
+            existing.count++;
+        }
+        else {
+            groups.set(key, { message, count: 1 });
+        }
+    }
+    return Array.from(groups.values());
+}
+function groupByLevel(messages) {
+    const byLevel = {
+        error: [],
+        warning: [],
+        info: [],
+        debug: [],
+        other: [],
+    };
+    for (const msg of messages) {
+        byLevel[classifyLevel(msg.type)].push(msg);
+    }
+    return {
+        errors: deduplicate(byLevel.error),
+        warnings: deduplicate(byLevel.warning),
+        counts: {
+            error: byLevel.error.length,
+            warning: byLevel.warning.length,
+            info: byLevel.info.length,
+            debug: byLevel.debug.length,
+            other: byLevel.other.length,
+        },
+    };
+}
+function buildSummary(total, grouped) {
+    const sumCounts = (items) => items.reduce((sum, d) => sum + d.count, 0);
+    return {
+        total,
+        errors: { total: sumCounts(grouped.errors), unique: grouped.errors.length },
+        warnings: { total: sumCounts(grouped.warnings), unique: grouped.warnings.length },
+        info: grouped.counts.info,
+        debug: grouped.counts.debug,
+        other: grouped.counts.other,
+    };
+}
+/**
+ * Analyze console messages: group, deduplicate, and summarize.
+ */
+export function analyzeMessages(messages) {
+    const grouped = groupByLevel(messages);
+    const summary = buildSummary(messages.length, grouped);
+    return { grouped, summary };
+}
+function getFilenameFromUrl(url, functionName) {
+    if (!url || url === '') {
+        return functionName ? `<${functionName}>` : '<inline>';
+    }
+    if (url.startsWith('eval')) {
+        return '<eval>';
+    }
+    if (url.includes('/')) {
+        return url.split('/').pop() ?? url;
+    }
+    return url;
+}
+/**
+ * Format source location as "file:line:col".
+ *
+ * A frame without a position (lineNumber -1, e.g. the URL of a failed load)
+ * is shown as its full URL.
+ */
+export function formatSourceLocation(stackTrace) {
+    const frame = stackTrace?.[0];
+    if (!frame)
+        return undefined;
+    if (frame.lineNumber < 0)
+        return frame.url;
+    const filename = getFilenameFromUrl(frame.url, frame.functionName);
+    const line = frame.lineNumber + 1;
+    const col = frame.columnNumber + 1;
+    return `${filename}:${line}:${col}`;
+}
+/**
+ * Format count prefix for deduplicated messages.
+ */
+export function formatCountPrefix(count) {
+    return count > 1 ? `[${count}x] ` : '';
+}
+/**
+ * Format section header with unique/total counts.
+ */
+export function formatSectionHeader(label, unique, total) {
+    return unique === total ? `${label} (${total})` : `${label} (${unique} unique, ${total} total)`;
+}
+/**
+ * A stack frame as "url:line:column" (1-based), or just the URL for a frame
+ * without a position (lineNumber -1, e.g. a failed resource load).
+ *
+ * @param frame - Stack frame
+ * @returns Location text
+ */
+export function formatFramePosition(frame) {
+    return frame.lineNumber < 0
+        ? frame.url
+        : `${frame.url}:${frame.lineNumber + 1}:${frame.columnNumber + 1}`;
+}
+//# sourceMappingURL=shared.js.map

package/dist/ui/formatters/console/summarize.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Smart summary view: prioritises errors and warnings with deduplication
+ * and shows info/debug/other as count-only footer entries.
+ */
+import type { ConsoleMessage } from '../../../types.js';
+/**
+ * Format console output as smart summary (default mode).
+ */
+export declare function formatConsoleSummary(messages: ConsoleMessage[]): string;
+//# sourceMappingURL=summarize.d.ts.map