
Azure Playwright Testing
FreeRun Playwright tests at scale with Azure integration.
Free · Opens the source repo
What Azure Playwright Testing does
The Azure Playwright Workspaces SDK for TypeScript enables developers to run Playwright tests using cloud-hosted browsers. This integration allows for efficient testing at scale, leveraging Azure's infrastructure for enhanced performance and reporting capabilities. By utilizing this SDK, teams can streamline their testing processes, ensuring that applications are thoroughly vetted across various browser environments without the overhead of managing local testing infrastructure.
To get started, developers can either use the auto-configuration setup or manually install the necessary packages. The SDK requires Playwright version 1.47 or higher for basic functionality, and version 1.57 or higher to access Azure-specific reporting features. Once set up, users can configure their testing environment with Microsoft Entra ID for authentication, allowing for secure access to Azure resources.
The core workflow involves defining a Playwright configuration that integrates Azure-specific settings, such as service operating system and connection timeouts. Developers can run tests with a specified number of workers, optimizing the testing time by parallelizing the execution. Additionally, the SDK supports integration with CI/CD pipelines, making it suitable for automated testing workflows in environments like GitHub Actions and Azure Pipelines.
This skill is particularly beneficial for teams looking to enhance their testing capabilities with cloud resources, providing a scalable solution that integrates seamlessly with existing Azure services. It is ideal for developers and QA engineers who require reliable testing across multiple browsers and devices, ensuring consistent application performance and user experience.
When to use it
Use this skill when you need to run extensive Playwright tests across multiple browsers in a cloud environment, especially when integrating with Azure services.
When not to use it
This skill may not be suitable for smaller projects or teams that prefer local testing without cloud integration, or if you are not using Playwright as your testing framework.
What you can build with it
Automated Testing in CI/CD
Integrate Azure Playwright SDK into your CI/CD pipeline to run automated tests on every code push, ensuring quality control.
Cross-Browser Testing
Utilize cloud-hosted browsers to conduct thorough cross-browser testing, ensuring your application performs consistently across all environments.
Scalable Test Execution
Run multiple tests in parallel using Azure's infrastructure, significantly reducing the time required for comprehensive testing.
How to install Azure Playwright Testing
View source1. Install with the skills CLI
npx skills add sickn33/agentic-awesome-skills/azure-microsoft-playwright-testing-ts --agent claude-code2. Or install it manually
Download the skill folder and drop it into ~/.claude/skills/ for all projects, or .claude/skills/ to scope it to one repo. Restart Claude Code so it picks up the new skill.
Anthropic's agentic coding CLI, and the reference implementation of Agent Skills. Drop a skill folder into ~/.claude/skills and Claude Code loads it automatically whenever a task matches the skill's description. Claude Code docs
Inside SKILL.md
Written by sickn33Azure Playwright Workspaces SDK for TypeScript
Run Playwright tests at scale with cloud-hosted browsers and integrated Azure portal reporting.
Migration Notice:
@azure/microsoft-playwright-testingis retired on March 8, 2026. Use@azure/playwrightinstead. See migration guide.
Installation
# Recommended: Auto-generates config
npm init @azure/playwright@latest
# Manual installation
npm install @azure/playwright --save-dev
npm install @playwright/test@^1.47 --save-dev
npm install @azure/identity --save-dev
Requirements:
- Playwright version 1.47+ (basic usage)
- Playwright version 1.57+ (Azure reporter features)
Environment Variables
PLAYWRIGHT_SERVICE_URL=wss://eastus.api.playwright.microsoft.com/playwrightworkspaces/{workspace-id}/browsers
Authentication
Microsoft Entra ID (Recommended)
# Sign in with Azure CLI
az login
// playwright.service.config.ts
import { defineConfig } from "@playwright/test";
import { createAzurePlaywrightConfig, ServiceOS } from "@azure/playwright";
import { DefaultAzureCredential } from "@azure/identity";
import config from "./playwright.config";
export default defineConfig(
config,
createAzurePlaywrightConfig(config, {
os: ServiceOS.LINUX,
credential: new DefaultAzureCredential(),
})
);
Custom Credential
import { ManagedIdentityCredential } from "@azure/identity";
import { createAzurePlaywrightConfig } from "@azure/playwright";
export default defineConfig(
config,
createAzurePlaywrightConfig(config, {
credential: new ManagedIdentityCredential(),
})
);
Core Workflow
Service Configuration
// playwright.service.config.ts
import { defineConfig } from "@playwright/test";
import { createAzurePlaywrightConfig, ServiceOS } from "@azure/playwright";
import { DefaultAzureCredential } from "@azure/identity";
import config from "./playwright.config";
export default defineConfig(
config,
createAzurePlaywrightConfig(config, {
os: ServiceOS.LINUX,
connectTimeout: 30000,
exposeNetwork: "<loopback>",
credential: new DefaultAzureCredential(),
})
);
Run Tests
npx playwright test --config=playwright.service.config.ts --workers=20
With Azure Reporter
import { defineConfig } from "@playwright/test";
import { createAzurePlaywrightConfig, ServiceOS } from "@azure/playwright";
import { DefaultAzureCredential } from "@azure/identity";
import config from "./playwright.config";
export default defineConfig(
config,
createAzurePlaywrightConfig(config, {
os: ServiceOS.LINUX,
credential: new DefaultAzureCredential(),
}),
{
reporter: [
["html", { open: "never" }],
["@azure/playwright/reporter"],
],
}
);
Manual Browser Connection
import playwright, { test, expect, BrowserType } from "@playwright/test";
import { getConnectOptions } from "@azure/playwright";
test("manual connection", async ({ browserName }) => {
const { wsEndpoint, options } = await getConnectOptions();
const browser = await (playwright[browserName] as BrowserType).connect(wsEndpoint, options);
const context = await browser.newContext();
const page = await context.newPage();
await page.goto("https://example.com");
await expect(page).toHaveTitle(/Example/);
await browser.close();
});
Configuration Options
type PlaywrightServiceAdditionalOptions = {
serviceAuthType?: "ENTRA_ID" | "ACCESS_TOKEN"; // Default: ENTRA_ID
os?: "linux" | "windows"; // Default: linux
runName?: string; // Custom run name for portal
connectTimeout?: number; // Default: 30000ms
exposeNetwork?: string; // Default: <loopback>
credential?: TokenCredential; // REQUIRED for Entra ID
};
ServiceOS Enum
import { ServiceOS } from "@azure/playwright";
// Available values
ServiceOS.LINUX // "linux" - default
ServiceOS.WINDOWS // "windows"
ServiceAuth Enum
import { ServiceAuth } from "@azure/playwright";
// Available values
ServiceAuth.ENTRA_ID // Recommended - uses credential
ServiceAuth.ACCESS_TOKEN // Use PLAYWRIGHT_SERVICE_ACCESS_TOKEN env var
CI/CD Integration
GitHub Actions
name: playwright-ts
on: [push, pull_request]
permissions:
id-token: write
contents: read
jobs:
test:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- name: Azure Login
uses: azure/login@v2
with:
client-id: ${{ secrets.AZURE_CLIENT_ID }}
tenant-id: ${{ secrets.AZURE_TENANT_ID }}
subscription-id: ${{ secrets.AZURE_SUBSCRIPTION_ID }}
- run: npm ci
- name: Run Tests
env:
PLAYWRIGHT_SERVICE_URL: ${{ secrets.PLAYWRIGHT_SERVICE_URL }}
run: npx playwright test -c playwright.service.config.ts --workers=20
Azure Pipelines
- task: AzureCLI@2
displayName: Run Playwright Tests
env:
PLAYWRIGHT_SERVICE_URL: $(PLAYWRIGHT_SERVICE_URL)
inputs:
azureSubscription: My_Service_Connection
scriptType: pscore
inlineScript: |
npx playwright test -c playwright.service.config.ts --workers=20
addSpnToEnvironment: true
Key Types
import {
createAzurePlaywrightConfig,
getConnectOptions,
ServiceOS,
ServiceAuth,
ServiceEnvironmentVariable,
} from "@azure/playwright";
import type {
OsType,
AuthenticationType,
BrowserConnectOptions,
PlaywrightServiceAdditionalOptions,
} from "@azure/playwright";
Migration from Old Package
Old (@azure/microsoft-playwright-testing) | New (@azure/playwright) |
|---|---|
getServiceConfig() | createAzurePlaywrightConfig() |
timeout option | connectTimeout option |
runId option | runName option |
useCloudHostedBrowsers option | Removed (always enabled) |
@azure/microsoft-playwright-testing/reporter | @azure/playwright/reporter |
| Implicit credential | Explicit credential parameter |
Before (Old)
import { getServiceConfig, ServiceOS } from "@azure/microsoft-playwright-testing";
export default defineConfig(
config,
getServiceConfig(config, {
os: ServiceOS.LINUX,
timeout: 30000,
useCloudHostedBrowsers: true,
}),
{
reporter: [["@azure/microsoft-playwright-testing/reporter"]],
}
);
After (New)
import { createAzurePlaywrightConfig, ServiceOS } from "@azure/playwright";
import { DefaultAzureCredential } from "@azure/identity";
export default defineConfig(
config,
createAzurePlaywrightConfig(config, {
os: ServiceOS.LINUX,
connectTimeout: 30000,
credential: new DefaultAzureCredential(),
}),
{
reporter: [
["html", { open: "never" }],
["@azure/playwright/reporter"],
],
}
);
Best Practices
- Use Entra ID auth — More secure than access tokens
- Provide explicit credential — Always pass
credential: new DefaultAzureCredential() - Enable artifacts — Set
trace: "on-first-retry",video: "retain-on-failure"in config - Scale workers — Use
--workers=20or higher for parallel execution - Region selection — Choose region closest to your test targets
- HTML reporter first — When using Azure reporter, list HTML reporter before Azure reporter
When to Use
This skill is applicable to execute the workflow or actions described in the overview.
Limitations
- Use this skill only when the task clearly matches the scope described above.
- Do not treat the output as a substitute for environment-specific validation, testing, or expert review.
- Stop and ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.
Frequently asked questions about Azure Playwright Testing
Similar skills
Spring Boot Testing
Master testing techniques for Spring Boot 4 applications.
GitHub Issues
Manage GitHub issues efficiently with MCP tools.
Geofeed Tuner
Optimize your IP geolocation feeds in CSV format.
Batch Files
Master Windows batch scripting for automation and task management.
Adobe Illustrator Scripting
Automate your Illustrator workflows with ExtendScript.
Plugin Structure
Create and organize Claude Code plugins effectively.
