Skip to content

Grids - Stabilize tests (Part 3) #34221

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
Tucchhaa wants to merge 8 commits into
base: main
Choose a base branch
from
Open

Grids - Stabilize tests (Part 3) #34221

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
fb68eca
fix
Tucchhaa Jul 7, 2026
566518c
split toast tests into 2
Tucchhaa Jul 7, 2026
d1bbc32
fix toast test
Tucchhaa Jul 7, 2026
a62c9f1
stabilize
Tucchhaa Jul 7, 2026
ee84401
fix tests
Tucchhaa Jul 7, 2026
6c0a5d6
apply kbn test fixes
Tucchhaa Jul 8, 2026
dad40bc
fix kbn tests
Tucchhaa Jul 8, 2026
9bab139
fix kbn tests
Tucchhaa Jul 8, 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
6 changes: 4 additions & 2 deletions e2e/testcafe-devextreme/tests/cardView/columnChooser/functional.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,16 +56,16 @@ function testsFactory(testModel: {
assertFirstColumnHidden: (t: TestController, cardView: CardView) => Promise<void>;
config: any; // TODO: add typing
}) {
test.meta({ unstable: true })(`column chooser in ${testModel.name} mode should work after multiple hide/show actions`, async (t) => {
test(`column chooser in ${testModel.name} mode should work after multiple hide/show actions`, async (t) => {
const cardView = new CardView('#container');
await t.expect(cardView.isReady()).ok();

await cardView.apiShowColumnChooser();

await testModel.hideFirstColumn(t, cardView);
await testModel.assertFirstColumnHidden(t, cardView);

await testModel.showFirstColumn(t, cardView);

await testModel.assertFirstColumnVisible(t, cardView);

await testModel.hideFirstColumn(t, cardView);
Expand Down Expand Up @@ -97,12 +97,14 @@ testsFactory({
async hideFirstColumn(t: TestController, cardView: CardView) {
await t.click(
cardView.getColumnChooser().getCheckbox(0),
{ offsetX: 5, offsetY: 5 },
);
await t.expect(cardView.isReady()).ok();
},
async showFirstColumn(t: TestController, cardView: CardView) {
await t.click(
cardView.getColumnChooser().getCheckbox(0),
{ offsetX: 5, offsetY: 5 },
);
await t.expect(cardView.isReady()).ok();
},
Expand Down
12 changes: 8 additions & 4 deletions e2e/testcafe-devextreme/tests/cardView/columnSortable/functional.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import {
expectColumns,
getColumnItem,
triggerDragStart,
triggerDragEnd,
SELECTORS,
} from './utils';

Expand All @@ -36,6 +37,8 @@ fixture.disablePageReloads`CardView - ColumnSortable.Functional`
} else {
await t.expect(draggingElement.exists).notOk();
}

await triggerDragEnd(columnElement);

@Tucchhaa Tucchhaa Jul 8, 2026 •
edited
Loading

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This test was stable, but page reloads are disabled in this fixture, so to prevent any leakage between tests I have added this.

}).before(async () => createWidget('dxCardView', {
allowColumnReordering,
columns: [{
Expand Down Expand Up @@ -66,6 +69,8 @@ fixture.disablePageReloads`CardView - ColumnSortable.Functional`
} else {
await t.expect(draggingElement.exists).notOk();
}

await triggerDragEnd(columnElement);
}).before(async () => createWidget('dxCardView', {
allowColumnReordering: true,
columns: [{
Expand Down Expand Up @@ -102,18 +107,18 @@ fixture.disablePageReloads`CardView - ColumnSortable.Functional`

[0, 1].forEach((columnIndex) => {
[0, 1, 2].forEach((gapIndex) => {
test.meta({ unstable: true })(`drag from columnChooser to headerPanel: from index ${columnIndex} to index ${gapIndex}`, async (t) => {
test(`drag from columnChooser to headerPanel: from index ${columnIndex} to index ${gapIndex}`, async (t) => {
const cardView = new CardView('#container');
await cardView.apiShowColumnChooser();

const columnElement = getColumnItem(cardView, columnIndex, 'columnChooser');

await dragToHeaderPanel(t, cardView, columnElement, gapIndex);

const headerPanelColumns = [2, 3, 4];
const headerPanelColumns = [2, 3];
headerPanelColumns.splice(gapIndex, 0, columnIndex);

const chooserColumns = [0, 1, 2, 3, 4].filter((c) => !headerPanelColumns.includes(c));
const chooserColumns = [0, 1].filter((c) => c !== columnIndex);

await expectColumns(t, cardView, headerPanelColumns);
await expectColumns(t, cardView, chooserColumns, 'columnChooser');
Expand All @@ -124,7 +129,6 @@ fixture.disablePageReloads`CardView - ColumnSortable.Functional`
{ dataField: 'Column 1', visible: false },
{ dataField: 'Column 2' },
{ dataField: 'Column 3' },
{ dataField: 'Column 4' },

@Tucchhaa Tucchhaa Jul 8, 2026

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This matrix tests iterates through [0, 1, 2] for gapIndex. With 4 columns, testcases for gapIndex==1 and gapIndex==2 basically test the same thing: drag from column chooser to the middle of header panel.

With 3 columns, gapIndex==2 now checks the case when column is dragged to the end of header panel

],
}));
});
Expand Down
23 changes: 20 additions & 3 deletions e2e/testcafe-devextreme/tests/common/treeList/toast.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,22 +7,39 @@ import { testScreenshot } from '../../../helpers/themeUtils';
fixture.disablePageReloads`Toasts in TreeList`
.page(url(__dirname, '../../container.html'));

test('Toast should be visible after calling and should be not visible after default display time', async (t) => {
test('Toast should be visible after calling', async (t) => {
const treeList = new TreeList('#container');
const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
await t
.expect(treeList.isReady())
.ok();

await treeList.apiShowErrorToast();
await treeList.apiShowErrorToast({ displayTime: 100000 });

@Tucchhaa Tucchhaa Jul 8, 2026

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

toast could disappear before the screenshot is taken, which can lead to instability. So I have added more display time

await t.expect(treeList.getToast().exists).ok();

await testScreenshot(t, takeScreenshot, 'ai-column__toast__at-the-right-position.png', { element: treeList.element });

await t
.expect(compareResults.isValid())
.ok(compareResults.errorMessages());
await t.expect(treeList.getToast().exists).notOk();
}).before(async () => {
await createWidget('dxTreeList', {});
});

test('Toast should hide after the display time', async (t) => {
const treeList = new TreeList('#container');

await t
.expect(treeList.isReady())
.ok();

await treeList.apiShowErrorToast({ displayTime: 1000 });
await t
.expect(treeList.getToast().exists).ok();

await t
.wait(1000)
.expect(treeList.getToast().exists).notOk();
}).before(async () => {
await createWidget('dxTreeList', {});
});
20 changes: 8 additions & 12 deletions e2e/testcafe-devextreme/tests/dataGrid/common/aiColumn/virtualScrolling.functional.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,8 @@ const checkAIColumnTexts = async (
}
};

const isAIRequestPending = ClientFunction(() => !!(window as any).aiResolve);

const resolveAIRequest = ClientFunction((): void => {
const { aiResponseData } = (window as any);
const { aiResolve } = (window as any);
Expand All @@ -41,16 +43,12 @@ const deleteGlobalVariables = ClientFunction((): void => {
delete (window as any).aiResolve;
});

test.meta({ unstable: true })('DataGrid should send an AI request for rendered rows after scrolling without changing the page index', async (t) => {
test('DataGrid should send an AI request for rendered rows after scrolling without changing the page index', async (t) => {
// arrange
const dataGrid = new DataGrid(DATA_GRID_SELECTOR);

// assert
await t
.expect(dataGrid.getLoadPanel().isVisible())
.ok();
Comment on lines -49 to -51

@Tucchhaa Tucchhaa Jul 8, 2026

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

race condition: load panel can hide before this check runs. The test name doesn't suggest that load panel has to be checked, so I have removed this expect


// act
await t.expect(isAIRequestPending()).ok();
await resolveAIRequest();

// assert
Expand All @@ -76,6 +74,7 @@ test.meta({ unstable: true })('DataGrid should send an AI request for rendered r
.ok();

// act
await t.expect(isAIRequestPending()).ok();
await resolveAIRequest();

// assert
Expand Down Expand Up @@ -144,16 +143,12 @@ test.meta({ unstable: true })('DataGrid should send an AI request for rendered r
await deleteGlobalVariables();
});

test.meta({ unstable: true })('DataGrid should send an AI request for rendered rows after scrolling with changing the page index', async (t) => {
test('DataGrid should send an AI request for rendered rows after scrolling with changing the page index', async (t) => {
// arrange
const dataGrid = new DataGrid(DATA_GRID_SELECTOR);

// assert
await t
.expect(dataGrid.getLoadPanel().isVisible())
.ok();

// act
await t.expect(isAIRequestPending()).ok();
await resolveAIRequest();

// assert
Expand All @@ -179,6 +174,7 @@ test.meta({ unstable: true })('DataGrid should send an AI request for rendered r
.ok();

// act
await t.expect(isAIRequestPending()).ok();
await resolveAIRequest();

// assert
Expand Down
6 changes: 5 additions & 1 deletion e2e/testcafe-devextreme/tests/dataGrid/common/focus/focusEvents/newRows_T1162227.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -245,11 +245,15 @@ test('It should not fire row events if focusedRowEnabled: false', async (t) => {
await clearCallbackTesting();
});

test.meta({ unstable: true })('It should fire rowChanged event on initialization if focusedRowKey options is set', async (t) => {
test('It should fire rowChanged event on initialization if focusedRowKey options is set', async (t) => {
const dataGrid = new DataGrid(GRID_SELECTOR);

const expectedRowFocusChanged: FocusRowChangedData[] = [
[1],
];

await t.expect(dataGrid.getDataRow(1).element).ok();

@Tucchhaa Tucchhaa Jul 8, 2026

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

wait for the row to appear before checking callback results


const [
,
,
Expand Down
3 changes: 2 additions & 1 deletion e2e/testcafe-devextreme/tests/dataGrid/common/headerPanel.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -87,9 +87,10 @@ test('Drop-down window should be positioned correctly after resizing the toolbar
// visual: fluent.blue.light
// visual: fluent.blue.dark

test.meta({ unstable: true })('Disabled toolbar buttons are not grayed out in Material themes (T1217416)', async (t) => {
test('Disabled toolbar buttons should be grayed out in Material themes (T1217416)', async (t) => {
const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
const dataGrid = new DataGrid('#container');
await t.expect(dataGrid.isReady()).ok();

await testScreenshot(t, takeScreenshot, 'disabled-toolbar-buttons.png', { element: dataGrid.element });
await t
Expand Down
Loading
Loading