feat: add snapshot size limits and optional snapshots to fix token overflow

Implements comprehensive solution for browser_click and other interactive tools
returning massive responses (37K+ tokens) due to full page snapshots.

Features implemented:
1. **Snapshot size limits** (--max-snapshot-tokens, default 10k)
   - Automatically truncates large snapshots with helpful messages
   - Preserves essential info (URL, title, errors) when truncating
   - Shows exact token counts and configuration suggestions

2. **Optional snapshots** (--no-snapshots)
   - Disables automatic snapshots after interactive operations
   - browser_snapshot tool always works for explicit snapshots
   - Maintains backward compatibility (snapshots enabled by default)

3. **Differential snapshots** (--differential-snapshots)
   - Shows only changes since last snapshot instead of full page
   - Tracks URL, title, DOM structure, and console activity
   - Significantly reduces token usage for incremental operations

4. **Enhanced tool descriptions**
   - All interactive tools now document snapshot behavior
   - Clear guidance on when snapshots are included/excluded
   - Helpful suggestions for users experiencing token limits

Configuration options:
- CLI: --no-snapshots, --max-snapshot-tokens N, --differential-snapshots
- ENV: PLAYWRIGHT_MCP_INCLUDE_SNAPSHOTS, PLAYWRIGHT_MCP_MAX_SNAPSHOT_TOKENS, etc.
- Config file: includeSnapshots, maxSnapshotTokens, differentialSnapshots

Fixes token overflow errors while providing users full control over
snapshot behavior and response sizes.

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Ryan Malloy 2025-08-22 07:54:36 -06:00
parent 7d97fc3e3b
commit 574fdc4959
10 changed files with 301 additions and 67 deletions

View file

@ -27,7 +27,7 @@ const pressKey = defineTabTool({
schema: {
name: 'browser_press_key',
title: 'Press a key',
description: 'Press a key on the keyboard',
description: 'Press a key on the keyboard. Returns page snapshot after keypress unless disabled with --no-snapshots.',
inputSchema: z.object({
key: z.string().describe('Name of the key to press or a character to generate, such as `ArrowLeft` or `a`'),
}),
@ -56,7 +56,7 @@ const type = defineTabTool({
schema: {
name: 'browser_type',
title: 'Type text',
description: 'Type text into editable element',
description: 'Type text into editable element. Returns page snapshot after typing unless disabled with --no-snapshots.',
inputSchema: typeSchema,
type: 'destructive',
},