Video Recording

Record browser sessions as WebM videos with chapter cards and action callouts. Requires the devtools capability.

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": ["@playwright/mcp@latest", "--caps=devtools"]
    }
  }
}

browser_start_video

Parameter	Type	Required	Description
filename	string	no	File to save the video to. Relative names resolve against the workspace root. Defaults to video-{timestamp}.webm in the output directory
size	object	no	Video size as { width, height }

→ browser_start_video { filename: "cart-bug-repro.webm" }
  Video recording started.

→ browser_start_video { size: { width: 800, height: 600 } }

browser_stop_video

Stop recording and return the recorded files. Takes no parameters.

→ browser_stop_video
  - [Video](cart-bug-repro.webm)

browser_video_chapter

Add a chapter marker to the recording. Shows a full-screen chapter card with a blurred backdrop.

Parameter	Type	Required	Description
title	string	yes	Chapter title
description	string	no	Chapter description
duration	number	no	Duration in milliseconds to show the chapter card

browser_video_show_actions / browser_video_hide_actions

Annotate subsequent actions with an on-page callout that names the action and highlights the target element. Useful while recording video or screencasting.

Parameter	Type	Required	Description
duration	number	no	How long each annotation stays on screen, in ms. Defaults to 500
position	string	no	Where to place the action title: top-left, top, top-right (default), bottom-left, bottom, bottom-right
cursor	string	no	pointer (default) animates a mouse pointer between action points; none disables the cursor decoration

browser_video_hide_actions takes no parameters and stops the annotations.

→ browser_video_show_actions { position: "bottom", duration: 800 }
→ browser_click { target: "e8" }
→ browser_video_hide_actions

Workflow: recording a bug reproduction

→ browser_start_video { filename: "cart-bug-repro.webm" }
→ browser_video_show_actions

→ browser_video_chapter { title: "Setup: add items to cart" }
→ browser_navigate { url: "https://store.example.com" }
→ browser_click { target: "e8" }
→ browser_click { target: "e12" }
→ browser_click { target: "e20" }

→ browser_video_chapter {
    title: "Verify items in cart",
    description: "Both items should be visible"
  }
→ browser_snapshot
  - list "Cart items" [ref=e30]:
    - listitem [ref=e31]: Headphones - $49.99
    - listitem [ref=e32]: Cable - $9.99

→ browser_video_chapter {
    title: "Bug: refresh clears cart",
    description: "Cart should persist but items disappear"
  }
→ browser_navigate { url: "https://store.example.com/cart" }

  - heading "Your cart is empty" [level=1] [ref=e2]

→ browser_take_screenshot
→ browser_stop_video
  - [Video](cart-bug-repro.webm)

Use cases

Scenario	Approach
Bug reproduction	Record steps, attach to issue
Test documentation	Record with chapter cards
Agent monitoring	Record agent sessions for review
Demo creation	Record with action callouts enabled