Addressed review comments

ninallam · ninallam · commit 85af3f376dab · 2025-08-05T23:59:03.000+05:30
diff --git a/articles/app-testing/playwright-workspaces/how-to-manage-access-tokens.md b/articles/app-testing/playwright-workspaces/how-to-manage-access-tokens.md
@@ -82,18 +82,19 @@ To create a new workspace access token:
 
 1. On the **Access Management** page, select **Generate token**.
 
-    :::image type="content" source="./media/how-to-manage-access-tokens/playwright-workspaces-generate-new-access-token.png" alt-text="Screenshot that shows the access tokens settings page in the Azure portal, highlighting the 'Generate new token' button" lightbox="./media/how-to-manage-access-tokens/playwright-workspaces-generate-new-access-token.png":::
+    :::image type="content" source="./media/how-to-manage-access-tokens/playwright-workspaces-generate-new-access-token.png" alt-text="Screenshot that shows the access tokens settings page in the Azure portal, highlighting the 'Generate new token' button." lightbox="./media/how-to-manage-access-tokens/playwright-workspaces-generate-new-access-token.png":::
 
 
 1. Enter the access token details, and then select **Generate token**.
 
-    ![Screenshot that shows setup guide in the Azure portal, highlighting the 'Generate token' button.](./media/how-to-manage-access-tokens/playwright-workspaces-generate-access-token.png)
+    :::image type="content" source="./media/how-to-manage-access-tokens/playwright-workspaces-generate-access-token.png" alt-text="Screenshot that shows setup guide in the Azure portal, highlighting the 'Generate token' button." lightbox="./media/how-to-manage-access-tokens/playwright-workspaces-generate-access-token.png":::
+
 
 1. Copy the access token for the workspace.
 
     You can save the access token in a CI/CD secrets store or use it in an environment variable for running tests interactively.
 
-    ![Screenshot that shows how to copy the generated access token in the Azure portal.](./media/how-to-manage-access-tokens/playwright-workspaces-copy-access-token.png)
+    :::image type="content" source="./media/how-to-manage-access-tokens/playwright-workspaces-copy-access-token.png" alt-text="Screenshot that shows how to copy the generated access token in the Azure portal" lightbox="./media/how-to-manage-access-tokens/playwright-workspaces-copy-access-token.png":::
     
     > [!IMPORTANT]
     > You can only access the token value immediately after you've created it. You can't access the token value anymore at a later time.
diff --git a/articles/app-testing/playwright-workspaces/how-to-manage-workspace-access.md b/articles/app-testing/playwright-workspaces/how-to-manage-workspace-access.md
@@ -52,19 +52,19 @@ You can grant a user access to a Playwright workspace by using the Azure portal:
 
     If you don't have permissions to assign roles, the **Add role assignment** option is disabled.
 
