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

@ -38,6 +38,9 @@ export type CLIOptions = {
ignoreHttpsErrors?: boolean;
isolated?: boolean;
imageResponses?: 'allow' | 'omit';
includeSnapshots?: boolean;
maxSnapshotTokens?: number;
differentialSnapshots?: boolean;
sandbox?: boolean;
outputDir?: string;
port?: number;
@ -70,6 +73,9 @@ const defaultConfig: FullConfig = {
},
server: {},
outputDir: path.join(os.tmpdir(), 'playwright-mcp-output', sanitizeForFilePath(new Date().toISOString())),
includeSnapshots: true,
maxSnapshotTokens: 10000,
differentialSnapshots: false,
};
type BrowserUserConfig = NonNullable<Config['browser']>;
@ -84,6 +90,9 @@ export type FullConfig = Config & {
outputDir: string;
artifactDir?: string;
server: NonNullable<Config['server']>,
includeSnapshots: boolean;
maxSnapshotTokens: number;
differentialSnapshots: boolean;
};
export async function resolveConfig(config: Config): Promise<FullConfig> {
@ -200,6 +209,9 @@ export function configFromCLIOptions(cliOptions: CLIOptions): Config {
outputDir: cliOptions.outputDir,
artifactDir: cliOptions.artifactDir,
imageResponses: cliOptions.imageResponses,
includeSnapshots: cliOptions.includeSnapshots,
maxSnapshotTokens: cliOptions.maxSnapshotTokens,
differentialSnapshots: cliOptions.differentialSnapshots,
};
return result;
@ -223,6 +235,9 @@ function configFromEnv(): Config {
options.isolated = envToBoolean(process.env.PLAYWRIGHT_MCP_ISOLATED);
if (process.env.PLAYWRIGHT_MCP_IMAGE_RESPONSES === 'omit')
options.imageResponses = 'omit';
options.includeSnapshots = envToBoolean(process.env.PLAYWRIGHT_MCP_INCLUDE_SNAPSHOTS);
options.maxSnapshotTokens = envToNumber(process.env.PLAYWRIGHT_MCP_MAX_SNAPSHOT_TOKENS);
options.differentialSnapshots = envToBoolean(process.env.PLAYWRIGHT_MCP_DIFFERENTIAL_SNAPSHOTS);
options.sandbox = envToBoolean(process.env.PLAYWRIGHT_MCP_SANDBOX);
options.outputDir = envToString(process.env.PLAYWRIGHT_MCP_OUTPUT_DIR);
options.port = envToNumber(process.env.PLAYWRIGHT_MCP_PORT);