Skip to content

Commit 7011751

Browse files
Grids: stabilize KBN virtual scrolling tests (DevExpress#34401)
1 parent 06f0257 commit 7011751

3 files changed

Lines changed: 93 additions & 27 deletions

File tree

e2e/testcafe-devextreme/tests/dataGrid/common/keyboardNavigation/keyboardNavigation.functional.ts

Lines changed: 20 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -6195,8 +6195,8 @@ test('The last cell should be focused after changing the page size (T1063530)',
61956195
})();
61966196
});
61976197

6198-
test.meta({ unstable: true })(`Focus events should be called when pressing the Ctrl + End key when virtual scrolling and columns are enabled (scrolling.useNative = ${useNativeScrolling})`, async (t) => {
6199-
// arrange
6198+
test(`Focus events should be called when pressing the Ctrl + End key when virtual scrolling and columns are enabled (scrolling.useNative = ${useNativeScrolling})`, async (t) => {
6199+
// arrange
62006200
const dataGrid = new DataGrid('#container');
62016201

62026202
await t.expect(dataGrid.isReady()).ok();
@@ -6223,7 +6223,9 @@ test('The last cell should be focused after changing the page size (T1063530)',
62236223

62246224
// assert
62256225
await t
6226-
.expect(dataGrid.isReady())
6226+
.expect(dataGrid.isScrolledToBottom())
6227+
.ok()
6228+
.expect(dataGrid.isScrolledToRight())
62276229
.ok()
62286230
.expect(dataGrid.getDataCell(199, 34).element.focused)
62296231
.ok()
@@ -6276,8 +6278,8 @@ test('The last cell should be focused after changing the page size (T1063530)',
62766278
})();
62776279
});
62786280

6279-
test.meta({ unstable: true })(`Focus events should be called when pressing the Ctrl + End key when rowRenderingMode is 'virtual' (scrolling.useNative = ${useNativeScrolling})`, async (t) => {
6280-
// arrange
6281+
test(`Focus events should be called when pressing the Ctrl + End key when rowRenderingMode is 'virtual' (scrolling.useNative = ${useNativeScrolling})`, async (t) => {
6282+
// arrange
62816283
const dataGrid = new DataGrid('#container');
62826284

62836285
await t.expect(dataGrid.isReady()).ok();
@@ -6304,7 +6306,9 @@ test('The last cell should be focused after changing the page size (T1063530)',
63046306

63056307
// assert
63066308
await t
6307-
.expect(dataGrid.isReady())
6309+
.expect(dataGrid.isScrolledToBottom())
6310+
.ok()
6311+
.expect(dataGrid.isScrolledToRight())
63086312
.ok()
63096313
.expect(dataGrid.getDataCell(19, 14).element.focused)
63106314
.ok()
@@ -6356,8 +6360,8 @@ test('The last cell should be focused after changing the page size (T1063530)',
63566360
})();
63576361
});
63586362

6359-
test.meta({ unstable: true })(`Focus events should be called when pressing the Ctrl + End key when infinite scrolling is enabled (scrolling.useNative = ${useNativeScrolling})`, async (t) => {
6360-
// arrange
6363+
test(`Focus events should be called when pressing the Ctrl + End key when infinite scrolling is enabled (scrolling.useNative = ${useNativeScrolling})`, async (t) => {
6364+
// arrange
63616365
const dataGrid = new DataGrid('#container');
63626366

63636367
await t.expect(dataGrid.isReady()).ok();
@@ -6382,11 +6386,12 @@ test('The last cell should be focused after changing the page size (T1063530)',
63826386

63836387
// act
63846388
await t
6385-
.pressKey('ctrl+end')
6386-
.expect(dataGrid.isReady()).ok();
6389+
.pressKey('ctrl+end');
63876390

63886391
// assert
63896392
await t
6393+
.expect(dataGrid.isScrolledToRight())
6394+
.ok()
63906395
.expect(dataGrid.getDataCell(19, 14).element.focused)
63916396
.ok()
63926397
.expect(getOrderOfEventCalls())
@@ -6617,8 +6622,8 @@ test('The last cell should be focused after changing the page size (T1063530)',
66176622
})();
66186623
});
66196624

6620-
test.meta({ unstable: true })(`Focus events should be called when pressing the Ctrl + End key when virtual columns, virtual scrolling and focusedRowEnabled are enabled (scrolling.useNative = ${useNativeScrolling})`, async (t) => {
6621-
// arrange
6625+
test(`Focus events should be called when pressing the Ctrl + End key when virtual columns, virtual scrolling and focusedRowEnabled are enabled (scrolling.useNative = ${useNativeScrolling})`, async (t) => {
6626+
// arrange
66226627
const dataGrid = new DataGrid('#container');
66236628

66246629
await t.expect(dataGrid.isReady()).ok();
@@ -6645,7 +6650,9 @@ test('The last cell should be focused after changing the page size (T1063530)',
66456650

66466651
// assert
66476652
await t
6648-
.expect(dataGrid.isReady())
6653+
.expect(dataGrid.isScrolledToBottom())
6654+
.ok()
6655+
.expect(dataGrid.isScrolledToRight())
66496656
.ok()
66506657
.expect(dataGrid.getDataCell(199, 34).element.focused)
66516658
.ok()

e2e/testcafe-devextreme/tests/dataGrid/common/keyboardNavigation/keyboardNavigation.visual.ts

Lines changed: 47 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -524,8 +524,16 @@ test('Navigate to last cell in the last row when virtual scrolling is enabled',
524524
// act
525525
await t
526526
.click(dataGrid.getDataCell(0, 0).element)
527-
.pressKey('ctrl+end')
528-
.wait(100);
527+
.pressKey('ctrl+end');
528+
529+
// assert
530+
await t
531+
.expect(dataGrid.isScrolledToBottom())
532+
.ok()
533+
.expect(dataGrid.isScrolledToRight())
534+
.ok()
535+
.expect(dataGrid.getDataCell(199, 14).element.focused)
536+
.ok();
529537

530538
await testScreenshot(t, takeScreenshot, 'navigate_to_last_cell_in_last_row_when_virtual_scrolling_is_enabled.png', { element: dataGrid.element });
531539

@@ -567,10 +575,16 @@ test('Navigate to first cell in the first row when virtual scrolling is enabled'
567575
// act
568576
await t
569577
.click(dataGrid.getDataCell(199, 14).element)
570-
.pressKey('ctrl+home')
578+
.pressKey('ctrl+home');
579+
580+
// assert
581+
await t
582+
.expect(dataGrid.getDataCell(0, 0).element.focused)
583+
.ok()
571584
.expect(dataGrid.getScrollLeft())
572585
.eql(0)
573-
.wait(1000);
586+
.expect(dataGrid.getScrollTop())
587+
.eql(0);
574588

575589
await testScreenshot(t, takeScreenshot, 'navigate_to_first_cell_in_first_row_when_virtual_scrolling_is_enabled_2.png', { element: dataGrid.element });
576590

@@ -602,11 +616,14 @@ test('Navigate to last cell in the last row when virtual scrolling and columns a
602616
// act
603617
await t
604618
.click(dataGrid.getDataCell(0, 0).element)
605-
.pressKey('ctrl+end')
606-
.wait(1000);
619+
.pressKey('ctrl+end');
607620

608621
// assert
609622
await t
623+
.expect(dataGrid.isScrolledToBottom())
624+
.ok()
625+
.expect(dataGrid.isScrolledToRight())
626+
.ok()
610627
.expect(dataGrid.getDataCell(199, 34).element.focused)
611628
.ok();
612629

@@ -647,11 +664,14 @@ test('Navigate to first cell in the first row when virtual scrolling and columns
647664
// act
648665
await t
649666
.click(dataGrid.getDataCell(199, 34).element)
650-
.pressKey('ctrl+home')
651-
.wait(300);
667+
.pressKey('ctrl+home');
652668

653669
// assert
654670
await t
671+
.expect(dataGrid.getScrollLeft())
672+
.eql(0)
673+
.expect(dataGrid.getScrollTop())
674+
.eql(0)
655675
.expect(dataGrid.getDataCell(0, 0).element.focused)
656676
.ok();
657677

@@ -684,19 +704,30 @@ test('Navigate to first cell in the first row when virtual scrolling and columns
684704
// act
685705
await t
686706
.click(dataGrid.getDataCell(0, 1).element)
687-
.pressKey('ctrl+end')
688-
.wait(1000);
707+
.pressKey('ctrl+end');
689708

690709
// assert
691710
await t
711+
.expect(dataGrid.isScrolledToBottom())
712+
.ok()
713+
.expect(dataGrid.isScrolledToRight())
714+
.ok()
692715
.expect(dataGrid.getDataCell(199, 35).element.focused)
693716
.ok();
694717

695718
// act
696719
await t
697720
.click(dataGrid.getDataCell(199, 35).element)
698-
.pressKey('ctrl+home')
699-
.wait(1000);
721+
.pressKey('ctrl+home');
722+
723+
// assert
724+
await t
725+
.expect(dataGrid.getScrollLeft())
726+
.eql(0)
727+
.expect(dataGrid.getScrollTop())
728+
.eql(0)
729+
.expect(dataGrid.getDataCell(0, 1).element.focused)
730+
.ok();
700731

701732
await testScreenshot(t, takeScreenshot, `${useNative ? 'native' : 'simulated'}_scrolling_-_navigate_to_first_cell_row_dragging__virtual_scrolling__virtual_columns.png`, { element: dataGrid.element });
702733

@@ -722,7 +753,7 @@ test('Navigate to first cell in the first row when virtual scrolling and columns
722753
},
723754
}));
724755

725-
test.meta({ unstable: true })(`${useNative ? 'Native' : 'Simulated'} scrolling: Focus should be on the last focusable cell when pressing the Ctrl + End key when row dragging, virtual scrolling and columns are enabled`, async (t) => {
756+
test(`${useNative ? 'Native' : 'Simulated'} scrolling: Focus should be on the last focusable cell when pressing the Ctrl + End key when row dragging, virtual scrolling and columns are enabled`, async (t) => {
726757
// arrange
727758
const dataGrid = new DataGrid('#container');
728759
const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
@@ -737,7 +768,9 @@ test('Navigate to first cell in the first row when virtual scrolling and columns
737768

738769
// assert
739770
await t
740-
.expect(dataGrid.isReady())
771+
.expect(dataGrid.isScrolledToBottom())
772+
.ok()
773+
.expect(dataGrid.isScrolledToRight())
741774
.ok()
742775
.expect(dataGrid.getDataCell(199, 34).element.focused)
743776
.ok();

packages/testcafe-models/dataGrid/index.ts

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -447,6 +447,32 @@ export default class DataGrid extends GridCore {
447447
)();
448448
}
449449

450+
isScrolledToBottom(): Promise<boolean> {
451+
const { getInstance } = this;
452+
return ClientFunction(() => {
453+
const scrollable = (getInstance() as any).getScrollable();
454+
455+
if (!scrollable) {
456+
return false;
457+
}
458+
459+
return scrollable.scrollHeight() - scrollable.clientHeight() - scrollable.scrollTop() <= 1;
460+
}, { dependencies: { getInstance } })();
461+
}
462+
463+
isScrolledToRight(): Promise<boolean> {
464+
const { getInstance } = this;
465+
return ClientFunction(() => {
466+
const scrollable = (getInstance() as any).getScrollable();
467+
468+
if (!scrollable) {
469+
return false;
470+
}
471+
472+
return scrollable.scrollWidth() - scrollable.clientWidth() - scrollable.scrollLeft() <= 1;
473+
}, { dependencies: { getInstance } })();
474+
}
475+
450476
getScrollbarWidth(isHorizontal: boolean): Promise<number> {
451477
const { getInstance } = this;
452478

0 commit comments

Comments
 (0)