chore(playwrighttesting): improve javascript and typescript samples

sdk/playwrighttesting/microsoft-playwright-testing/samples/v1/javascript/customising-service-parameters/package.json

@@ -8,9 +8,9 @@
   "license": "ISC",
   "description": "",
   "devDependencies": {
-    "@azure/microsoft-playwright-testing": "1.0.0-beta.1",
+    "@azure/microsoft-playwright-testing": "^1.0.0-beta.1",
     "@azure/identity": "4.3.0",
-    "@playwright/test": "next",
+    "@playwright/test": "latest",
     "@types/node": "^20.14.6"
   }
 }

sdk/playwrighttesting/microsoft-playwright-testing/samples/v1/javascript/customising-service-parameters/playwright.service.config.js

@@ -1,24 +1,31 @@
 const { AzureCliCredential } = require("@azure/identity");
-const { getServiceConfig, ServiceOS } = require("@azure/microsoft-playwright-testing");
+const { getServiceConfig, ServiceOS, ServiceAuth } = require("@azure/microsoft-playwright-testing");
 const { defineConfig } = require('@playwright/test');
 const config = require("./playwright.config");
 
-export default defineConfig(
-  config,
-  getServiceConfig(config, {
-    os: ServiceOS.WINDOWS,
-    runId: new Date().toISOString(),
-    credential: new AzureCliCredential(),
-  }),
-  {
-    reporter: [
-      ["list"],
-      [
-        "@azure/microsoft-playwright-testing/reporter",
-        {
-          enableGitHubSummary: false,
-        },
-      ],
-    ],
-  },
-);
+const azureCredential = new AzureCliCredential();
+
+const serviceAuthType = ServiceAuth.ENTRA_ID;
+const os = ServiceOS.LINUX;
+
+const playwrightServiceAdditionalOptions = {
+  serviceAuthType: serviceAuthType, // Authentication types supported by Microsoft Playwright Testing
+  os: os, // Operating system types supported by Microsoft Playwright Testing
+  runId: new Date().toISOString(), // Run id for the test run
+  timeout: 30000, // Maximum time in milliseconds to wait for the connection to be established
+  slowMo: 0, // Slows down Playwright operations by the specified amount of milliseconds
+  exposeNetwork: "<loopback>", // Exposes network available on the connecting client to the browser being connected to
+  useCloudHostedBrowsers: true, // Use cloud hosted browsers
+  credential: azureCredential, // Custom token credential for Entra ID authentication
+  runName: "JavaScript V1 - Sample Run", // Run name for the test run
+};
+
+const reporterConfiguration = {
+  enableGitHubSummary: true, // Enable GitHub Actions annotations to diagnose test failures and deep link to MPT Portal
+  enableResultPublish: true, // Enable result publishing for the test run. This will upload the test result and artifacts to the MPT Portal
+};
+
+
+export default defineConfig(config, getServiceConfig(config, playwrightServiceAdditionalOptions), {
+  reporter: [["list"], ["@azure/microsoft-playwright-testing/reporter", reporterConfiguration]],
+});

sdk/playwrighttesting/microsoft-playwright-testing/samples/v1/javascript/manually-connecting-to-browsers/package.json

@@ -8,8 +8,8 @@
   "license": "ISC",
   "description": "",
   "devDependencies": {
-    "@azure/microsoft-playwright-testing": "1.0.0-beta.1",
-    "@playwright/test": "next",
+    "@azure/microsoft-playwright-testing": "^1.0.0-beta.1",
+    "@playwright/test": "latest",
     "@types/node": "^20.14.6"
   }
 }

sdk/playwrighttesting/microsoft-playwright-testing/samples/v1/javascript/manually-connecting-to-browsers/tests/sample.spec.js

@@ -1,5 +1,6 @@
 const playwright = require("@playwright/test");
