browserstack-cloud-testing

name	BrowserStack Cloud Testing
description	Cloud-based cross-browser and cross-device testing with BrowserStack including Automate, App Automate, Percy visual testing, Observability, and integration with Playwright, Selenium, and CI/CD pipelines.
version	1.0.0
author	thetestingacademy
license	MIT
tags	["browserstack","cross-browser","cloud-testing","device-testing","percy","visual-testing","automate","app-automate","observability","parallel-testing"]
testingTypes	["e2e","visual","mobile","performance","accessibility"]
frameworks	["playwright","selenium","cypress","appium"]
languages	["typescript","javascript","java","python"]
domains	["web","mobile"]
agents	["claude-code","cursor","github-copilot","windsurf","codex","aider","continue","cline","zed","bolt","gemini-cli","amp"]

BrowserStack Cloud Testing Skill

You are an expert in BrowserStack cloud testing platform. When the user asks you to set up cross-browser testing, configure BrowserStack Automate with Playwright or Selenium, implement Percy visual testing, or optimize cloud test execution, follow these detailed instructions.

Core Principles

1. Capability-driven browser selection -- Define browser and device capabilities precisely. Use BrowserStack's capability generators to avoid configuration errors.
2. Parallel execution optimization -- Maximize parallel test sessions to reduce total execution time. Design tests for independence to enable safe parallelization.
3. Local testing for pre-deployment -- Use BrowserStack Local to test staging environments and localhost applications through a secure tunnel before deploying to production.
4. Visual regression with Percy -- Integrate Percy snapshots into existing Playwright or Selenium tests for automated visual comparison across browsers and viewports.
5. Observability for debugging -- Enable BrowserStack Observability to get AI-powered failure analysis, flaky test detection, and performance insights without additional instrumentation.
6. Network and geolocation simulation -- Use BrowserStack's network throttling and geolocation capabilities to test under realistic conditions for global users.
7. Cost-efficient test distribution -- Balance test coverage across browsers and devices based on analytics data. Test the top 80% of user configurations, not every possible combination.

Project Structure

browserstack-tests/
  config/
    browserstack.config.ts
    capabilities.ts
    local-config.ts
  tests/
    e2e/
      login.spec.ts
      checkout.spec.ts
      search.spec.ts
    visual/
      homepage-visual.spec.ts
      product-page-visual.spec.ts
    mobile/
      mobile-navigation.spec.ts
      mobile-checkout.spec.ts
  helpers/
    browserstack-client.ts
    local-tunnel.ts
    capability-builder.ts
  percy/
    percy-config.ts
    snapshot-helpers.ts
  scripts/
    run-parallel.sh
    check-session-status.ts
  reports/
    .gitkeep

Playwright + BrowserStack Configuration

// config/browserstack.config.ts
import { defineConfig, devices } from '@playwright/test';

const BS_CAPS = {
  'browserstack.username': process.env. || ,
  : process.. || ,
  : process.. || ,
  : ,
  : ,
  : ,
  : ,
};

  ({
  : ,
  : ,
  : ,
  : ,
  : [
    [, { :  }],
    [, { :  }],
  ],
  : {
    : process.. || ,
    : ,
    : ,
  },
  : [
    {
      : ,
      : {
        : {
          : ({
            ...,
            : ,
            : ,
            : ,
            : ,
            : ,
            : (),
          }),
        },
      },
    },
    {
      : ,
      : {
        : {
          : ({
            ...,
            : ,
            : ,
            : ,
            : ,
            : ,
            : (),
          }),
        },
      },
    },
    {
      : ,
      : {
        : {
          : ({
            ...,
            : ,
            : ,
            : ,
            : ,
            : ,
            : (),
          }),
        },
      },
    },
    {
      : ,
      : {
        : {
          : ({
            ...,
            : ,
            : ,
            : ,
            : ,
            : (),
          }),
        },
      },
    },
    {
      : ,
      : {
        : {
          : ({
            ...,
            : ,
            : ,
            : ,
            : ,
            : (),
          }),
        },
      },
    },
  ],
});

 ():  {
   encoded = (.(caps));
   ;
}

 ():  {
   timestamp =  ().().()[];
   ci = process.. ?  : ;
   commit = process..?.(, ) || ;
   ;
}