-    ![Screenshot that shows how to add a role assignment to your workspace in the Azure portal.](media/how-to-manage-workspace-access/add-role-assignment.png)
+    :::image type="content" source="./media/how-to-manage-workspace-access/add-role-assignment.png" alt-text="Screenshot that shows how to add a role assignment to your workspace in the Azure portal." lightbox="./media/how-to-manage-workspace-access/add-role-assignment.png":::
 
 1. On the **Role** tab, select **Privileged administrator** roles.
 
 1. Select one of the Playwright Workspaces [default roles](#default-roles), and then select **Next**.
 
-    ![Screenshot that shows the list of roles when adding a role assignment in the Azure portal.](media/how-to-manage-workspace-access/add-role-assignment-select-role.png)
+    :::image type="content" source="./media/how-to-manage-workspace-access/add-role-assignment-select-role.png" alt-text="Screenshot that shows the list of roles when adding a role assignment in the Azure portal." lightbox="./media/how-to-manage-workspace-access/add-role-assignment-select-role.png":::
 
 1. On the **Members** tab, make sure **User, group, or service principal** is selected.
 
 1. Select **Select members**, find and select the users, groups, or service principals.
 
-    ![Screenshot that shows the member selection interface when adding a role assignment in the Azure portal.](media/how-to-manage-workspace-access/add-role-assignment-select-members.png)
+    :::image type="content" source="./media/how-to-manage-workspace-access/add-role-assignment-select-members.png" alt-text="Screenshot that shows the member selection interface when adding a role assignment in the Azure portal." lightbox="./media/how-to-manage-workspace-access/add-role-assignment-select-members.png":::
 
 1. Select **Review + assign** to assign the role.
 
@@ -80,7 +80,8 @@ You can revoke a user's access to a Playwright workspace using the Azure portal:
 
 1. In the list of role assignments, add a checkmark next to the user and role you want to remove, and then select **Remove**.
 
-    ![Screenshot that shows the list of role assignments and how to delete an assignment in the Azure portal.](media/how-to-manage-workspace-access/remove-role-assignment.png)
+    :::image type="content" source="./media/how-to-manage-workspace-access/remove-role-assignment.png" alt-text="Screenshot that shows the list of role assignments and how to delete an assignment in the Azure portal." lightbox="./media/how-to-manage-workspace-access/remove-role-assignment.png":::
+
 
 1. Select **Yes** in the confirmation window to remove the role assignment.
 
@@ -118,7 +119,8 @@ Perform the following steps to manage permissions with a custom role:
 
 1. Select the required permission like `Microsoft.LoadTestService/PlaywrightWorkspaces/write`, and then select **Add**.
 
-    ![Screenshot that shows the list of permissions for adding to the custom role in the Azure portal, highlighting the permission record to add.](media/how-to-manage-workspace-access/custom-role-permissions.png)
+    :::image type="content" source="./media/how-to-manage-workspace-access/custom-role-permissions.png" alt-text="Screenshot that shows the list of permissions for adding to the custom role in the Azure portal, highlighting the permission record to add." lightbox="./media/how-to-manage-workspace-access/custom-role-permissions.png":::
+
 
 1. Follow these steps to [add a role assignment](/azure/role-based-access-control/role-assignments-portal) for the custom role to the user account.
 
diff --git a/articles/app-testing/playwright-workspaces/how-to-optimize-regional-latency.md b/articles/app-testing/playwright-workspaces/how-to-optimize-regional-latency.md
@@ -34,7 +34,7 @@ You can configure the regional settings for your workspace in the Azure portal.
 
     By default, the service uses remote browsers in the Azure region that's closest to the client machine to minimize latency.
 
-![Screenshot of the Region Management settings page.](./media/how-to-optimize-regional-latency/configure-workspace-region-management.png )
+:::image type="content" source="./media/how-to-optimize-regional-latency/configure-workspace-region-management.png" alt-text="Screenshot of the Region Management settings page." lightbox="./media/how-to-optimize-regional-latency/configure-workspace-region-management.png":::
 
 ## Related content
 
diff --git a/articles/app-testing/playwright-workspaces/how-to-try-playwright-workspaces-free.md b/articles/app-testing/playwright-workspaces/how-to-try-playwright-workspaces-free.md
@@ -31,7 +31,7 @@ The following table lists the limits for the Playwright Workspaces free trial.
 |-|-|
 | Duration of trial | 30 days |
 | Total test minutes¹ | 100 minutes |
-| Number of workspaces²³ | 1 |
+| Number of workspaces<sup>2,3</sup> | 1 |
 
 ¹ If your usage exceeds the free test minute limit, only the overage counts toward the pay-as-you-go billing model. See [Playwright Workspaces preview pricing](https://aka.ms/pww/pricing)
 
@@ -48,13 +48,14 @@ To get started with running your Playwright tests on cloud browsers, you first n
 
 1. Sign in to the [Azure portal](https://portal.azure.com/).
 1. Select the menu button in the upper-left corner of the portal, and then select **Create a resource** a resource.
-
-    ![Screenshot that shows the Azure portal menu to create a new resource.](./media/how-to-manage-playwright-workspace/azure-portal-create-resource.png)
-
+    
+    :::image type="content" source="./media/how-to-manage-playwright-workspace/azure-portal-create-resource.png" alt-text="Screenshot that shows the Azure portal menu to create a new resource." lightbox="./media/how-to-manage-playwright-workspace/azure-portal-create-resource.png":::
+    
 1. Enter *Playwright Workspaces* in the search box.
 1. Select the **Playwright Workspaces** card, and then select **Create**.
 
-    ![Screenshot that shows the Azure Marketplace search page with the Playwright Workspaces search result.](./media/how-to-manage-playwright-workspace/azure-portal-search-playwright-resource.png)
+    :::image type="content" source="./media/how-to-manage-playwright-workspace/azure-portal-search-playwright-resource.png" alt-text="Screenshot that shows the Azure Marketplace search page with the Playwright Workspaces search result." lightbox="./media/how-to-manage-playwright-workspace/azure-portal-search-playwright-resource.png":::
+
 
 1. Provide the following information to configure a new Playwright workspace:
 
@@ -76,7 +77,8 @@ To get started with running your Playwright tests on cloud browsers, you first n
 
 1. To view the new workspace, select **Go to resource**.
 
-    ![Screenshot that shows the deployment completion information in the Azure portal.](./media/how-to-manage-playwright-workspace/create-resource-deployment-complete.png)
+    :::image type="content" source="./media/how-to-manage-playwright-workspace/create-resource-deployment-complete.png" alt-text="Screenshot that shows the deployment completion information in the Azure portal." lightbox="./media/how-to-manage-playwright-workspace/create-resource-deployment-complete.png":::
+
 
 ## Upgrade your workspace
 
diff --git a/articles/app-testing/playwright-workspaces/overview-what-is-microsoft-playwright-workspaces.md b/articles/app-testing/playwright-workspaces/overview-what-is-microsoft-playwright-workspaces.md
@@ -70,7 +70,7 @@ Playwright Workspaces is built on top of the Playwright framework.
 
 Playwright Workspaces instantiates cloud-hosted browsers across different operating systems. Playwright executes tests on the client machine—either a developer workstation or a CI agent—and remotely control cloud-hosted browsers via the Playwright Workspaces service. The test code remains on the client machine throughout the test run, while browser interactions are performed in the cloud.
 
-![Diagram that shows an architecture overview of Playwright Workspaces.](./media/overview-what-is-microsoft-playwright-workspaces/playwright-workspaces-architecture-overview.png)
+:::image type="content" source="./media/overview-what-is-microsoft-playwright-workspaces/playwright-workspaces-architecture-overview.png" alt-text="Diagram that shows an architecture overview of Playwright Workspaces." lightbox="./media/overview-what-is-microsoft-playwright-workspaces/playwright-workspaces-architecture-overview.png":::
 
 After a test run completes, the test results, trace files, and other test run files are available on the client machine.
 
diff --git a/articles/app-testing/playwright-workspaces/quickstart-automate-end-to-end-testing.md b/articles/app-testing/playwright-workspaces/quickstart-automate-end-to-end-testing.md
@@ -51,7 +51,7 @@ To get the service endpoint URL and store it as a CI workflow secret, perform th
 
 1. Select the **Get Started** page.
 
-![Screenshot that shows how to navigate to the Get Started page.](./media/quickstart-automate-end-to-end-testing/navigate-to-get-started.png)
+:::image type="content" source="./media/quickstart-automate-end-to-end-testing/navigate-to-get-started.png" alt-text="Screenshot that shows how to navigate to the Get Started page." lightbox="./media/quickstart-automate-end-to-end-testing/navigate-to-get-started.png":::
 
 1. In **Add region endpoint in your setup**, copy the service endpoint URL.
 
diff --git a/articles/app-testing/playwright-workspaces/quickstart-run-end-to-end-tests.md b/articles/app-testing/playwright-workspaces/quickstart-run-end-to-end-tests.md
@@ -37,12 +37,12 @@ To get started with running your Playwright tests on cloud browsers, you first n
 
 1. Select the menu button in the upper-left corner of the portal, and then select **Create a resource** a resource.
 
-    ![Screenshot that shows the Azure portal menu to create a new resource.](./media/how-to-manage-playwright-workspace/azure-portal-create-resource.png)
+    :::image type="content" source="./media/how-to-manage-playwright-workspace/azure-portal-create-resource.png" alt-text="Screenshot that shows the Azure portal menu to create a new resource." lightbox="./media/how-to-manage-playwright-workspace/azure-portal-create-resource.png":::
 
 1. Enter *Playwright Workspaces* in the search box.
 1. Select the **Playwright Workspaces** card, and then select **Create**.
 
-    ![Screenshot that shows the Azure Marketplace search page with the Playwright Workspaces search result.](./media/how-to-manage-playwright-workspace/azure-portal-search-playwright-resource.png)
+    :::image type="content" source="./media/how-to-manage-playwright-workspace/azure-portal-search-playwright-resource.png" alt-text="Screenshot that shows the Azure Marketplace search page with the Playwright Workspaces search result." lightbox="./media/how-to-manage-playwright-workspace/azure-portal-search-playwright-resource.png":::
 
 1. Provide the following information to configure a new Playwright workspace:
 
@@ -64,8 +64,7 @@ To get started with running your Playwright tests on cloud browsers, you first n
 
 1. To view the new workspace, select **Go to resource**.
 
-    ![Screenshot that shows the deployment completion information in the Azure portal.](./media/how-to-manage-playwright-workspace/create-resource-deployment-complete.png)
-
+    :::image type="content" source="./media/how-to-manage-playwright-workspace/create-resource-deployment-complete.png" alt-text="Screenshot that shows the deployment completion information in the Azure portal." lightbox="./media/how-to-manage-playwright-workspace/create-resource-deployment-complete.png":::
 
 ## Install Playwright Workspaces package 
 
@@ -103,13 +102,13 @@ To get the service endpoint URL, perform the following steps:
 
 1. Select the **Get Started** page.
 
-![Screenshot that shows how to navigate to the Get Started page.](./media/quickstart-automate-end-to-end-testing/navigate-to-get-started.png)
+    :::image type="content" source="./media/quickstart-automate-end-to-end-testing/navigate-to-get-started.png" alt-text="Screenshot that shows how to navigate to the Get Started page." lightbox="./media/quickstart-automate-end-to-end-testing/navigate-to-get-started.png":::
 
 1. In **Add region endpoint in your setup**, copy the service endpoint URL.
 
     Make sure this URL is available in `PLAYWRIGHT_SERVICE_URL` environment variable.
 
-    ![Screenshot that shows how to copy the service endpoint URL.](./media/quickstart-run-end-to-end-tests/copy-service-endpoint-url.png)
+    :::image type="content" source="./media/quickstart-run-end-to-end-tests/copy-service-endpoint-url.png" alt-text="Screenshot that shows how to copy the service endpoint URL." lightbox="../media/quickstart-run-end-to-end-tests/copy-service-endpoint-url.png":::
 
 ::: zone pivot="playwright-test-runner"
 
@@ -239,28 +238,30 @@ To run a single Playwright test in Visual Studio Code with Playwright Workspaces
 
     The test explorer automatically detects your Playwright tests and the service configuration in your project.
 
-    ![Screenshot of Visual Studio Code Test Explorer.](./media/quickstart-run-end-to-end-tests/visual-studio-code-test-explorer.png)
+    :::image type="content" source="./media/quickstart-run-end-to-end-tests/visual-studio-code-test-explorer.png" alt-text="Screenshot of Visual Studio Code Test Explorer." lightbox="./media/quickstart-run-end-to-end-tests/visual-studio-code-test-explorer.png":::
+
 
 1. Select **Select Default Profile**, and then select your default projects from the service configuration file.
 
     Notice that the service run profiles are coming from the `playwright.service.config.ts` file you added previously.
 
     By setting a default profile, you can automatically run your tests with the service, or run multiple Playwright projects simultaneously.
 
-    ![Screenshot of choosing the default run profile in Visual Studio Code](./media/quickstart-run-end-to-end-tests/visual-studio-code-choose-run-profile.png)
+    :::image type="content" source="./media/quickstart-run-end-to-end-tests/visual-studio-code-choose-run-profile.png" alt-text="Screenshot of choosing the default run profile in Visual Studio Code." lightbox="./media/quickstart-run-end-to-end-tests/visual-studio-code-choose-run-profile.png":::
+
 
 1. From the list of tests, select the **Run test** button next to a test to run it.
 
     The test runs on the projects you selected in the default profile. If you selected one or more projects from the service configuration, the test runs on remote browsers in your workspace.
 
-    ![Screenshot of running a single test in Visual Studio Code](./media/quickstart-run-end-to-end-tests/visual-studio-code-run-test.png)
+    :::image type="content" source="./media/quickstart-run-end-to-end-tests/visual-studio-code-run-test.png" alt-text="Screenshot of running a single test in Visual Studio Code." lightbox="./media/quickstart-run-end-to-end-tests/visual-studio-code-run-test.png":::
 
     > [!TIP]
     > You can still debug your test code when you run your tests on remote browsers by using the **Debug test** button.
 
 1. You can view the test results directly in Visual Studio Code.
 
-    ![Screenshot of test results in Visual Studio Code.](./media/quickstart-run-end-to-end-tests/visual-studio-code-test-results.png)
+    :::image type="content" source="./media/quickstart-run-end-to-end-tests/visual-studio-code-test-results.png" alt-text="Screenshot of test results in Visual Studio Code." lightbox="./media/quickstart-run-end-to-end-tests/visual-studio-code-test-results.png":::
 
 ---
 
@@ -306,14 +307,14 @@ To run your Playwright test suite in Visual Studio Code with Playwright Workspac
 
     When you run all tests, the default profile is used. In the previous step, you configured the default profile to use projects from the service configuration.
 
-    ![Screenshot of how to run all tests from Test Explorer Visual Studio Code.](./media/quickstart-run-end-to-end-tests/visual-studio-code-run-all-tests.png)
+    :::image type="content" source="./media/quickstart-run-end-to-end-tests/visual-studio-code-run-all-tests.png" alt-text="Screenshot of how to run all tests from Test Explorer Visual Studio Code." lightbox="./media/quickstart-run-end-to-end-tests/visual-studio-code-run-all-tests.png":::
 
     > [!TIP]
     > You can still debug your test code when you run your tests on remote browsers by using the **Debug tests** button.
 
 1. Alternately, you can select a specific service configuration from the list to only run the tests for a specific browser configuration.
 
-    ![Screenshot of how to select a specific project to run tests against in Visual Studio Code.](./media/quickstart-run-end-to-end-tests/visual-studio-code-run-all-tests-select-project.png)
+    :::image type="content" source="./media/quickstart-run-end-to-end-tests/visual-studio-code-run-all-tests-select-project.png" alt-text="Screenshot of how to select a specific project to run tests against in Visual Studio Code." lightbox="./media/quickstart-run-end-to-end-tests/visual-studio-code-run-all-tests-select-project.png":::
 
 1. You can view all test results in the **Test results** tab.
 
diff --git a/articles/app-testing/playwright-workspaces/tutorial-run-end-to-end-tests.md b/articles/app-testing/playwright-workspaces/tutorial-run-end-to-end-tests.md