-const { getConnectOptions } = require("@azure/microsoft-playwright-testing");
+const { getConnectOptions, ServiceOS } = require("@azure/microsoft-playwright-testing");
+const { AzureCliCredential } = require("@azure/identity");
 
 const { test, expect } = playwright;
 
@@ -20,8 +21,22 @@ test("has title", async ({ browserName }) => {
 });
 
 test("get started link", async ({ browserName }) => {
-  const { wsEndpoint, options } = await getConnectOptions();
-  const browser = await playwright[browserName].connect(wsEndpoint, options);
+  const azureCredential = new AzureCliCredential();
+  const os = ServiceOS.LINUX;
+
+  const playwrightServiceAdditionalOptions = {
+    os: os, // Operating system types supported by Microsoft Playwright Testing
+    runId: new Date().toISOString(), // Run id for the test run
+    timeout: 30000, // Maximum time in milliseconds to wait for the connection to be established
+    slowMo: 0, // Slows down Playwright operations by the specified amount of milliseconds
+    exposeNetwork: "<loopback>", // Exposes network available on the connecting client to the browser being connected to
+    useCloudHostedBrowsers: true, // Use cloud hosted browsers
+    credential: azureCredential, // Custom token credential for Entra ID authentication
+    runName: "JavaScript V1 - Sample Run", // Run name for the test run
+  };
+
+  const browserConnectOptions = await getConnectOptions(playwrightServiceAdditionalOptions);
+  const browser = await playwright[browserName].connect(browserConnectOptions.wsEndpoint, browserConnectOptions.options);
   const context = await browser.newContext();
   const page = await context.newPage();
 

sdk/playwrighttesting/microsoft-playwright-testing/samples/v1/javascript/set-default-authentication-mechanism/package.json

@@ -8,8 +8,8 @@
   "license": "ISC",
   "description": "",
   "devDependencies": {
-    "@azure/microsoft-playwright-testing": "1.0.0-beta.1",
-    "@playwright/test": "next",
+    "@azure/microsoft-playwright-testing": "^1.0.0-beta.1",
+    "@playwright/test": "latest",
     "@types/node": "^20.14.6"
   }
 }

sdk/playwrighttesting/microsoft-playwright-testing/samples/v1/javascript/set-default-authentication-mechanism/playwright.service.config.js

@@ -1,7 +1,11 @@
-const { getServiceConfig, ServiceAuth } = require("@azure/microsoft-playwright-testing");
+const { getServiceConfig, ServiceAuth, ServiceEnvironmentVariable } = require("@azure/microsoft-playwright-testing");
 const { defineConfig } = require('@playwright/test');
 const config = require("./playwright.config");
 
+// You can get the below values from the MPT portal. Alternatively you can directly set the environment variables PLAYWRIGHT_SERVICE_URL & PLAYWRIGHT_SERVICE_ACCESS_TOKEN
+process.env[ServiceEnvironmentVariable.PLAYWRIGHT_SERVICE_URL] = "Remote Browser URL";
+process.env[ServiceEnvironmentVariable.PLAYWRIGHT_SERVICE_ACCESS_TOKEN] = "***Access Token***";
+
 export default defineConfig(config, getServiceConfig(config, {
   serviceAuthType: ServiceAuth.ACCESS_TOKEN
 }), {

sdk/playwrighttesting/microsoft-playwright-testing/samples/v1/javascript/using-connect-options/package.json

@@ -8,8 +8,8 @@
   "license": "ISC",
   "description": "",
   "devDependencies": {
-    "@azure/microsoft-playwright-testing": "1.0.0-beta.1",
-    "@playwright/test": "next",
+    "@azure/microsoft-playwright-testing": "^1.0.0-beta.1",
+    "@playwright/test": "latest",
     "@types/node": "^20.14.6"
   }
 }

sdk/playwrighttesting/microsoft-playwright-testing/samples/v1/typescript/customising-service-parameters/package.json

@@ -8,9 +8,9 @@
   "license": "ISC",
   "description": "",
   "devDependencies": {
-    "@azure/microsoft-playwright-testing": "1.0.0-beta.1",
+    "@azure/microsoft-playwright-testing": "^1.0.0-beta.1",
     "@azure/identity": "4.3.0",
-    "@playwright/test": "next",
+    "@playwright/test": "latest",
     "@types/node": "^20.14.6"
   }
 }

sdk/playwrighttesting/microsoft-playwright-testing/samples/v1/typescript/customising-service-parameters/playwright.service.config.ts

@@ -1,24 +1,38 @@
-import { getServiceConfig, ServiceOS } from "@azure/microsoft-playwright-testing";
+import {
+  getServiceConfig,
+  ServiceOS,
+  PlaywrightServiceAdditionalOptions,
+  ServiceAuth,
+  AuthenticationType,
+  OsType,
+  MPTReporterConfig,
+} from "@azure/microsoft-playwright-testing";
 import { defineConfig } from "@playwright/test";
 import config from "./playwright.config";
 import { AzureCliCredential } from "@azure/identity";
 
-export default defineConfig(
-  config,
-  getServiceConfig(config, {
-    os: ServiceOS.WINDOWS,
-    runId: new Date().toISOString(),
-    credential: new AzureCliCredential(),
-  }),
-  {
-    reporter: [
-      ["list"],
-      [
-        "@azure/microsoft-playwright-testing/reporter",
-        {
-          enableGitHubSummary: false,
-        },
-      ],
-    ],
-  },
-);
+const azureCredential = new AzureCliCredential();
+
+const serviceAuthType: AuthenticationType = ServiceAuth.ENTRA_ID;
+const os: OsType = ServiceOS.LINUX;
+
+const playwrightServiceAdditionalOptions: PlaywrightServiceAdditionalOptions = {
+  serviceAuthType: serviceAuthType, // Authentication types supported by Microsoft Playwright Testing
+  os: os, // Operating system types supported by Microsoft Playwright Testing
+  runId: new Date().toISOString(), // Run id for the test run
+  timeout: 30000, // Maximum time in milliseconds to wait for the connection to be established
+  slowMo: 0, // Slows down Playwright operations by the specified amount of milliseconds
+  exposeNetwork: "<loopback>", // Exposes network available on the connecting client to the browser being connected to
+  useCloudHostedBrowsers: true, // Use cloud hosted browsers
+  credential: azureCredential, // Custom token credential for Entra ID authentication
+  runName: "Typescript V1 - Sample Run", // Run name for the test run
+};
+
+const reporterConfiguration: MPTReporterConfig = {
+  enableGitHubSummary: true, // Enable GitHub Actions annotations to diagnose test failures and deep link to MPT Portal
+  enableResultPublish: true, // Enable result publishing for the test run. This will upload the test result and artifacts to the MPT Portal
+};
+
+export default defineConfig(config, getServiceConfig(config, playwrightServiceAdditionalOptions), {
+  reporter: [["list"], ["@azure/microsoft-playwright-testing/reporter", reporterConfiguration]],
+});

sdk/playwrighttesting/microsoft-playwright-testing/samples/v1/typescript/manually-connecting-to-browsers/package.json

@@ -8,8 +8,8 @@
   "license": "ISC",
   "description": "",
   "devDependencies": {
-    "@azure/microsoft-playwright-testing": "1.0.0-beta.1",
-    "@playwright/test": "next",
+    "@azure/microsoft-playwright-testing": "^1.0.0-beta.1",
+    "@playwright/test": "latest",
     "@types/node": "^20.14.6"
   }
 }

