Skip to content

Commit 3e75bfd

Browse files
wdevfxwdevfx
authored
DataGrid(T1293295) - Individually selecting all header filter options deselects all options (#30499) (#30528)
1 parent 65dfde7 commit 3e75bfd

File tree

5 files changed

+409
-58
lines changed

5 files changed

+409
-58
lines changed

‎e2e/testcafe-devextreme/tests/dataGrid/common/headerFilter/headerFilter.ts‎

Lines changed: 0 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -284,39 +284,6 @@ test('Data should be filtered if True is selected in the header filter when case
284284
headerFilter: { visible: true },
285285
}));
286286

287-
test('[T1284200] Should handle dxList "selectAll" when has unselected items on the second page', async (t) => {
288-
const dataGrid = new DataGrid(GRID_CONTAINER);
289-
const headerCell = dataGrid.getHeaders()
290-
.getHeaderRow(0)
291-
.getHeaderCell(0);
292-
const filterIconElement = headerCell.getFilterIcon();
293-
const headerFilter = new HeaderFilter();
294-
const list = headerFilter.getList();
295-
296-
await t
297-
.click(filterIconElement)
298-
.click(list.selectAll.checkBox.element);
299-
300-
await t.expect(list.selectAll.checkBox.isChecked).ok();
301-
302-
await t.click(list.selectAll.checkBox.element);
303-
304-
await t.expect(list.selectAll.checkBox.isChecked).notOk();
305-
}).before(async () => createWidget('dxDataGrid', {
306-
dataSource: new Array(100).fill(null).map((_, idx) => ({
307-
id: idx,
308-
})),
309-
keyExpr: 'id',
310-
columns: [{
311-
dataField: 'id',
312-
filterType: 'exclude',
313-
filterValues: [70],
314-
}],
315-
headerFilter: {
316-
visible: true,
317-
},
318-
}));
319-
320287
test('Header filter search input loses focus on first key in datetime columns (T1284663)', async (t) => {
321288
const dataGrid = new DataGrid('#container');
322289
const headerCell = dataGrid.getHeaders()

‎e2e/testcafe-devextreme/tests/dataGrid/common/headerFilter/headerFilterList.ts‎

Lines changed: 327 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,327 @@
1+
import DataGrid from 'devextreme-testcafe-models/dataGrid';
2+
import HeaderFilter from 'devextreme-testcafe-models/dataGrid/headers/headerFilter';
3+
import url from '../../../../helpers/getPageUrl';
4+
import { createWidget } from '../../../../helpers/createWidget';
5+
6+
fixture.disablePageReloads`Header Filter - dxList integration`
7+
.page(url(__dirname, '../../../container.html'));
8+
9+
const GRID_CONTAINER = '#container';
10+
11+
const openHeaderFilterAndGetList = async (t: TestController, dataGrid: DataGrid) => {
12+
const headerCell = dataGrid.getHeaders()
13+
.getHeaderRow(0)
14+
.getHeaderCell(0);
15+
const filterIconElement = headerCell.getFilterIcon();
16+
const headerFilter = new HeaderFilter();
17+
const list = headerFilter.getList();
18+
const firstListItem = list.getItem(0);
19+
const secondListItem = list.getItem(1);
20+
21+
await t
22+
.click(filterIconElement);
23+
24+
return { list, firstListItem, secondListItem };
25+
};
26+
27+
test('Should has unchecked "Select all" checkbox state if no values is selected', async (t) => {
28+
const dataGrid = new DataGrid(GRID_CONTAINER);
29+
const { list, firstListItem, secondListItem } = await openHeaderFilterAndGetList(t, dataGrid);
30+
31+
await t
32+
.expect(await list.selectAll.checkBox.getCheckBoxState())
33+
.eql('unchecked')
34+
.expect(firstListItem.isSelected)
35+
.notOk()
36+
.expect(secondListItem.isSelected)
37+
.notOk();
38+
}).before(async () => createWidget('dxDataGrid', {
39+
dataSource: [
40+
{ id: 0 },
41+
{ id: 1 },
42+
],
43+
keyExpr: 'id',
44+
columns: [
45+
{ dataField: 'id', filterValues: [] },
46+
],
47+
headerFilter: { visible: true },
48+
}));
49+
50+
test('Should has checked "Select all" checkbox state if all values selected', async (t) => {
51+
const dataGrid = new DataGrid(GRID_CONTAINER);
52+
const { list, firstListItem, secondListItem } = await openHeaderFilterAndGetList(t, dataGrid);
53+
54+
await t
55+
.expect(await list.selectAll.checkBox.getCheckBoxState())
56+
.eql('checked')
57+
.expect(firstListItem.isSelected)
58+
.ok()
59+
.expect(secondListItem.isSelected)
60+
.ok();
61+
}).before(async () => createWidget('dxDataGrid', {
62+
dataSource: [
63+
{ id: 0 },
64+
{ id: 1 },
65+
],
66+
keyExpr: 'id',
67+
columns: [
68+
{ dataField: 'id', filterType: 'exclude', filterValues: [] },
69+
],
70+
headerFilter: { visible: true },
71+
}));
72+
73+
test('Should has indeterminate "Select all" checkbox state if only part of values selected', async (t) => {
74+
const dataGrid = new DataGrid(GRID_CONTAINER);
75+
const { list, firstListItem, secondListItem } = await openHeaderFilterAndGetList(t, dataGrid);
76+
77+
await t
78+
.expect(await list.selectAll.checkBox.getCheckBoxState())
79+
.eql('indeterminate')
80+
.expect(firstListItem.isSelected)
81+
.ok()
82+
.expect(secondListItem.isSelected)
83+
.notOk();
84+
}).before(async () => createWidget('dxDataGrid', {
85+
dataSource: [
86+
{ id: 0 },
87+
{ id: 1 },
88+
],
89+
keyExpr: 'id',
90+
columns: [
91+
{ dataField: 'id', filterValues: [0] },
92+
],
93+
headerFilter: { visible: true },
94+
}));
95+
96+
test('Should has indeterminate "Select all" checkbox state if part of values excluded', async (t) => {
97+
const dataGrid = new DataGrid(GRID_CONTAINER);
98+
const { list, firstListItem, secondListItem } = await openHeaderFilterAndGetList(t, dataGrid);
99+
100+
await t
101+
.expect(await list.selectAll.checkBox.getCheckBoxState())
102+
.eql('indeterminate')
103+
.expect(firstListItem.isSelected)
104+
.ok()
105+
.expect(secondListItem.isSelected)
106+
.notOk();
107+
}).before(async () => createWidget('dxDataGrid', {
108+
dataSource: [
109+
{ id: 0 },
110+
{ id: 1 },
111+
],
112+
keyExpr: 'id',
113+
columns: [
114+
{ dataField: 'id', filterType: 'exclude', filterValues: [1] },
115+
],
116+
headerFilter: { visible: true },
117+
}));
118+
119+
test('Should has indeterminate "Select all" checkbox state if has not selected value on not first page [T1284200]', async (t) => {
120+
const dataGrid = new DataGrid(GRID_CONTAINER);
121+
const { list } = await openHeaderFilterAndGetList(t, dataGrid);
122+
123+
await t
124+
.expect(await list.selectAll.checkBox.getCheckBoxState())
125+
.eql('indeterminate');
126+
127+
const firstPageItemCount = await list.getItems().count;
128+
129+
for (let idx = 0; idx < firstPageItemCount; idx += 1) {
130+
await t
131+
.expect(list.getItem(idx).isSelected)
132+
.ok();
133+
}
134+
}).before(async () => createWidget('dxDataGrid', {
135+
dataSource: new Array(100)
136+
.map((_, idx) => ({ id: idx })),
137+
keyExpr: 'id',
138+
columns: [
139+
{ dataField: 'id', filterType: 'exclude', filterValues: [89] },
140+
],
141+
headerFilter: { visible: true },
142+
}));
143+
144+
test('Should select all values after unchecked "Select all" click', async (t) => {
145+
const dataGrid = new DataGrid(GRID_CONTAINER);
146+
const { list, firstListItem, secondListItem } = await openHeaderFilterAndGetList(t, dataGrid);
147+
148+
await t
149+
.click(list.selectAll.checkBox.element);
150+
151+
await t
152+
.expect(await list.selectAll.checkBox.getCheckBoxState())
153+
.eql('checked')
154+
.expect(firstListItem.isSelected)
155+
.ok()
156+
.expect(secondListItem.isSelected)
157+
.ok();
158+
}).before(async () => createWidget('dxDataGrid', {
159+
dataSource: [
160+
{ id: 0 },
161+
{ id: 1 },
162+
],
163+
keyExpr: 'id',
164+
columns: [
165+
{ dataField: 'id', filterValues: [] },
166+
],
167+
headerFilter: { visible: true },
168+
}));
169+
170+
test('Should unselect all values after checked "Select all" click', async (t) => {
171+
const dataGrid = new DataGrid(GRID_CONTAINER);
172+
const { list, firstListItem, secondListItem } = await openHeaderFilterAndGetList(t, dataGrid);
173+
174+
await t
175+
.click(list.selectAll.checkBox.element);
176+
177+
await t
178+
.expect(await list.selectAll.checkBox.getCheckBoxState())
179+
.eql('unchecked')
180+
.expect(firstListItem.isSelected)
181+
.notOk()
182+
.expect(secondListItem.isSelected)
183+
.notOk();
184+
}).before(async () => createWidget('dxDataGrid', {
185+
dataSource: [
186+
{ id: 0 },
187+
{ id: 1 },
188+
],
189+
keyExpr: 'id',
190+
columns: [
191+
{ dataField: 'id', filterType: 'exclude', filterValues: [] },
192+
],
193+
headerFilter: { visible: true },
194+
}));
195+
196+
test('Should select all values after indeterminate "Select all" click', async (t) => {
197+
const dataGrid = new DataGrid(GRID_CONTAINER);
198+
const { list, firstListItem, secondListItem } = await openHeaderFilterAndGetList(t, dataGrid);
199+
200+
await t
201+
.click(list.selectAll.checkBox.element);
202+
203+
await t
204+
.expect(await list.selectAll.checkBox.getCheckBoxState())
205+
.eql('checked')
206+
.expect(firstListItem.isSelected)
207+
.ok()
208+
.expect(secondListItem.isSelected)
209+
.ok();
210+
}).before(async () => createWidget('dxDataGrid', {
211+
dataSource: [
212+
{ id: 0 },
213+
{ id: 1 },
214+
],
215+
keyExpr: 'id',
216+
columns: [
217+
{ dataField: 'id', filterValues: [0] },
218+
],
219+
headerFilter: { visible: true },
220+
}));
221+
222+
test('Should change "Select all" to checked after selecting all values [T1293295]', async (t) => {
223+
const dataGrid = new DataGrid(GRID_CONTAINER);
224+
const { list, firstListItem, secondListItem } = await openHeaderFilterAndGetList(t, dataGrid);
225+
226+
await t
227+
.click(firstListItem.element)
228+
.click(secondListItem.element);
229+
230+
await t
231+
.expect(await list.selectAll.checkBox.getCheckBoxState())
232+
.eql('checked')
233+
.expect(firstListItem.isSelected)
234+
.ok()
235+
.expect(secondListItem.isSelected)
236+
.ok();
237+
}).before(async () => createWidget('dxDataGrid', {
238+
dataSource: [
239+
{ id: 0 },
240+
{ id: 1 },
241+
],
242+
keyExpr: 'id',
243+
columns: [
244+
{ dataField: 'id', filterValues: [] },
245+
],
246+
headerFilter: { visible: true },
247+
}));
248+
249+
test('Should change "Select all" to unchecked after unselecting all values', async (t) => {
250+
const dataGrid = new DataGrid(GRID_CONTAINER);
251+
const { list, firstListItem, secondListItem } = await openHeaderFilterAndGetList(t, dataGrid);
252+
253+
await t
254+
.click(firstListItem.element)
255+
.click(secondListItem.element);
256+
257+
await t
258+
.expect(await list.selectAll.checkBox.getCheckBoxState())
259+
.eql('unchecked')
260+
.expect(firstListItem.isSelected)
261+
.notOk()
262+
.expect(secondListItem.isSelected)
263+
.notOk();
264+
}).before(async () => createWidget('dxDataGrid', {
265+
dataSource: [
266+
{ id: 0 },
267+
{ id: 1 },
268+
],
269+
keyExpr: 'id',
270+
columns: [
271+
{ dataField: 'id', filterValues: [0, 1] },
272+
],
273+
headerFilter: { visible: true },
274+
}));
275+
276+
test('Should change "Select all" to unchecked after unselecting all values with exclude filter', async (t) => {
277+
const dataGrid = new DataGrid(GRID_CONTAINER);
278+
const { list, firstListItem, secondListItem } = await openHeaderFilterAndGetList(t, dataGrid);
279+
280+
await t
281+
.click(firstListItem.element)
282+
.click(secondListItem.element);
283+
284+
await t
285+
.expect(await list.selectAll.checkBox.getCheckBoxState())
286+
.eql('unchecked')
287+
.expect(firstListItem.isSelected)
288+
.notOk()
289+
.expect(secondListItem.isSelected)
290+
.notOk();
291+
}).before(async () => createWidget('dxDataGrid', {
292+
dataSource: [
293+
{ id: 0 },
294+
{ id: 1 },
295+
],
296+
keyExpr: 'id',
297+
columns: [
298+
{ dataField: 'id', filterType: 'exclude', filterValues: [] },
299+
],
300+
headerFilter: { visible: true },
301+
}));
302+
303+
test('Should change "Select all" to indeterminate after unselecting one value', async (t) => {
304+
const dataGrid = new DataGrid(GRID_CONTAINER);
305+
const { list, firstListItem, secondListItem } = await openHeaderFilterAndGetList(t, dataGrid);
306+
307+
await t
308+
.click(firstListItem.element);
309+
310+
await t
311+
.expect(await list.selectAll.checkBox.getCheckBoxState())
312+
.eql('indeterminate')
313+
.expect(firstListItem.isSelected)
314+
.notOk()
315+
.expect(secondListItem.isSelected)
316+
.ok();
317+
}).before(async () => createWidget('dxDataGrid', {
318+
dataSource: [
319+
{ id: 0 },
320+
{ id: 1 },
321+
],
322+
keyExpr: 'id',
323+
columns: [
324+
{ dataField: 'id', filterValues: [0, 1] },
325+
],
326+
headerFilter: { visible: true },
327+
}));

0 commit comments

Comments
 (0)