Frontend Test

Definition

A Frontend Test in MTA is a set of Teststeps that start a Playwright Browser and use the Playwright Connector module to Locate Elements on a webpage and perform Actions on it.

In contrast to a "Traditional" backend test in MTA, where Mendix Microflows can be tested, a Frontend test allows to interact with any website's user interface.

Read the how-to section and the installation guide to enable Frontend testing.

Preparing the structure for Frontend-testing any website is described below in Setup Frontend Test. Teststeps that are generated, will be calling Microflows from the Playwright Connector.

Generating Teststeps specifically for testing Mendix Apps is described in Generate Teststep(s). Teststeps that are generated, will be calling Microflows from the Mendix Frontend Testkit. This allows for testing Mendix Pages.

For background information about Playwright Testing, make sure to checkout the Knowledge Base section in this documentation site, or consult the Playwright Documentation for Java.

Properties

Application

The Application that will be used for generated Test Cases.

Execution user

The Execution user that will be used for generated Test Cases.

Start test location

The hosting location of the Playwright Browser where the test will be executed in.

For installation instructions, please follow this page.

Start test location	Teststep will call Microflow
Locally	MenditectPlaywrightConnector.Start_Frontend_Test_Locally
BrowserStack	MenditectPlaywrightConnector.Start_Frontend_Test_With_BrowserStack
PlaywrightServer	MenditectPlaywrightConnector.Start_Frontend_Test_With_Playwright_Server

BrowserType

The browser that will be started; either Chromium, Firefox, or Webkit.

Headless

Headless means that the browser will not be visible during the test. Only applicable when Start test location = Locally (other options are always Headless).

SlowMo

Property of LocalStartOptions
Waiting time in milliseconds between Actions. Comparable with the Delay setting on Teststep.

Use login

Determines whether it is required to login to the Mendix App in order to test it's Pages.

If the Mendix App has Anonymous access enabled it may not be necessary to Use login.

Use login	Teststep will call Microflow
Yes	MenditectMxUITestKit.Start_MxFrontend_Test_With_Login
No	MenditectMxUITestKit.Start_MxFrontend_Test_Without_Login

user session handling

Mendix Studio Pro has a limitation of 6 allowed concurrent user sessions when running your App from Studio Pro.
To prevent running into errors in the middle of your (Frontend) test script, here are some simple suggestions:

• prevent using Anonymous sessions, to avoid leaving sessions open, and running into a max-sessions-exceeded Mendix error.
• always logout at the end of your Frontend test.
• prevent also manually logging in at the same time from your own browser.
• restart the App right before executing the test.

Mendix_URL

The URL where the Mendix App is running.

Tracing

Property of StartMxFrontendTestOptions
A Trace file will be generated, that you can upload at https://trace.playwright.dev/, where you will be able to view the actions in the browser. Particularly useful for Headless testing.

ViewPort

Property of StartMxFrontendTestOptions
Enables setting the height and width of the browser window.

Business rules

• The Playwright Connector module must be imported in the App under test, to create generic Frontend Tests.
• The Mendix Frontend Testkit module must be imported in the App under test, to Frontend Test Mendix Apps.
• Enable Loading Pages and Widgets, to Frontend Test Mendix Apps.
• The Page Class must be filled in in order to test Widgets on a Mendix Page.

Actions on Frontend Test

Setup Frontend Test

This action will generate 3 Test Cases

1. Frontend test - Setup
   • The Playwright Browser is created.
2. Frontend test - [Add test here]
   • The Frontend Test is started.
   • The Frontend Test is stopped, outputting any recorded Trace files.
   • Add the Teststeps in between.
3. Frontend test - Teardown
   • The Playwright Browser is terminated.

• Navigate to the Test Suite where you want to create a Frontend test in.
• Use the Add frontend test button to create Frontend Test Cases.
• Select the Application for the Test Cases.
• Select the Execution user for the Test Cases.
• Select the Start test location to determine if Playwright is hosted locally, in Browserstack, or in a separate server.
• Fix the construction errors by setting the missing parameters. Consult Properties above to learn about parameters.

Generate Teststep(s)

This action will generate one or more Teststeps.

• Move the mouse below the second Test Case.
• Click and Click Frontend teststep(s).
• Select the Page where the Widgets will be tested. If this is the first Page after opening the App, select the user's Homepage.
• Select the Widget to locate and perform an Action on.
• MTA will show the structure of the Widget on the Page.
• If any of the parent Widgets can contain multiple child elements, you must select which Filter to use.
• Define which Action to perform on the selected Widget.
• If the Action results in another Locator, select a secondary Action.
• Click Add teststeps.
• Fix any construction errors by filling in parameters of the Microflow teststeps that MTA added.

Related topics

• Frontend Testing Glossary
• Teststep

Feedback?

Missing anything? Let us know!

Last updated 14 October 2025