read_page_resources
List all web page resources (images, fonts, scripts, stylesheets) with their URLs and sizes. Filter by resource type to analyze page load performance.
Instructions
List all resources loaded on the page (images, fonts, scripts, stylesheets) with their URLs and sizes
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| type | No | Filter by resource type (default: all) | |
| tabId | No | Target tab ID (defaults to active tab) | |
| apiKey | No | API key for authentication |
Implementation Reference
- src/tools/devtools-sources.ts:6-6 (registration)The function registerDevtoolsSourcesTools registers the 'read_page_resources' tool (among others) on the MCP server.
export function registerDevtoolsSourcesTools(server: McpServer, bridge: WebSocketBridge) { - src/tools/devtools-sources.ts:75-79 (schema)Input schema for 'read_page_resources': optional 'type' (enum: image, font, stylesheet, script, all), optional 'tabId', optional 'apiKey'.
{ type: z.enum(['image', 'font', 'stylesheet', 'script', 'all']).optional().describe('Filter by resource type (default: all)'), tabId: z.number().optional().describe('Target tab ID (defaults to active tab)'), apiKey: z.string().optional().describe('API key for authentication'), }, - src/tools/devtools-sources.ts:80-92 (handler)Handler function for 'read_page_resources'. Sends the command via WebSocket bridge with params {type} and returns the result as JSON.
async ({ type, tabId, apiKey }) => { const result = await bridge.sendCommand({ command: 'read_page_resources', params: { type }, tabId, apiKey, }); if (!result.success) { return { content: [{ type: 'text', text: `Error: ${result.error?.message}` }], isError: true }; } return { content: [{ type: 'text', text: JSON.stringify(result.data, null, 2) }] }; } ); - src/websocket-bridge.ts:63-103 (helper)WebSocketBridge.sendCommand() sends the command to the connected Chrome extension client and returns a promise with the response.
async sendCommand(cmd: BridgeCommand): Promise<BridgeResponse> { if (!this.isConnected()) { return { success: false, error: { code: 'NOT_CONNECTED', message: 'Chrome extension is not connected. Ensure the extension is installed, enabled, and the browser is running.', }, }; } const id = crypto.randomUUID(); const timeout = cmd.timeout ?? DEFAULT_TIMEOUT; return new Promise<BridgeResponse>((resolve, reject) => { const timer = setTimeout(() => { this.pending.delete(id); resolve({ success: false, error: { code: 'TIMEOUT', message: `Command '${cmd.command}' timed out after ${timeout}ms`, }, }); }, timeout); this.pending.set(id, { resolve, reject, timer }); const message = { id, type: 'request', command: cmd.command, params: cmd.params, tabId: cmd.tabId, apiKey: cmd.apiKey, timestamp: Date.now(), }; this.client!.send(JSON.stringify(message)); }); } - src/types.ts:1-7 (helper)BridgeCommand interface definition used by sendCommand to type the command payload.
export interface BridgeCommand { command: string; params: Record<string, unknown>; tabId?: number; apiKey?: string; timeout?: number; }