sdk/playwrighttesting/microsoft-playwright-testing/samples/v1/typescript/manually-connecting-to-browsers/tests/sample.spec.ts

@@ -1,5 +1,11 @@
 import playwright, { test, expect, BrowserType } from "@playwright/test";
-import { getConnectOptions } from "@azure/microsoft-playwright-testing";
+import {
+  getConnectOptions,
+  PlaywrightServiceAdditionalOptions,
+  ServiceOS,
+  BrowserConnectOptions,
+} from "@azure/microsoft-playwright-testing";
+import { AzureCliCredential } from "@azure/identity";
 
 test("has title", async ({ browserName }) => {
   const { wsEndpoint, options } = await getConnectOptions();
@@ -18,8 +24,27 @@ test("has title", async ({ browserName }) => {
 });
 
 test("get started link", async ({ browserName }) => {
-  const { wsEndpoint, options } = await getConnectOptions();
-  const browser = await (playwright[browserName] as BrowserType).connect(wsEndpoint, options);
+  const azureCredential = new AzureCliCredential();
+  const os = ServiceOS.LINUX;
+
+  const playwrightServiceAdditionalOptions: PlaywrightServiceAdditionalOptions = {
+    os: os, // Operating system types supported by Microsoft Playwright Testing
+    runId: new Date().toISOString(), // Run id for the test run
+    timeout: 30000, // Maximum time in milliseconds to wait for the connection to be established
+    slowMo: 0, // Slows down Playwright operations by the specified amount of milliseconds
+    exposeNetwork: "<loopback>", // Exposes network available on the connecting client to the browser being connected to
+    useCloudHostedBrowsers: true, // Use cloud hosted browsers
+    credential: azureCredential, // Custom token credential for Entra ID authentication
+    runName: "Typescript V1 - Sample Run", // Run name for the test run
+  };
+
+  const browserConnectOptions: BrowserConnectOptions = await getConnectOptions(
+    playwrightServiceAdditionalOptions,
+  );
+  const browser = await (playwright[browserName] as BrowserType).connect(
+    browserConnectOptions.wsEndpoint,
+    browserConnectOptions.options,
+  );
   const context = await browser.newContext();
   const page = await context.newPage();
 

sdk/playwrighttesting/microsoft-playwright-testing/samples/v1/typescript/set-default-authentication-mechanism/package.json

@@ -8,8 +8,8 @@
   "license": "ISC",
   "description": "",
   "devDependencies": {
-    "@azure/microsoft-playwright-testing": "1.0.0-beta.1",
-    "@playwright/test": "next",
+    "@azure/microsoft-playwright-testing": "^1.0.0-beta.1",
+    "@playwright/test": "latest",
     "@types/node": "^20.14.6"
   }
 }

sdk/playwrighttesting/microsoft-playwright-testing/samples/v1/typescript/set-default-authentication-mechanism/playwright.service.config.ts

@@ -1,7 +1,15 @@
-import { getServiceConfig, ServiceAuth } from "@azure/microsoft-playwright-testing";
+import {
+  getServiceConfig,
+  ServiceAuth,
+  ServiceEnvironmentVariable,
+} from "@azure/microsoft-playwright-testing";
 import { defineConfig } from "@playwright/test";
 import config from "./playwright.config";
 
+// You can get the below values from the MPT portal. Alternatively you can directly set the environment variables PLAYWRIGHT_SERVICE_URL & PLAYWRIGHT_SERVICE_ACCESS_TOKEN
+process.env[ServiceEnvironmentVariable.PLAYWRIGHT_SERVICE_URL] = "Remote Browser URL";
+process.env[ServiceEnvironmentVariable.PLAYWRIGHT_SERVICE_ACCESS_TOKEN] = "***Access Token***";
+
 export default defineConfig(
   config,
   getServiceConfig(config, {

sdk/playwrighttesting/microsoft-playwright-testing/samples/v1/typescript/using-connect-options/package.json

@@ -8,8 +8,8 @@
   "license": "ISC",
   "description": "",
   "devDependencies": {
-    "@azure/microsoft-playwright-testing": "1.0.0-beta.1",
-    "@playwright/test": "next",
+    "@azure/microsoft-playwright-testing": "^1.0.0-beta.1",
+    "@playwright/test": "latest",
     "@types/node": "^20.14.6"
   }
 }