Edit

Share via

Use cloud-hosted browsers for locally deployed or privately hosted apps with Playwright Workspaces

Learn how to use Playwright Workspaces to run end-to-end tests for locally deployed applications. Playwright Workspaces uses cloud-hosted, remote browsers for running Playwright tests at scale. You can use the service to run tests for apps on localhost, or that you host on your infrastructure.

Playwright enables you to expose networks that are available on the client machine to remote browsers. When you expose a network, you can connect to local resources from your Playwright test code without having to configure additional firewall settings.

Important

Playwright Workspaces is currently in preview. For legal terms that apply to Azure features that are in beta, in preview, or otherwise not yet released into general availability, see the Supplemental Terms of Use for Microsoft Azure Previews.

Configure Playwright to expose local networks

To expose local networks and resources to remote browsers, you can use the exposeNetwork option in Playwright. Learn more about the exposeNetwork option in the Playwright documentation.

You can specify one or multiple networks by using a list of rules. For example, to expose test/staging deployments and localhost: *.test.internal-domain,*.staging.internal-domain,<loopback>.

You can configure the exposeNetwork option in playwright.service.config.ts. The following example shows how to expose the localhost network by using the <loopback> rule. You can also replace localhost with a domain that you want to enable for the service.

import { getServiceConfig, ServiceOS } from "@azure/playwright";
import { defineConfig } from "@playwright/test";
import { DefaultAzureCredential } from "@azure/identity";
import config from "./playwright.config";

export default defineConfig(
  config,
  getServiceConfig(config, {
    exposeNetwork: '<loopback>', // Allow service to access the localhost.
    credential: new DefaultAzureCredential()
  }),
);

You can now reference localhost in the Playwright test code, and run the tests on cloud-hosted browsers with Playwright Workspaces:

npx playwright test --config=playwright.service.config.ts --workers=20

You can configure the ExposeNetwork option in the setup file. The following example shows how to expose the localhost network by using the <loopback> rule. You can also replace localhost with a domain that you want to enable for the service.

using Azure.Developer.Playwright.NUnit;
using Azure.Developer.Playwright;
using Azure.Identity;
using System.Runtime.InteropServices;
using System;

namespace PlaywrightService.SampleTests; // Remember to change this as per your project namespace

[SetUpFixture]
public class PlaywrightServiceNUnitSetup : PlaywrightServiceBrowserNUnit
{
    public PlaywrightServiceNUnitSetup() : base(
        credential: new DefaultAzureCredential(),
        options: new PlaywrightServiceBrowserClientOptions()
        {
            ExposeNetwork = "<loopback>"
        }
    )
    {
        // no-op
    }
}

You can now reference localhost in the Playwright test code, and run the tests on cloud-hosted browsers with Playwright Workspaces:

dotnet test -- NUnit.NumberOfTestWorkers=20

Related content