Skip to main content

Connect Chrome DevTools to VS Code

Give VS Code governed access to Chrome DevTools’s 26 tools through Runlayer, with identity, policy, scanning, and audit on every call.

Set up

Add Chrome DevTools to VS Code in four steps

Admins approve the server once. Everyone in VS Code then gets it through the same governed connection.

  1. 1

    Approve Chrome DevTools in Runlayer

    Add Chrome DevTools from the catalog and choose who can use it and which of its tools are allowed.

  2. 2

    Connect VS Code to Runlayer

    Install the Runlayer CLI so VS Code can reach Chrome DevTools, which runs on the user’s machine. Auto Sync can then write Chrome DevTools into VS Code on macOS, Windows, and Linux.

    VS Code setup guide
  3. 3

    Sign in to Chrome DevTools

    Sign in the way Chrome DevTools requires. Runlayer holds the credentials so they stay out of the client’s configuration.

  4. 4

    Use Chrome DevTools from VS Code

    Chrome DevTools’s approved tools appear in VS Code. Every call is checked against policy and recorded.

Tools

26 Chrome DevTools tools in VS Code

Runlayer policy decides which of these VS Code users can call. 10 read data only.

  • Click

    Clicks on the provided element

  • Close page

    Closes the page by its index.

  • Drag

    Drag an element onto another element

  • Emulate

    Emulates various features on the selected page.

  • Evaluate script

    Evaluate a JavaScript function inside the currently selected page.

  • Fill

    Type text into a input, text area or select an option from a element.

  • Fill form

    Fill out multiple form elements at once

  • Get console message

    Gets a console message by its ID.

See all 26 Chrome DevTools tools

Control

What Runlayer can see and stop in VS Code

Some controls apply to every client at the gateway. Others depend on what VS Code exposes to Runlayer.

  • Gateway policy (available)

    Every Chrome DevTools call from VS Code passes through Runlayer, where your policies can allow, alert, mask, or block it.

  • Audit trail (available)

    Each call is recorded with the user, VS Code as the client, the tool, and the policy and scanner decisions.

  • Client hooks (available)

    Capture supported prompts, reasoning, local and MCP tool calls, responses, and scanner decisions in real time.

  • Stop a call before it runs (available)

    Runlayer can deny a tool call before VS Code runs it.

  • Block output after it runs (available)

    Runlayer can block a tool’s output before VS Code’s model sees it.

  • Redact output in place (available)

    Runlayer can mask sensitive parts of a tool’s output in VS Code and pass the rest through.

Frequently asked questions

Connect more

Find another combination