How to Use the Percy MCP in Mastra AI

Q: Does the agent know which browsers are failing?

Yes, the agent calls listcomparisons to view individual browser diffs. It can see if Chrome passed but Safari failed, allowing for highly specific debugging logs.

Automate visual regression workflows in Mastra AI using the Percy MCP Server with built-in retries and conditional branching.

See Vinkius in Action

Works with every AI agent you already use

…and any MCP-compatible client

MCP Servers — Included with Plan

Connect Percy MCP to Mastra AI

Create your Vinkius account to connect Percy to Mastra AI — we handle the hosting, security, and runtime updates so you don't have to. No server setup required.

GDPR Included with Plan

Setup Percy with Mastra AI

Ask AI about this MCP

ChatGPT

Claude

Perplexity Vinkius runs on Gemini

Gemini

Grok

Conditional visual regression pipelines in Mastra AI

The `list_builds` tool retrieves the history of visual test runs for a project to feed your Mastra AI workflow via this MCP Server. Your agent can branch its logic based on build states, pausing the pipeline if a run has failed or is still processing. If a build is blocked, the workflow triggers retries automatically or alerts your engineering team. This prevents broken layouts from slipping into production while keeping your deployment pipeline moving.

Automated snapshot analysis and approval

The `list_snapshots` tool lists all captured UI components in a build so your agent can inspect their visual status. If the diff percentage is below your threshold, the workflow executes `approve_snapshot` to mark it safe. For wider updates, the agent uses `get_snapshot_details` to verify specific widths and browser targets. You get automated, precise visual QA that only escalates to humans when a major layout shift occurs.

Project configuration checks via MCP Server

The `get_project_details` tool reads your target browser configurations and default branches directly from Percy. Your Mastra AI agent uses this metadata to verify that your testing environment matches your production branch settings before running new tests. By calling `list_projects`, the workflow can dynamically select the correct repository slug for multi-tenant setups. This ensures your visual regression agents always target the correct dashboard on BrowserStack.

Setup guide

Set up Percy MCP in Mastra AI

Prerequisites

Node.js 18+ and a TypeScript project
@mastra/mcp + @mastra/core packages
Active Vinkius subscription with a valid endpoint token

1

Install dependencies
Run npm install @mastra/mcp @mastra/core plus your preferred model provider (e.g. @ai-sdk/openai).
2

Configure the MCPClient
Create an MCPClient with your Vinkius endpoint as a URL object. Replace [YOUR_TOKEN_HERE] with your token from cloud.vinkius.com.
3

Discover and inject tools
Call mcpClient.listTools() and spread the result into your agent's tools object. All Percy tools become native Mastra tools.
4

Run with any model
Swap openai("gpt-4o") for any AI SDK-compatible provider. Call agent.generate() and the agent routes tool calls through MCP automatically.

agent.ts

import { MCPClient } from "@mastra/mcp";
import { Agent } from "@mastra/core/agent";
import { openai } from "@ai-sdk/openai";

const mcpClient = new MCPClient({
  id: "percy-mcp-client",
  servers: {
    "percy-mcp": {
      url: new URL(
        "https://edge.vinkius.com/[YOUR_TOKEN_HERE]/mcp"
      ),
    },
  },
});

const agent = new Agent({
  name: "Percy Agent",
  model: openai("gpt-4o"),
  instructions: "You have access to Percy tools.",
  tools: {
    ...(await mcpClient.listTools()),
  },
});

const result = await agent.generate(
  "List recent Percy transactions"
);
console.log(result.text);

Get your connection token →

Independent Platform Disclaimer: Vinkius is an independent platform and is not affiliated with, endorsed by, sponsored by, verified by, or otherwise authorized by Percy. All third-party trademarks, logos, and brand names are the property of their respective owners. Their use on this website is strictly for informational purposes to identify service compatibility and interoperability.

Why Choose Vinkius

Vinkius connects your tools to AI with real-time monitoring and automatic cost savings — all from one dashboard.

Connect Percy now

Real-time monitoring

Live

visibility into every interaction

Connect your favorite tools to your AI and see exactly what's happening — every request, every response, in real time.

Built-in savings

60%

lower AI costs

Vinkius compresses data between your apps and your AI automatically. Lower bills every month — no configuration required.

Single dashboard

One

place for every integration

Every tool your AI connects to, managed from a single screen. One account, complete control.

Common questions about Percy MCP in Mastra AI

Install @mastra/mcp and instantiate the client with your Vinkius endpoint URL. Spread the tools directly into your agent's toolset to let it run visual validation steps.

Yes, Mastra AI features automatic retries with exponential backoff. If list_builds hits an API limit, the framework backs off and retries the call without breaking your workflow.

Set the requireToolApproval option on the agent for the approve_build tool. This pauses the workflow and prompts a human developer to confirm the visual changes before they are finalized.

Yes, the agent calls list_comparisons to view individual browser diffs. It can see if Chrome passed but Safari failed, allowing for highly specific debugging logs.

Your visual snapshot diffs, build states, and API tokens are processed in an ephemeral, zero-trust environment. The Vinkius V8 Isolate Sandbox ensures that no persistent storage of your visual data occurs, keeping your proprietary UI code and designs fully private.

Use it with your favorite AI tools

Connect this server to Cursor, Claude, VS Code, and more.

OpenAI Agents SDK sdk-python

Google ADK sdk-python

Pydantic AI sdk-python

Vercel AI SDK sdk-typescript