@@ -15,7 +15,7 @@ test.describe("datagrid-dropdown-filter-web", () => {
15
15
test ( "show list of Companies with empty option on top of the list" , async ( { page } ) => {
16
16
const menu = ( ) => page . locator ( "text=FMC Corp" ) ;
17
17
18
- await page . locator ( ".mx-name-drop_downFilter2" ) . click ( ) ;
18
+ await page . locator ( ".mx-name-drop_downFilter2" ) . click ( { delay : 1 } ) ;
19
19
await expect ( menu ( ) ) . toBeVisible ( ) ;
20
20
const list = page . locator ( ".widget-dropdown-filter-menu-slot > ul > li" ) ;
21
21
await expect ( list ) . toHaveCount ( 21 ) ;
@@ -25,15 +25,15 @@ test.describe("datagrid-dropdown-filter-web", () => {
25
25
} ) ;
26
26
27
27
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 : "Company column filter " } ) ;
29
29
const toggle = page . locator ( ".widget-dropdown-filter-toggle" ) ;
30
30
const menu = ( ) => page . locator ( "text=FMC Corp" ) ;
31
31
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 } ) ;
33
33
34
- await select ( ) . click ( ) ;
34
+ await select ( ) . click ( { delay : 1 } ) ;
35
35
await expect ( menu ( ) ) . toBeVisible ( ) ;
36
- await option1 ( ) . click ( ) ;
36
+ await option1 ( ) . click ( { delay : 1 } ) ;
37
37
await expect ( toggle . nth ( 3 ) ) . toHaveText ( "Brown-Forman Corporation" ) ;
38
38
await clickOutside ( ) ;
39
39
await expect ( menu ( ) ) . not . toBeVisible ( ) ;
@@ -45,25 +45,25 @@ test.describe("datagrid-dropdown-filter-web", () => {
45
45
46
46
test . describe ( "multiselect" , ( ) => {
47
47
test ( "shows list of Roles" , async ( { page } ) => {
48
- const select = ( ) => page . getByRole ( "columnheader " , { name : "Roles " } ) . getByLabel ( "Search" ) ;
48
+ const select = ( ) => page . getByRole ( "combobox " , { name : "Role column filter " } ) ;
49
49
const menu = ( ) => page . locator ( "text=Economist" ) ;
50
50
const option1 = ( ) => page . getByRole ( "option" , { name : "Economist" } ) ;
51
51
const option2 = ( ) => page . getByRole ( "option" , { name : "Public librarian" } ) ;
52
52
const option3 = ( ) => page . getByRole ( "option" , { name : "Prison officer" } ) ;
53
53
54
- await select ( ) . click ( ) ;
54
+ await select ( ) . click ( { delay : 1 } ) ;
55
55
await expect ( menu ( ) . first ( ) ) . toBeVisible ( ) ;
56
56
await expect ( option1 ( ) ) . toBeVisible ( ) ;
57
57
await expect ( option2 ( ) ) . toBeVisible ( ) ;
58
58
await expect ( option3 ( ) ) . toBeVisible ( ) ;
59
59
} ) ;
60
60
61
61
test ( "does filtering when option is checked" , async ( { page } ) => {
62
- const select = ( ) => page . getByRole ( "columnheader " , { name : "Roles " } ) . getByLabel ( "Search" ) ;
62
+ const select = ( ) => page . getByRole ( "combobox " , { name : "Role column filter " } ) ;
63
63
const option2 = ( ) => page . getByRole ( "option" , { name : "Public librarian" } ) ;
64
64
65
- await select ( ) . click ( ) ;
66
- await option2 ( ) . click ( ) ;
65
+ await select ( ) . click ( { delay : 1 } ) ;
66
+ await option2 ( ) . click ( { delay : 1 } ) ;
67
67
const rows = page . locator ( ".mx-name-dataGrid21 .tr" ) ;
68
68
await expect ( rows ) . toHaveCount ( 5 ) ; // 4 rows + 1 header row
69
69
} ) ;
@@ -73,9 +73,9 @@ test.describe("datagrid-dropdown-filter-web", () => {
73
73
test ( "open menu with no options selected" , async ( { page } ) => {
74
74
const select = ( ) => page . locator ( ".mx-name-drop_downFilter1" ) ;
75
75
const menu = ( ) => page . getByRole ( "option" , { name : "Environmental scientist" } ) ;
76
- const clickOutside = async ( ) => ( await page . locator ( "body" ) ) . click ( ) ;
76
+ const clickOutside = async ( ) => ( await page . locator ( "body" ) ) . click ( { delay : 1 } ) ;
77
77
78
- await select ( ) . click ( ) ;
78
+ await select ( ) . click ( { delay : 1 } ) ;
79
79
const checkedOptions = await menu ( ) . locator ( "input:checked" ) ;
80
80
await expect ( checkedOptions ) . toHaveCount ( 0 ) ;
81
81
await clickOutside ( ) ;
@@ -88,8 +88,8 @@ test.describe("datagrid-dropdown-filter-web", () => {
88
88
const menu = ( ) => page . getByRole ( "option" , { name : "Environmental scientist" } ) ;
89
89
const option1 = ( ) => page . getByRole ( "option" , { name : "Environmental scientist" } ) ;
90
90
91
- await select ( ) . click ( ) ;
92
- await option1 ( ) . click ( ) ;
91
+ await select ( ) . click ( { delay : 1 } ) ;
92
+ await option1 ( ) . click ( { delay : 1 } ) ;
93
93
const checkedOptions = await menu ( ) . locator ( "input:checked" ) ;
94
94
await expect ( checkedOptions ) . toHaveCount ( 1 ) ;
95
95
await expect ( checkedOptions . first ( ) ) . toBeChecked ( ) ;
@@ -106,9 +106,9 @@ test.describe("datagrid-dropdown-filter-web", () => {
106
106
const option1 = ( ) => page . getByRole ( "option" , { name : "Environmental scientist" } ) ;
107
107
const option2 = ( ) => page . getByRole ( "option" , { name : "Trader" } ) ;
108
108
109
- await select ( ) . click ( ) ;
110
- await option1 ( ) . click ( ) ;
111
- await option2 ( ) . click ( ) ;
109
+ await select ( ) . click ( { delay : 1 } ) ;
110
+ await option1 ( ) . click ( { delay : 1 } ) ;
111
+ await option2 ( ) . click ( { delay : 1 } ) ;
112
112
const checkedOptions = await menu ( ) . locator ( "input:checked" ) ;
113
113
await expect ( checkedOptions ) . toHaveCount ( 2 ) ;
114
114
await expect ( checkedOptions . first ( ) ) . toBeChecked ( ) ;
0 commit comments