emulate_device

Instructions

Implementation Reference

• src/tools/emulation.ts:50-73 (handler)

  Handler function for the 'emulate_device' tool. It looks up the device preset from DEVICE_PRESETS, sends the 'emulate_device' command via WebSocket bridge with preset dimensions, DPR, mobile/touch flags, and user agent, then returns success/error response.

    async ({ device, tabId, apiKey }) => {
      const preset = DEVICE_PRESETS[device];
      if (!preset) {
        return { content: [{ type: 'text', text: `Unknown device: ${device}` }], isError: true };
      }
      const result = await bridge.sendCommand({
        command: 'emulate_device',
        params: {
          width: preset.width,
          height: preset.height,
          deviceScaleFactor: preset.dpr,
          mobile: preset.mobile,
          touch: preset.touch,
          userAgent: preset.ua,
        },
        tabId,
        apiKey,
      });
      if (!result.success) {
        return { content: [{ type: 'text', text: `Error: ${result.error?.message}` }], isError: true };
      }
      return { content: [{ type: 'text', text: `Emulating ${device}: ${preset.width}x${preset.height}` }] };
    }
  );

• src/tools/emulation.ts:45-49 (schema)

  Input schema for 'emulate_device' tool: requires 'device' (enum of presets: iphone-14, pixel-7, ipad-pro, desktop-1080, desktop-1440), optional 'tabId' and 'apiKey'.

  {
    device: z.enum(['iphone-14', 'pixel-7', 'ipad-pro', 'desktop-1080', 'desktop-1440'] as [string, ...string[]]).describe('Device preset name'),
    tabId: z.number().optional().describe('Target tab ID (defaults to currently active tab)'),
    apiKey: z.string().optional().describe('API key for authentication if enabled'),
  },

• src/tools/emulation.ts:6-12 (schema)

  DEVICE_PRESETS constant defining dimensions (width, height), DPR, mobile/touch flags, and user agent strings for each device preset used by emulate_device.

  const DEVICE_PRESETS: Record<string, { width: number; height: number; dpr: number; mobile: boolean; touch: boolean; ua: string }> = {
    'iphone-14': { width: 390, height: 844, dpr: 3, mobile: true, touch: true, ua: 'Mozilla/5.0 (iPhone; CPU iPhone OS 16_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.0 Mobile/15E148 Safari/604.1' },
    'pixel-7': { width: 412, height: 915, dpr: 2.625, mobile: true, touch: true, ua: 'Mozilla/5.0 (Linux; Android 13; Pixel 7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/116.0.0.0 Mobile Safari/537.36' },
    'ipad-pro': { width: 1024, height: 1366, dpr: 2, mobile: true, touch: true, ua: 'Mozilla/5.0 (iPad; CPU OS 16_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.0 Safari/604.1' },
    'desktop-1080': { width: 1920, height: 1080, dpr: 1, mobile: false, touch: false, ua: '' },
    'desktop-1440': { width: 2560, height: 1440, dpr: 1, mobile: false, touch: false, ua: '' },
  };

• src/tools/emulation.ts:42-73 (registration)

  Registration of 'emulate_device' tool via server.tool() inside registerEmulationTools(). Includes description, schema, and handler.

  server.tool(
    'emulate_device',
    'Emulate a specific device preset (iPhone 14, Pixel 7, iPad Pro, desktop). Automatically sets viewport, DPR, user agent, and touch emulation.',
    {
      device: z.enum(['iphone-14', 'pixel-7', 'ipad-pro', 'desktop-1080', 'desktop-1440'] as [string, ...string[]]).describe('Device preset name'),
      tabId: z.number().optional().describe('Target tab ID (defaults to currently active tab)'),
      apiKey: z.string().optional().describe('API key for authentication if enabled'),
    },
    async ({ device, tabId, apiKey }) => {
      const preset = DEVICE_PRESETS[device];
      if (!preset) {
        return { content: [{ type: 'text', text: `Unknown device: ${device}` }], isError: true };
      }
      const result = await bridge.sendCommand({
        command: 'emulate_device',
        params: {
          width: preset.width,
          height: preset.height,
          deviceScaleFactor: preset.dpr,
          mobile: preset.mobile,
          touch: preset.touch,
          userAgent: preset.ua,
        },
        tabId,
        apiKey,
      });
      if (!result.success) {
        return { content: [{ type: 'text', text: `Error: ${result.error?.message}` }], isError: true };
      }
      return { content: [{ type: 'text', text: `Emulating ${device}: ${preset.width}x${preset.height}` }] };
    }
  );

• src/tools/index.ts:19-19 (registration)

  Import of registerEmulationTools from emulation.ts module.

  import { registerEmulationTools } from './emulation.js';

• src/tools/index.ts:46-46 (registration)

  Call to registerEmulationTools(server, bridge) to wire up the tool during server initialization.

  registerEmulationTools(server, bridge);