Azure Microsoft Playwright Testing TS
MicrosoftOfficialCreated by Microsoft
- Skill
- Tool integration
- Software development
- MIT
- No issues found
AutoGineer summary
Written by AutoGineer from the skill’s own files, not by the author
The @azure/playwright SDK enables developers to run Playwright test suites at scale using cloud-hosted browsers within Azure Playwright Workspaces. It provides configuration utilities to connect local test runners to Azure infrastructure, supports Microsoft Entra ID authentication for secure access, and includes a dedicated reporter for publishing test results directly to the Azure portal. This tool is designed to replace the legacy @azure/microsoft-playwright-testing package, offering improved configuration patterns and explicit credential management for CI/CD pipelines.
What it does
- Configures Playwright to execute tests on cloud-hosted browsers via Azure Workspaces.
- Provides integration with Microsoft Entra ID for secure, token-based authentication.
- Includes a reporter to stream and publish test results to the Azure portal.
- Supports manual browser connection patterns for custom test scenarios.
- Facilitates high-concurrency testing by scaling workers in the cloud.
- Offers migration paths from the legacy Microsoft Playwright Testing package.
When to use it
- When you need to scale browser tests beyond the capacity of your local machine or CI runner.
- When you want to centralize test reporting and analytics in the Azure portal.
- When integrating Playwright into enterprise CI/CD pipelines using Azure infrastructure.
- When migrating from the deprecated @azure/microsoft-playwright-testing package.
Advantages
- Enables massive parallelization of browser tests.
- Reduces local resource consumption by offloading browser execution to the cloud.
- Improves security through native Microsoft Entra ID integration.
- Provides centralized visibility into test runs via Azure portal reporting.
Usage examples
- “How do I configure my Playwright project to use Azure cloud-hosted browsers?”
- You install the @azure/playwright package, import createAzurePlaywrightConfig in your service config file, and provide your Azure credentials to connect to your workspace.
- “How can I view my test results in the Azure portal?”
- Add the @azure/playwright/reporter to the reporter array in your Playwright configuration file to automatically publish results during test execution.
- “What is the recommended way to authenticate with Azure Playwright in production?”
- Use ManagedIdentityCredential or WorkloadIdentityCredential within your configuration to securely authenticate without hardcoded secrets.
Install
Download the skill as a ZIP:
https://mp-staging.autogineer.com/agent-skills/microsoft/azure-microsoft-playwright-testing-ts/downloadUnzip it into the cross-client skills folder of your project:
mkdir -p .agents/skills && unzip azure-microsoft-playwright-testing-ts.zip -d .agents/skills
Documentation by Microsoft
Azure 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-devRequirements:
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
AZURE_TOKEN_CREDENTIALS=prod # Required only if DefaultAzureCredential is used in productionAuthentication
Microsoft Entra Token Credential (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, ManagedIdentityCredential } from "@azure/identity";
import config from "./playwright.config";
// Local dev: DefaultAzureCredential. Production: set AZURE_TOKEN_CREDENTIALS=prod or AZURE_TOKEN_CREDENTIALS=<specific_credential>
const credential = new DefaultAzureCredential({requiredEnvVars: ["AZURE_TOKEN_CREDENTIALS"]});
// Or use a specific credential directly in production:
// See https://learn.microsoft.com/javascript/api/overview/azure/identity-readme?view=azure-node-latest#credential-classes
// const credential = new ManagedIdentityCredential();
export default defineConfig(
config,
createAzurePlaywrightConfig(config, {
os: ServiceOS.LINUX,
credential,
})
);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({requiredEnvVars: ["AZURE_TOKEN_CREDENTIALS"]}),
})
);Run Tests
npx playwright test --config=playwright.service.config.ts --workers=20With 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({requiredEnvVars: ["AZURE_TOKEN_CREDENTIALS"]}),
}),
{
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 varCI/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=20Azure 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: trueKey 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({requiredEnvVars: ["AZURE_TOKEN_CREDENTIALS"]}),
}),
{
reporter: [
["html", { open: "never" }],
["@azure/playwright/reporter"],
],
}
);Best Practices
Use Microsoft Entra Token Credential — More secure than access tokens
Use
DefaultAzureCredentialfor local development; useManagedIdentityCredentialorWorkloadIdentityCredentialfor productionEnable artifacts — Set
trace: "on-first-retry",video: "retain-on-failure"in configScale workers — Use
--workers=20or higher for parallel executionRegion selection — Choose region closest to your test targets
HTML reporter first — When using Azure reporter, list HTML reporter before Azure reporter
Files
- ATTRIBUTION.mdAdded by AutoGineer1.0 KiB
- LICENSELicence file added by AutoGineer1.1 KiB
- SKILL.md8.6 KiB
Requirements and compatibility
Works with: Claude Code, Claude apps, OpenAI Codex, GitHub Copilot, Cursor, Gemini CLI, Kiro, OpenCode, Goose, Amp, Roo Code, JetBrains Junie, Factory Droid, Devin (ex-Windsurf), Mistral Vibe, OpenHands, Letta
“Works with” means the tool reads the open Agent Skills format; a skill written for one tool may use features others lack.
Needs: Needs a command-line tool, Needs Node.js
Security
No issues found by our static scan· No issues found
A static scan is not a guarantee. Skills are third-party content: review a skill before you let an agent use it.
Attribution and licence
- Created by
- Microsoft
- Publisher
- Microsoft (Official)
- Source
- microsoft/skills · .github/plugins/azure-sdk-typescript/skills/azure-microsoft-playwright-testing-ts · commit 0696600
- Licence
- MIT License (redistribution allowed)
- LICENSE (added by AutoGineer from LICENSE)
- ATTRIBUTION.md (written by AutoGineer)
- Synced
AutoGineer is not affiliated with or endorsed by Microsoft.
Download ZIP
The ZIP holds the skill’s files, its licence files and an ATTRIBUTION.md. Download azure-microsoft-playwright-testing-ts.zip