Azure Microsoft Playwright Testing Ts

作者 microsoft354361d83247MIT收錄於 2026年10月8日更新於 2026年10月8日

Run Playwright tests at scale using Azure Playwright Workspaces (formerly Microsoft Playwright Testing). Use when scaling browser tests across cloud-hosted browsers, integrating with CI/CD pipelines, or publishing test results to the Azure portal.

精選僅含說明DevOps & Cloud Software Development

AI 產生的概覽

指導在 Azure Playwright Workspaces 上以雲端瀏覽器大規模執行 Playwright 測試並發佈入口網站報告。

功能: 此技能提供設定 @azure/playwright TypeScript SDK 的說明，讓 Playwright 測試在 Azure Playwright Workspaces 的雲端託管瀏覽器上執行。內容涵蓋安裝、環境變數、Microsoft Entra 與自訂認證、服務設定、執行測試、Azure 報告器、手動瀏覽器連線、設定選項，以及 GitHub Actions 和 Azure Pipelines 的 CI/CD 整合。它也說明如何從已淘汰的 @azure/microsoft-playwright-testing 套件移轉至 @azure/playwright。
適用情境: 適用於跨雲端瀏覽器擴充瀏覽器測試、將 Playwright 測試整合至 CI/CD 管線，或將測試結果發佈至 Azure 入口網站的情境。也適合從舊版 Microsoft Playwright Testing 套件移轉的專案。
執行需求: 需要 Node.js 與 npm、Playwright 1.47+（Azure 報告器功能需 1.57+），以及 @azure/playwright、@playwright/test 和 @azure/identity 套件。需要 Azure Playwright Workspaces 服務 URL、Azure 認證（例如透過 az login 或受控識別）以及連線至 Azure 的網路。此技能不含指令碼，僅為說明文件。

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-testing is retired on March 8, 2026. Use @azure/playwright instead. See migration guide.

Installation

bash

# Recommended: Auto-generates confignpm init @azure/playwright@latest
# Manual installationnpm install @azure/playwright --save-devnpm install @playwright/test@^1.47 --save-devnpm install @azure/identity --save-dev

# Recommended: Auto-generates confignpm init @azure/playwright@latest
# Manual installationnpm install @azure/playwright --save-devnpm install @playwright/test@^1.47 --save-devnpm install @azure/identity --save-dev

Requirements:

Playwright version 1.47+ (basic usage)
Playwright version 1.57+ (Azure reporter features)

Environment Variables

bash

PLAYWRIGHT_SERVICE_URL=wss://eastus.api.playwright.microsoft.com/playwrightworkspaces/{workspace-id}/browsersAZURE_TOKEN_CREDENTIALS=prod # Required only if DefaultAzureCredential is used in production

PLAYWRIGHT_SERVICE_URL=wss://eastus.api.playwright.microsoft.com/playwrightworkspaces/{workspace-id}/browsersAZURE_TOKEN_CREDENTIALS=prod # Required only if DefaultAzureCredential is used in production

Authentication

Microsoft Entra Token Credential (Recommended)

typescript

// playwright.service.config.tsimport { 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,  }));

// playwright.service.config.tsimport { 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

typescript

import { ManagedIdentityCredential } from "@azure/identity";import { createAzurePlaywrightConfig } from "@azure/playwright";
export default defineConfig(  config,  createAzurePlaywrightConfig(config, {    credential: new ManagedIdentityCredential(),  }));

import { ManagedIdentityCredential } from "@azure/identity";import { createAzurePlaywrightConfig } from "@azure/playwright";
export default defineConfig(  config,  createAzurePlaywrightConfig(config, {    credential: new ManagedIdentityCredential(),  }));

Core Workflow

Service Configuration

typescript

// playwright.service.config.tsimport { 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"]}),  }));

// playwright.service.config.tsimport { 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

With Azure Reporter

typescript

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"],    ],  });

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

typescript

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();});

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

typescript

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};

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

typescript

import { ServiceOS } from "@azure/playwright";
// Available valuesServiceOS.LINUX   // "linux" - defaultServiceOS.WINDOWS // "windows"

import { ServiceOS } from "@azure/playwright";
// Available valuesServiceOS.LINUX   // "linux" - defaultServiceOS.WINDOWS // "windows"

ServiceAuth Enum

typescript

import { ServiceAuth } from "@azure/playwright";
// Available valuesServiceAuth.ENTRA_ID      // Recommended - uses credentialServiceAuth.ACCESS_TOKEN  // Use PLAYWRIGHT_SERVICE_ACCESS_TOKEN env var

import { ServiceAuth } from "@azure/playwright";
// Available valuesServiceAuth.ENTRA_ID      // Recommended - uses credentialServiceAuth.ACCESS_TOKEN  // Use PLAYWRIGHT_SERVICE_ACCESS_TOKEN env var

CI/CD Integration

GitHub Actions

yaml

name: playwright-tson: [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

name: playwright-tson: [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

yaml

- 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

- 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

typescript

import {  createAzurePlaywrightConfig,  getConnectOptions,  ServiceOS,  ServiceAuth,  ServiceEnvironmentVariable,} from "@azure/playwright";
import type {  OsType,  AuthenticationType,  BrowserConnectOptions,  PlaywrightServiceAdditionalOptions,} from "@azure/playwright";

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)

typescript

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"]],  });

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)

typescript

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"],    ],  });

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 DefaultAzureCredential for local development; use ManagedIdentityCredential or WorkloadIdentityCredential for production
Enable artifacts — Set trace: "on-first-retry", video: "retain-on-failure" in config
Scale workers — Use --workers=20 or 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

來源與署名

來源：microsoft/skills位於.github/plugins/azure-sdk-typescript/skills/azure-microsoft-playwright-testing-ts提交354361d

授權條款： MIT

內容歸原作者所有。SourceWeft 從公開儲存庫中收錄這些內容。

檢舉或申請下架

Azure Microsoft Playwright Testing Ts

Azure Playwright Workspaces SDK for TypeScript

Installation

Environment Variables

Authentication

Microsoft Entra Token Credential (Recommended)

Custom Credential

Core Workflow

Service Configuration

Run Tests

With Azure Reporter

Manual Browser Connection

Configuration Options

ServiceOS Enum

ServiceAuth Enum

CI/CD Integration

GitHub Actions

Azure Pipelines

Key Types

Migration from Old Package

Before (Old)

After (New)

Best Practices

來源與署名

更多來自 microsoft/skills 的技能

Customize

Discover Azure Skills

Azure Resource Visualizer

Azure Resource Lookup

Azure Messaging

Azure Kusto

更多DevOps & Cloud技能

M5 Onboard

Runbook

Incident Response

Deploy Checklist

Spanner Basics

Secops Cases