Skip to content

Commit 55b0a72

Browse files
committed
fix: update e2e tests
1 parent 0e89564 commit 55b0a72

File tree

8 files changed

+63
-46
lines changed

8 files changed

+63
-46
lines changed

packages/pluggableWidgets/datagrid-dropdown-filter-web/e2e/DataGridDropDownFilter.spec.js

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -26,25 +26,25 @@ test.describe("datagrid-dropdown-filter-web", () => {
2626

2727
test.describe("using enumeration as attribute", () => {
2828
test("shows the expected result", async ({ page }) => {
29-
await page.click(".mx-name-datagrid1 .mx-name-dataGridDrop_downFilter1");
30-
await page.waitForSelector(".widget-dropdown-filter-menu-slot > ul > li:nth-child(2)");
31-
await page.click(".widget-dropdown-filter-menu-slot > ul > li:nth-child(2)");
29+
await page.locator(".mx-name-datagrid1 .mx-name-dataGridDrop_downFilter1").click({ delay: 1 });
30+
await page.waitForSelector(".widget-dropdown-filter-menu-slot > ul > li:nth-child(1)");
31+
await page.locator(".widget-dropdown-filter-menu-slot > ul > li:nth-child(1)").click({ delay: 1 });
3232
await page.waitForTimeout(300); // wait for filter to apply
33-
await page.click("#DataGrid4-column0");
33+
await page.locator("#DataGrid4-column0").click({ delay: 1 });
3434
const cells = await page.$$eval(".mx-name-datagrid1 .td", elements =>
3535
elements.map(element => element.textContent)
3636
);
3737
await expect(cells).toEqual(["10", "test", "test", "Yes", ""]);
3838
});
3939

4040
test("shows the expected result with multiple selected items", async ({ page }) => {
41-
await page.click(".mx-name-datagrid1 .mx-name-dataGridDrop_downFilter1");
41+
await page.locator(".mx-name-datagrid1 .mx-name-dataGridDrop_downFilter1").click({ delay: 1 });
42+
await page.waitForSelector(".widget-dropdown-filter-menu-slot > ul > li:nth-child(1)");
43+
await page.locator(".widget-dropdown-filter-menu-slot > ul > li:nth-child(1)").click({ delay: 1 });
4244
await page.waitForSelector(".widget-dropdown-filter-menu-slot > ul > li:nth-child(2)");
43-
await page.click(".widget-dropdown-filter-menu-slot > ul > li:nth-child(2)");
44-
await page.waitForSelector(".widget-dropdown-filter-menu-slot > ul > li:nth-child(3)");
45-
await page.click(".widget-dropdown-filter-menu-slot > ul > li:nth-child(3)");
45+
await page.locator(".widget-dropdown-filter-menu-slot > ul > li:nth-child(2)").click({ delay: 1 });
4646
await page.waitForTimeout(300); // wait for filter to apply
47-
await page.click("#DataGrid4-column0");
47+
await page.locator("#DataGrid4-column0").click({ delay: 1 });
4848
const cells = await page.$$eval(".mx-name-datagrid1 .td", elements =>
4949
elements.map(element => element.textContent)
5050
);
@@ -54,20 +54,20 @@ test.describe("datagrid-dropdown-filter-web", () => {
5454

5555
test.describe("using boolean as attribute", () => {
5656
test("shows the expected result", async ({ page }) => {
57-
await page.getByRole("combobox", { name: "Empty" }).click();
57+
await page.getByRole("combobox", { name: "Select me" }).click({ delay: 1 });
5858
const dropdownItem = await page.locator(".widget-dropdown-filter-menu-slot > ul > li:nth-child(3)");
5959
await expect(dropdownItem).toHaveText("No");
60-
await dropdownItem.click();
61-
await page.locator("#DataGrid4-column1").click();
60+
await dropdownItem.click({ delay: 1 });
61+
await page.locator("#DataGrid4-column1").click({ delay: 1 });
6262
const cells = await page.locator(".mx-name-datagrid1 .tr");
6363
expect(cells).toHaveCount(1);
6464
});
6565

6666
test("shows no results when no items selected", async ({ page }) => {
67-
await page.getByRole("combobox", { name: "Empty" }).click();
67+
await page.getByRole("combobox", { name: "Select me" }).click({ delay: 1 });
6868
const dropdownItem = await page.locator(".widget-dropdown-filter-menu-slot > ul > li:nth-child(1)"); //the first item means none selected
69-
await dropdownItem.click();
70-
await page.locator("#DataGrid4-column1").click();
69+
await dropdownItem.click({ delay: 1 });
70+
await page.locator("#DataGrid4-column1").click({ delay: 1 });
7171
const cells = await page.locator(".mx-name-datagrid1 .tr");
7272
expect(cells).toHaveCount(4);
7373
});

packages/pluggableWidgets/datagrid-dropdown-filter-web/e2e/DataGridDropDownFilterAssociation.spec.js

Lines changed: 25 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -15,25 +15,25 @@ test.describe("datagrid-dropdown-filter-web", () => {
1515
test("show list of Companies with empty option on top of the list", async ({ page }) => {
1616
const menu = () => page.locator("text=FMC Corp");
1717

18-
await page.locator(".mx-name-drop_downFilter2").click();
18+
await page.locator(".mx-name-drop_downFilter2").click({ delay: 1 });
1919
await expect(menu()).toBeVisible();
2020
const list = page.locator(".widget-dropdown-filter-menu-slot > ul > li");
2121
await expect(list).toHaveCount(21);
22-
await expect(list.nth(0)).toHaveText("None");
22+
await expect(list.nth(0)).toHaveText("Nada");
2323
await expect(list.nth(2)).toHaveText("FMC Corp");
2424
await expect(list.nth(20)).toHaveText("PETsMART Inc");
2525
});
2626

2727
test("set value after option is clicked", async ({ page }) => {
28-
const select = () => page.getByRole("columnheader", { name: "sort Company" }).getByLabel("Search");
28+
const select = () => page.getByRole("combobox", { name: "Select company" });
2929
const toggle = page.locator(".widget-dropdown-filter-toggle");
3030
const menu = () => page.locator("text=FMC Corp");
3131
const option1 = () => page.getByRole("option", { name: "Brown-Forman Corporation" });
32-
const clickOutside = async () => page.locator("body").click();
32+
const clickOutside = async () => page.locator("body").click({ delay: 1 });
3333

34-
await select().click();
34+
await select().click({ delay: 1 });
3535
await expect(menu()).toBeVisible();
36-
await option1().click();
36+
await option1().click({ delay: 1 });
3737
await expect(toggle.nth(3)).toHaveText("Brown-Forman Corporation");
3838
await clickOutside();
3939
await expect(menu()).not.toBeVisible();
@@ -44,26 +44,29 @@ test.describe("datagrid-dropdown-filter-web", () => {
4444
});
4545

4646
test.describe("multiselect", () => {
47+
let select;
48+
let menu;
49+
test.beforeEach(async ({ page }) => {
50+
select = () => page.getByRole("combobox", { name: "Select role" });
51+
menu = () => select().getByRole("listbox");
52+
});
4753
test("shows list of Roles", async ({ page }) => {
48-
const select = () => page.getByRole("columnheader", { name: "Roles" }).getByLabel("Search");
49-
const menu = () => page.locator("text=Economist");
50-
const option1 = () => page.getByRole("option", { name: "Economist" });
51-
const option2 = () => page.getByRole("option", { name: "Public librarian" });
52-
const option3 = () => page.getByRole("option", { name: "Prison officer" });
54+
const option1 = () => menu().getByRole("option", { name: "Economist" });
55+
const option2 = () => menu().getByRole("option", { name: "Public librarian" });
56+
const option3 = () => menu().getByRole("option", { name: "Prison officer" });
5357

54-
await select().click();
58+
await select().click({ delay: 1 });
5559
await expect(menu().first()).toBeVisible();
5660
await expect(option1()).toBeVisible();
5761
await expect(option2()).toBeVisible();
5862
await expect(option3()).toBeVisible();
5963
});
6064

6165
test("does filtering when option is checked", async ({ page }) => {
62-
const select = () => page.getByRole("columnheader", { name: "Roles" }).getByLabel("Search");
63-
const option2 = () => page.getByRole("option", { name: "Public librarian" });
66+
const option2 = () => menu().getByRole("option", { name: "Public librarian" });
6467

65-
await select().click();
66-
await option2().click();
68+
await select().click({ delay: 1 });
69+
await option2().click({ delay: 1 });
6770
const rows = page.locator(".mx-name-dataGrid21 .tr");
6871
await expect(rows).toHaveCount(5); // 4 rows + 1 header row
6972
});
@@ -75,7 +78,7 @@ test.describe("datagrid-dropdown-filter-web", () => {
7578
const menu = () => page.getByRole("option", { name: "Environmental scientist" });
7679
const clickOutside = async () => (await page.locator("body")).click();
7780

78-
await select().click();
81+
await select().click({ delay: 1 });
7982
const checkedOptions = await menu().locator("input:checked");
8083
await expect(checkedOptions).toHaveCount(0);
8184
await clickOutside();
@@ -88,8 +91,8 @@ test.describe("datagrid-dropdown-filter-web", () => {
8891
const menu = () => page.getByRole("option", { name: "Environmental scientist" });
8992
const option1 = () => page.getByRole("option", { name: "Environmental scientist" });
9093

91-
await select().click();
92-
await option1().click();
94+
await select().click({ delay: 1 });
95+
await option1().click({ delay: 1 });
9396
const checkedOptions = await menu().locator("input:checked");
9497
await expect(checkedOptions).toHaveCount(1);
9598
await expect(checkedOptions.first()).toBeChecked();
@@ -106,9 +109,9 @@ test.describe("datagrid-dropdown-filter-web", () => {
106109
const option1 = () => page.getByRole("option", { name: "Environmental scientist" });
107110
const option2 = () => page.getByRole("option", { name: "Trader" });
108111

109-
await select().click();
110-
await option1().click();
111-
await option2().click();
112+
await select().click({ delay: 1 });
113+
await option1().click({ delay: 1 });
114+
await option2().click({ delay: 1 });
112115
const checkedOptions = await menu().locator("input:checked");
113116
await expect(checkedOptions).toHaveCount(2);
114117
await expect(checkedOptions.first()).toBeChecked();

packages/pluggableWidgets/datagrid-dropdown-filter-web/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
},
2424
"testProject": {
2525
"githubUrl": "https://github.com/mendix/testProjects",
26-
"branchName": "datagrid-dropdown-filter-web/data-widgets-3.0"
26+
"branchName": "datagrid-dropdown-filter-web/dw3.0-dropdown-rework"
2727
},
2828
"scripts": {
2929
"build": "pluggable-widgets-tools build:ts",

packages/pluggableWidgets/datagrid-dropdown-filter-web/src/DatagridDropdownFilter.xml

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -104,6 +104,10 @@
104104
<property key="emptyOptionCaption" type="textTemplate" required="false">
105105
<caption>Empty option caption</caption>
106106
<description />
107+
<translations>
108+
<translation lang="en_US">None</translation>
109+
<translation lang="nl_NL">Niets</translation>
110+
</translations>
107111
</property>
108112
<property key="clearable" type="boolean" defaultValue="true">
109113
<caption>Clearable</caption>
@@ -152,11 +156,19 @@
152156
<propertyGroup caption="Texts">
153157
<property key="emptySelectionCaption" type="textTemplate" required="false">
154158
<caption>Empty selection caption</caption>
155-
<description>This text is shown if no options are selected. For example 'No options are selected' or 'Select color'.</description>
159+
<description>This text is shown if no options are selected. For example 'Select color' or 'No options are selected'.</description>
160+
<translations>
161+
<translation lang="en_US">Select</translation>
162+
<translation lang="nl_NL">Selecteer</translation>
163+
</translations>
156164
</property>
157165
<property key="filterInputPlaceholderCaption" type="textTemplate" required="false">
158166
<caption>Filter input placeholder</caption>
159-
<description>This text is shown as placeholder for filterable filters. For example 'type to search'.</description>
167+
<description>This text is shown as placeholder for filterable filters. For example 'Type to search'.</description>
168+
<translations>
169+
<translation lang="en_US">Search</translation>
170+
<translation lang="nl_NL">Zoeken</translation>
171+
</translations>
160172
</property>
161173
</propertyGroup>
162174
</propertyGroup>

packages/pluggableWidgets/gallery-web/e2e/Gallery.spec.js

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@ test.describe("gallery-web", () => {
3434
const textFilter = ".mx-name-gallery1 .form-control";
3535

3636
await page.locator(textFilter).first().fill("Leo");
37+
await page.waitForTimeout(1000); // wait for filter to apply
3738
await expect(page.locator(gallery)).toHaveScreenshot(`galleryTextFilter.png`);
3839
});
3940

@@ -55,12 +56,13 @@ test.describe("gallery-web", () => {
5556
});
5657

5758
test("filters by enum (dropdown)", async ({ page }) => {
58-
const gallery = ".mx-name-gallery1";
59-
const dropdown = ".mx-name-gallery1 .mx-name-drop_downFilter1";
59+
const gallery = page.locator(".mx-name-gallery1");
60+
const dropdown = gallery.getByRole("combobox", { name: "Select a role" });
6061

61-
await page.locator(dropdown).first().click();
62-
await page.locator(".widget-dropdown-filter-menu-slot > ul > li").nth(4).click();
63-
await expect(page.locator(gallery)).toHaveScreenshot(`galleryDropdownFilter.png`);
62+
await dropdown.click({ delay: 1 });
63+
await dropdown.getByRole("listbox").getByRole("option", { name: "QA Engineer" }).click({ delay: 1 });
64+
await page.waitForTimeout(1000); // wait for filter to apply
65+
await expect(gallery).toHaveScreenshot(`galleryDropdownFilter.png`);
6466
});
6567
});
6668

packages/pluggableWidgets/gallery-web/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
},
2424
"testProject": {
2525
"githubUrl": "https://github.com/mendix/testProjects",
26-
"branchName": "gallery-web/data-widgets-3.0"
26+
"branchName": "gallery-web/dw3.0-dropdown-rework"
2727
},
2828
"scripts": {
2929
"build": "pluggable-widgets-tools build:web",

0 commit comments

Comments
 (0)