Skip to main content

Install Playwright Browser

Purpose​

This document describes the options to host a Playwright Browser, which is required to run a Frontend Test with MTA.

When executing a Frontend test, Playwright starts and hosts its own Browser. This can be Chromium, Firefox or Webkit. In order to do this, Playwright needs to load required dependencies and, therefore, it needs the right permissions on the host server.

Currently, there are 4 supported options to host a Playwright Browser:

  1. Locally. Use this option if the Mendix App is running from Studio Pro on your device.
  2. BrowserStack. Use this option if you have a BrowserStack subscription and your Mendix App is running in the cloud.
  3. PlaywrightServer. Use this option for Docker or other cloud hosted Playwright services if your Mendix App is running in the cloud.
  4. Azure. This option is available for Microsoft Azure subscriptions. Note you must use the Start_Frontend_Test_With_Azure_Playwright_Workspaces microflow from the Playwright Connector.
Mendix Cloud

You must choose either BrowserStack, PlaywrightServer or Azure if your Mendix App is running in the Mendix cloud, because a Locally hosted Playwright server will not run there.

Prerequisites​

Locally​

Playwright can be hosted locally with the Mendix App running in Studio Pro (e.g. localhost).

restart app needed

It may be necessary to restart your Mendix App once, if you do not see a browser window when running a locally-hosted Playwright Browser for the first time.

local admin rights

If you do not have local admin rights on your machine, you may run into errors when running Playwright locally.

If this jar file is added to the Mendix project and the app is deployed to a local server that allows Playwright to load the dependencies it needs, this is sufficient for executing the Test Cases. Separate hosting of the Playwright browsers is not needed then. However, if the jar-file is not added and/or the local server is also limited in the access it requires for Playwright to load its dependencies, it is needed to host a Playwright server elsewhere.

BrowserStack​

One alternative option to hosting Playwright locally is to use Browserstack. BrowserStack is a cloud-based testing platform that enables developers and QA teams to test applications across various browsers and devices. It offers native support for Playwright, allowing users to run automated end-to-end tests on real devices and browsers within its cloud infrastructure.

Currently, using Browserstack is only supported if the Mendix App is running in the cloud. Local Testing is currently only supported if Playwright is also running locally. Local Testing with Browserstack will be supported in a future release of the Playwright Connector.

Read Frontend test in the Reference Guide to learn how to configure the generated Teststeps in MTA.

PlaywrightServer​

Docker​

This chapter describes the situation where the Test Application is started from Studio Pro, and Docker Desktop is running on the same machine. When running the Test Application in the cloud, the URL in the Navigate action in step 10 0.0.0.0 will be replaced by the actual Application URL in the cloud. When running Docker in the cloud, omit the steps to install Docker Desktop, and replace the command in step 9 by the one noted in https://playwright.dev/docs/docker#running-the-playwright-server.

  1. Install Docker Desktop https://www.docker.com/products/docker-desktop/.
  2. Although not always required by Docker, restart Windows.
  3. Start Studio Pro that will run the Test Application and connect to MTA.
  4. Make sure the Connector and Mendix Frontend Testkit are imported.
  5. Check the playwright version that is being used by the Connector. This should be noted in the documentation in the Mendix Marketplace.
  6. Run the Test Application. Check MTA to see if it's connected.
  7. Run Docker Desktop. No need to sign-in, just click Skip.
  8. Run a command line prompt (cmd).
  9. Copy the command line noted here into a text editor (use the copy button): https://playwright.dev/docs/docker#network-configuration.
  10. Replace the two parts where the playwright version is denoted, by the playwright version in use by the Connector. Example:
    docker run --add-host=hostmachine:host-gateway -p 3000:3000 --rm --init -it --workdir /home/pwuser --user pwuser mcr.microsoft.com/playwright:v1.53.0-noble /bin/sh -c "npx -y playwright@1.53.0 run-server --port 3000 --host 0.0.0.0"
  11. Copy and paste the command line in the prompt and press Enter.
    This will do three things:
    1. download the docker image containing the playwright server
    2. run this image in a virtualized Docker container
    3. make sure that the hostmachine can be reached from the container.
  12. Wait until it says Listening on ws://0.0.0.0:3000/ in the prompt.
  13. To shutdown the locally running docker container simply press Ctrl+C in the prompt.
Important note

You cannot navigate to localhost, because the localhost will point to inside the virtualized container. You have to navigate to http://hostmachine:8080 (assuming the Test Application is running on port 8080). This will only work if you correctly executed step 10.

Azure​

To run Playwright in Azure, follow these steps:

  1. Navigate to https://portal.azure.com and login to a Microsoft account. Create a (free) account if you do not have one. Note that free accounts get 100 minutes of free Playwright Testing for the first month.
  2. Look for the "Azure App Testing" Service.
  3. Navigate to "All resources" and Create a "Playwright Workspace".
  4. Copy and save the "Browser endpoint" URL in a secure password manager.
  5. Navigate to "Settings", "Access management".
  6. Generate an Access Token.
  7. Copy and save the Token value in a secure password manager.

Read Frontend test in the Reference Guide to learn how to configure the generated Teststeps in MTA.

Feedback?​

Missing anything? Let us know!

Last updated 15 September 2025