Skip to content

Test/improve playwright #2158

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
samuelreichert wants to merge 3 commits into
base: main
Choose a base branch
from
Open

Test/improve playwright #2158

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
efc4c6a
perf(e2e): add Chrome launch flags to reduce CI overhead
samuelreichert Mar 18, 2026
adb33df
chore: wip playwright tests
samuelreichert Mar 19, 2026
ffb932c
chore: remove outdated Playwright performance notes
samuelreichert Apr 3, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions automation/run-e2e/docker/docker-compose.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@ services:
# Starts after mxbuild completes; "docker compose up --wait" blocks until healthy.
mxruntime:
image: mxruntime:${MENDIX_VERSION:?MENDIX_VERSION is required}
shm_size: "2gb"
depends_on:
mxbuild:
condition: service_completed_successfully
Expand Down
23 changes: 22 additions & 1 deletion automation/run-e2e/playwright.config.cjs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,28 @@ module.exports = defineConfig({
baseURL: process.env.URL ? process.env.URL : "http://127.0.0.1:8080",

/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
trace: "on-first-retry"
trace: "on-first-retry",

launchOptions: {
args: [
"--disable-dev-shm-usage",
"--disable-extensions",
"--disable-background-networking",
"--disable-background-timer-throttling",
"--disable-renderer-backgrounding",
"--disable-sync",
"--disable-translate",
"--disable-default-apps",
"--disable-hang-monitor",
"--metrics-recording-only",
"--no-first-run",
"--font-render-hinting=none"
]
},

contextOptions: {
reducedMotion: "reduce"
}
},

/* Configure projects for major browsers */
Expand Down
16 changes: 8 additions & 8 deletions packages/pluggableWidgets/accessibility-helper-web/e2e/AccessibilityHelper.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { test, expect } from "@playwright/test";
import { expect, test } from "@playwright/test";

test.afterEach("Cleanup session", async ({ page }) => {
// Because the test isolation that will open a new session for every test executed, and that exceeds Mendix's license limit of 5 sessions, so we need to force logout after each test.
Expand All @@ -8,7 +8,7 @@
test.describe("with single target", () => {
test.beforeEach(async ({ page }) => {
await page.goto("/");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
});

test("sets attributes when condition is true", async ({ page }) => {
Expand Down Expand Up @@ -63,7 +63,7 @@
test("sets attributes when condition is true", async ({ page }) => {
await page.click(".mx-name-actionButton2");
await page.click(".mx-name-actionButton2");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
await page.click(".mx-name-radioButtons2 input:first-child");
await page.click(".mx-name-radioButtons2 input:first-child");
await expect(page.locator(".mx-name-text3")).toHaveAttribute("trueCondition", "true");
Expand All @@ -72,7 +72,7 @@

test("hides attributes when condition is false", async ({ page }) => {
await page.click(".mx-name-actionButton2");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
await page.click(".mx-name-radioButtons2 input:first-child");
await page.click(".mx-name-radioButtons2 input:first-child");
await expect(page.locator(".mx-name-text3")).not.toHaveAttribute("a11yhelper", "a11yhelper");
Expand All @@ -81,7 +81,7 @@

test("updates target attributes when attributes are expression", async ({ page }) => {
await page.click(".mx-name-actionButton2");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
await page.click(".mx-name-radioButtons2 input:first-child");
await page.click(".mx-name-radioButtons2 input:first-child");
await page.locator(".mx-name-textBox1 input").fill("test", { force: true });
Expand All @@ -94,7 +94,7 @@
test("updates target attributes using a NF", async ({ page }) => {
await page.click(".mx-name-actionButton2");
await page.click(".mx-name-actionButton2");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
await page.click(".mx-name-radioButtons2 input:first-child");
await page.click(".mx-name-radioButtons2 input:first-child");
await page.click(".mx-name-radioButtons1 input:first-child");
Expand All @@ -107,7 +107,7 @@

test("sets target attributes even though target's props changed eg: textinput", async ({ page }) => {
await page.click(".mx-name-actionButton2");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
await page.click(".mx-name-radioButtons2 input:first-child");
await page.click(".mx-name-radioButtons1 input:first-child");
await page.locator(".mx-name-textBox1 input").fill("test", { force: true });
Expand All @@ -123,7 +123,7 @@
}) => {
await page.click(".mx-name-actionButton2");
await page.click(".mx-name-actionButton2");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
await page.click(".mx-name-radioButtons2 input:first-child");
await page.click(".mx-name-radioButtons2 input:first-child");
await page.click(".mx-name-radioButtons1 input:first-child");
Expand Down
4 changes: 2 additions & 2 deletions packages/pluggableWidgets/accordion-web/e2e/Accordion.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import { test, expect } from "@playwright/test";
import { expect, test } from "@playwright/test";

test.describe("Accordion", () => {
test.beforeEach(async ({ page }) => {
await page.goto("/");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
});

test("compares with a screenshot baseline and checks if all accordion elements are rendered as expected", async ({
Expand Down
4 changes: 2 additions & 2 deletions packages/pluggableWidgets/badge-button-web/e2e/dataTypes.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { test, expect } from "@playwright/test";
import { expect, test } from "@playwright/test";

test.afterEach("Cleanup session", async ({ page }) => {
// Because the test isolation that will open a new session for every test executed, and that exceeds Mendix's license limit of 5 sessions, so we need to force logout after each test.
Expand All @@ -8,7 +8,7 @@ test.afterEach("Cleanup session", async ({ page }) => {
test.describe("BadgeButton different data types", () => {
test.beforeEach(async ({ page }) => {
await page.goto("p/dataTypes");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
});

test("displays correctly string data", async ({ page }) => {
Expand Down
10 changes: 5 additions & 5 deletions packages/pluggableWidgets/badge-button-web/e2e/differentViews.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { test, expect } from "@playwright/test";
import { expect, test } from "@playwright/test";

test.afterEach("Cleanup session", async ({ page }) => {
// Because the test isolation that will open a new session for every test executed, and that exceeds Mendix's license limit of 5 sessions, so we need to force logout after each test.
Expand All @@ -11,7 +11,7 @@ test.skip(process.env.MODERN_CLIENT === true, () => {
test.describe("listen to grid", () => {
test.beforeEach(async ({ page }) => {
await page.goto("p/listenToGrid");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
});

test("displays correctly when listening a data grid", async ({ page }) => {
Expand All @@ -26,7 +26,7 @@ test.skip(process.env.MODERN_CLIENT === true, () => {
test.describe("listview", () => {
test.beforeEach(async ({ page }) => {
await page.goto("p/listView");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
});

test("displays correctly in a list view", async ({ page }) => {
Expand All @@ -46,7 +46,7 @@ test.skip(process.env.MODERN_CLIENT === true, () => {
test.describe("template grid", () => {
test.beforeEach(async ({ page }) => {
await page.goto("p/templateGrid");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
});

test("displays correctly in a template grid", async ({ page }) => {
Expand All @@ -67,7 +67,7 @@ test.skip(process.env.MODERN_CLIENT === true, () => {
test.describe("tab container", () => {
test.beforeEach(async ({ page }) => {
await page.goto("p/tabContainer");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
});

test("displays correctly in default tab", async ({ page }) => {
Expand Down
4 changes: 2 additions & 2 deletions packages/pluggableWidgets/badge-button-web/e2e/onClick.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { test, expect } from "@playwright/test";
import { expect, test } from "@playwright/test";

test.afterEach("Cleanup session", async ({ page }) => {
// Because the test isolation that will open a new session for every test executed, and that exceeds Mendix's license limit of 5 sessions, so we need to force logout after each test.
Expand All @@ -9,7 +9,7 @@ test.describe("BadgeButton on click", () => {
test.describe("call microflow", () => {
test.beforeEach(async ({ page }) => {
await page.goto("p/events");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
});

test("displays a dialog", async ({ page }) => {
Expand Down
4 changes: 2 additions & 2 deletions packages/pluggableWidgets/badge-button-web/e2e/render.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { test, expect } from "@playwright/test";
import { expect, test } from "@playwright/test";

test.afterEach("Cleanup session", async ({ page }) => {
// Because the test isolation that will open a new session for every test executed, and that exceeds Mendix's license limit of 5 sessions, so we need to force logout after each test.
Expand All @@ -8,7 +8,7 @@ test.afterEach("Cleanup session", async ({ page }) => {
test.describe("BadgeButton", () => {
test.beforeEach(async ({ page }) => {
await page.goto("/");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
});

test("displays correctly dynamic data", async ({ page }) => {
Expand Down
Binary file added ...ton-web/e2e/render.spec.js-snapshots/badgeButtonPageContent-chromium-darwin.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 2 additions & 2 deletions packages/pluggableWidgets/barcode-generator-web/e2e/BarcodeGenerator.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { test, expect } from "@playwright/test";
import { expect, test } from "@playwright/test";

test.afterEach("Cleanup session", async ({ page }) => {
// Because the test isolation that will open a new session for every test executed, and that exceeds Mendix's license limit of 5 sessions, so we need to force logout after each test.
Expand All @@ -8,7 +8,7 @@ test.afterEach("Cleanup session", async ({ page }) => {
test.describe("BarcodeGenerator", () => {
test.beforeEach(async ({ page }) => {
await page.goto("/");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
});

test("renders barcode generator widget", async ({ page }) => {
Expand Down
4 changes: 2 additions & 2 deletions packages/pluggableWidgets/checkbox-radio-selection-web/e2e/SelectionControls.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { test, expect } from "@playwright/test";
import { expect, test } from "@playwright/test";

test.afterEach("Cleanup session", async ({ page }) => {
// Because the test isolation that will open a new session for every test executed, and that exceeds Mendix's license limit of 5 sessions, so we need to force logout after each test.
Expand All @@ -8,7 +8,7 @@ test.afterEach("Cleanup session", async ({ page }) => {
test.describe("checkbox-radio-selection-web", () => {
test.beforeEach(async ({ page }) => {
await page.goto("/p/checkboxradioselection");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
await page.click(".mx-name-actionButton1");
});

Expand Down
14 changes: 7 additions & 7 deletions packages/pluggableWidgets/color-picker-web/e2e/ColorPicker.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { test, expect } from "@playwright/test";
import { expect, test } from "@playwright/test";

test.afterEach("Cleanup session", async ({ page }) => {
// Because the test isolation that will open a new session for every test executed, and that exceeds Mendix's license limit of 5 sessions, so we need to force logout after each test.
Expand All @@ -11,7 +11,7 @@ test.describe("color-picker-web", () => {
const isFirefox = browserName === "firefox";

await page.goto("/p/modePage");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();

if (!isFirefox) {
const colorPicker = await page.locator(".mx-name-colorPicker3 .widget-color-picker-inner");
Expand All @@ -28,15 +28,15 @@ test.describe("color-picker-web", () => {

test("input box", async ({ page }) => {
await page.goto("/p/modePage");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
await page.click(".mx-name-tabPage2");
const inputBox = await page.locator(".mx-name-colorPicker17 input");
await expect(inputBox).toHaveValue("#4caf50");
});

test("inline", async ({ page }) => {
await page.goto("/p/modePage");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
await page.click(".mx-name-tabPage3");
const inlinePicker = await page.locator(".mx-name-colorPicker27 .sketch-picker");
await expect(inlinePicker).toBeVisible();
Expand All @@ -46,7 +46,7 @@ test.describe("color-picker-web", () => {
test.describe("renders a picker of type", () => {
test.beforeEach(async ({ page }) => {
await page.goto("/p/modePage");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
await page.click(".mx-name-tabPage3");
});

Expand Down Expand Up @@ -109,14 +109,14 @@ test.describe("color-picker-web", () => {
test.describe("renders with color format as", () => {
test.beforeEach(async ({ page }) => {
await page.goto("/p/colorFormat");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
});

test.fixme("hex", async ({ page }) => {
const hexInput = await page.locator(".mx-name-colorPicker24 input");
await expect(hexInput).toBeVisible();
await page.reload();
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
await expect(hexInput).toBeVisible({ timeout: 10000 });
await expect(hexInput).toBeEnabled({ timeout: 10000 });
await expect(hexInput).toBeEditable({ timeout: 10000 });
Expand Down
6 changes: 3 additions & 3 deletions packages/pluggableWidgets/column-chart-web/e2e/ColumnChart.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { test, expect } from "@playwright/test";
import { expect, test } from "@playwright/test";

test.afterEach("Cleanup session", async ({ page }) => {
// Because the test isolation that will open a new session for every test executed, and that exceeds Mendix's license limit of 5 sessions, so we need to force logout after each test.
Expand All @@ -8,9 +8,9 @@ test.afterEach("Cleanup session", async ({ page }) => {
test.describe("column-chart-web", () => {
test.beforeEach(async ({ page }) => {
await page.goto("/");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
await page.locator(".mx-name-actionButton1").click();
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
});

test.describe("column color", () => {
Expand Down
4 changes: 2 additions & 2 deletions packages/pluggableWidgets/combobox-web/e2e/Combobox.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,9 @@ test.afterEach("Cleanup session", async ({ page }) => {
test.describe("combobox-web", () => {
test.beforeEach(async ({ page }) => {
await page.goto("/p/combobox");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
await page.click(".mx-name-actionButton1");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
});

test.describe("data source types", () => {
Expand Down
6 changes: 3 additions & 3 deletions packages/pluggableWidgets/datagrid-date-filter-web/e2e/DataGridDateFilter.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { test, expect } from "@playwright/test";
import { expect, test } from "@playwright/test";
import AxeBuilder from "@axe-core/playwright";

test.afterEach("Cleanup session", async ({ page }) => {
Expand All @@ -9,7 +9,7 @@ test.afterEach("Cleanup session", async ({ page }) => {
test.describe("datagrid-date-filter-web", () => {
test.beforeEach(async ({ page }) => {
await page.goto("/");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
});

test.describe("visual testing:", () => {
Expand Down Expand Up @@ -90,7 +90,7 @@ test.describe("datagrid-date-filter-web", () => {
test.describe("a11y testing:", () => {
test("checks accessibility violations", async ({ page }) => {
await page.goto("/");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();

const accessibilityScanResults = await new AxeBuilder({ page })
.withTags(["wcag21aa"])
Expand Down
6 changes: 3 additions & 3 deletions packages/pluggableWidgets/datagrid-dropdown-filter-web/e2e/DataGridDropDownFilter.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ test.afterEach("Cleanup session", async ({ page }) => {
test.describe("datagrid-dropdown-filter-web", () => {
test.beforeEach(async ({ page }) => {
await page.goto("/");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
});

test.describe("visual testing:", () => {
Expand Down Expand Up @@ -77,7 +77,7 @@ test.describe("datagrid-dropdown-filter-web", () => {
test.describe("with Default value", () => {
test.beforeEach(async ({ page }) => {
await page.goto("/p/filter_init_condition");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
});

test("in single mode, set init condition for boolean", async ({ page }) => {
Expand Down Expand Up @@ -194,7 +194,7 @@ test.describe("with Default value", () => {
test.describe("a11y testing:", () => {
test("checks accessibility violations", async ({ page }) => {
await page.goto("/");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();

const accessibilityScanResults = await new AxeBuilder({ page })
.withTags(["wcag21aa"])
Expand Down
4 changes: 2 additions & 2 deletions ...uggableWidgets/datagrid-dropdown-filter-web/e2e/DataGridDropDownFilterAssociation.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { test, expect } from "@playwright/test";
import { expect, test } from "@playwright/test";

test.afterEach("Cleanup session", async ({ page }) => {
// Because the test isolation that will open a new session for every test executed, and that exceeds Mendix's license limit of 5 sessions, so we need to force logout after each test.
Expand All @@ -8,7 +8,7 @@ test.afterEach("Cleanup session", async ({ page }) => {
test.describe("datagrid-dropdown-filter-web", () => {
test.beforeEach(async ({ page }) => {
await page.goto("/p/associations-filter");
await page.waitForLoadState("networkidle");
await page.locator(".mx-page").waitFor();
});

test.describe("single select", () => {
Expand Down
Loading
Loading