Skip to content
Get packs

Guide · Agent skill

How to use the BrowserStack Cross-Browser Testing agent skill

Updated · written with AI from the project's own documentation and checked against our catalogue data

The browserstack skill is an agent skill that teaches an AI coding agent to run your Playwright end-to-end tests on BrowserStack's cloud, which hosts many browser and operating system combinations you may not have on your own machine. This guide explains what the skill does, how to install it, how to trigger it with plain requests, and what you need before it will work. By the end you will be able to point the agent at a Playwright project and get pass/fail results per browser.

BrowserStack Cross-Browser Testingalirezarezvani/claude-skills · MIT

Quick start

  1. 1Download and unzip the skill. Download the ZIP from this page and unzip it into ~/.claude/skills/ for personal use or into .claude/skills/ inside a project.
  2. 2Set your BrowserStack credentials. Export BROWSERSTACK_USERNAME and BROWSERSTACK_ACCESS_KEY from your BrowserStack account settings.
  3. 3Install and register the MCP server. Run npm install in integrations/browserstack-mcp and register the server in your MCP configuration, since it is not enabled by default.
  4. 4Ask the agent to set up the config. Request BrowserStack setup for your Playwright project so the agent adds the browser projects to playwright.config.ts.
  5. 5Run the cloud tests. Ask the agent to run the tests on BrowserStack or use the test:e2e:cloud npm script.
  6. 6Review the results. Ask for the latest build results to see pass or fail per browser, with video and log links.

What is an agent skill and what does this one do?

An agent skill is a folder containing a SKILL.md file that gives an AI agent specific instructions for a task. When a request matches the skill's description, the agent follows those instructions instead of working from general knowledge alone.

This skill covers cross-browser and cross-device testing for Playwright projects. According to the skill file, the agent can add BrowserStack configuration to your playwright.config.ts, start test runs across Chrome, Firefox and WebKit (the engine behind Safari), and report results per browser with links to videos and logs.

  • Configure playwright.config.ts with BrowserStack connection options for several browser and OS pairs
  • Run Playwright tests on BrowserStack's cloud grid
  • Summarise build results in a table with status, browser, OS, duration, video URL and log URLs
  • List the browser and OS combinations available for Playwright
  • Set up local testing for localhost or staging sites behind a firewall

Install the browserstack skill

Download the ZIP file for the skill from this page and unzip it. You can install the skill in one of two places, depending on whether you want it for all your projects or just one.

For all projects, unzip it into ~/.claude/skills/. For a single project, unzip it into the .claude/skills/ folder inside that project. In the Claude apps, you can instead upload the ZIP under Settings, then Capabilities, then Skills.

  • Personal install: ~/.claude/skills/
  • Project install: .claude/skills/ inside your project folder
  • Claude apps: Settings → Capabilities → Skills, then upload the ZIP

Set up your BrowserStack credentials and MCP server

The skill needs two environment variables: BROWSERSTACK_USERNAME, your BrowserStack username, and BROWSERSTACK_ACCESS_KEY, your access key. You can find both in your BrowserStack account settings. If they are not set, the skill tells the agent to explain where to get them and then stop.

Setting the variables is not enough on its own. The skill file says the BrowserStack MCP server is not registered automatically. Results and browser-listing commands depend on it, so you need to install it manually (the source points to integrations/browserstack-mcp, installed with npm install) and register it in your own MCP configuration. Until you do, those commands fail with a tool-not-found error.

  • Set BROWSERSTACK_USERNAME and BROWSERSTACK_ACCESS_KEY in your environment
  • Install the browserstack-local npm package if you need to test localhost or staging sites
  • Install and register the BrowserStack MCP server for results and browser listing

Trigger the skill with natural requests

You do not need to type a command to use the skill. The skill activates when your request mentions terms such as browserstack, cross-browser, cloud testing, browser matrix, test on safari, test on firefox or browser compatibility. Describe what you want in plain language and the agent will pick up the skill.

The skill also lists five explicit commands. Each one matches a task in the skill file.

  • /pw:browserstack setup adds BrowserStack options to playwright.config.ts and adds a test:e2e:cloud npm script
  • /pw:browserstack run starts tests on the BrowserStack projects
  • /pw:browserstack results summarises the latest build's sessions
  • /pw:browserstack browsers lists available browser and OS combinations
  • /pw:browserstack local sets up a tunnel for localhost or staging testing

Example: configure and run a cross-browser test

A typical first session starts with setup. Ask the agent to set up BrowserStack for your Playwright project. It checks your current playwright.config.ts and adds BrowserStack projects for Chrome on Windows 11, Firefox on Windows 11 and WebKit on OS X Ventura, with a local fallback when BrowserStack is not configured.

Next, ask the agent to run the cloud tests. The skill file adds an npm script for this. After the run, ask for the results and the agent will report pass or fail for each browser, with links to the BrowserStack dashboard for videos and logs.

  • Ask: set up BrowserStack cross-browser testing for this Playwright project
  • Ask: run my tests on Firefox and Safari on BrowserStack
  • Ask: show the results of the last BrowserStack build as a table
npm run test:e2e:cloud

Safety notes: scripts and network access

This skill runs scripts and uses the network. Test runs are sent to BrowserStack's cloud, and the configuration passes your username and access key to the connection URL. Review the generated playwright.config.ts before committing it, and keep credentials in environment variables rather than in files you share.

The skill file also says results and browser-listing commands depend on the MCP server, which you set up yourself. Only install that server from sources you trust.

  • Do not commit your access key; the generated config reads it from environment variables
  • Check the generated config and commands before running them
  • Expect test traffic to leave your machine when you run on BrowserStack

Tips for getting reliable results

Start with one or two browser projects, then widen the matrix once the setup works. Use browserstack browsers to confirm which combinations exist before you add them to the config. If your site is on localhost or behind a firewall, set up local testing first, otherwise BrowserStack cannot reach it.

When a browser fails, ask the agent to highlight browser-specific failures. The skill's output format calls these out separately, which makes it easier to see whether a problem affects one engine or all of them.

  • Begin with one browser and expand the matrix later
  • Use the browsers command to check available combinations
  • Set up local testing for staging or localhost sites
  • Review failures per browser rather than as one overall result

What people use it for

  • Checking that a login form and checkout flow work in Safari (WebKit) before a release
  • Confirming a web app renders correctly in Firefox on Windows 11
  • Testing a staging site that sits behind a firewall using local testing
  • Summarising a full browser matrix in one results table for a QA review

Frequently asked questions

Is the browserstack agent skill free?

The skill's licence is MIT, as listed on this page. You still need your own BrowserStack account and credentials, and the skill file says it can check account limits with the browserstack_get_plan tool. Check BrowserStack's own site for its current plans.

What do I need to use the BrowserStack skill?

You need Node.js and npm, Playwright Test (@playwright/test) in your project, a BrowserStack account with BROWSERSTACK_USERNAME and BROWSERSTACK_ACCESS_KEY set, and the BrowserStack MCP server for results and browser listing. The browserstack-local npm package is needed for localhost or staging sites.

Why do the results commands fail with tool not found?

The skill file says the BrowserStack MCP server is not registered automatically. Install it from integrations/browserstack-mcp with npm install and register it in your own MCP configuration. Setting the environment variables alone is not enough.

Does this skill work with projects that do not use Playwright?

No. The skill's configuration and commands assume Playwright tests. For other test frameworks, this skill is not the right fit.

How is this different from running Playwright tests locally?

Local runs use browsers installed on your own machine. This skill sends the tests to BrowserStack's cloud, which hosts many browser and OS combinations you may not have locally, and then reports results per browser.

Where do I install the skill in Claude?

Unzip the downloaded ZIP into ~/.claude/skills/ for all projects or into .claude/skills/ inside one project. In the Claude apps, upload the ZIP under Settings, then Capabilities, then Skills.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

This skill suits Playwright developers and QA engineers who need to check how a web app behaves on Safari, Firefox or Windows Chrome, and who already have a BrowserStack account. It is a poor fit if you have no BrowserStack account, do not use Playwright, or expect it to work without manually setting up the MCP server.

Download the skill