Fix unstable tests (#33319)

Author: Raushen

e2e/testcafe-devextreme/tests/dataGrid/common/exportButton.ts

@@ -11,6 +11,8 @@ test('allowExportSelectedData: false, menu: false', async (t) => {
   const dataGrid = new DataGrid('#container');
   const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
+  await t.expect(dataGrid.isReady()).ok();
+
   await testScreenshot(t, takeScreenshot, 'grid-export-one-button.png', { element: dataGrid.getHeaderPanel().element });
   await t
     .expect(compareResults.isValid())
@@ -26,6 +28,8 @@ test('allowExportSelectedData: false, menu: false, PDF', async (t) => {
   const dataGrid = new DataGrid('#container');
   const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
+  await t.expect(dataGrid.isReady()).ok();
+
   await testScreenshot(t, takeScreenshot, 'grid-export-one-button-pdf.png', { element: dataGrid.getHeaderPanel().element });
   await t
     .expect(compareResults.isValid())
@@ -43,6 +47,8 @@ test('allowExportSelectedData: true, menu: false', async (t) => {
   const dataGrid = new DataGrid('#container');
   const headerPanel = dataGrid.getHeaderPanel();
 
+  await t.expect(dataGrid.isReady()).ok();
+
   await t.click(headerPanel.getExportButton().element);
 
   await testScreenshot(t, takeScreenshot, 'grid-export-dropdown-button.png', { element: dataGrid.element });
@@ -65,6 +71,8 @@ test('allowExportSelectedData: false, menu: true', async (t) => {
   const dataGrid = new DataGrid('#container');
   const headerPanel = dataGrid.getHeaderPanel();
 
+  await t.expect(dataGrid.isReady()).ok();
+
   await t.click(headerPanel.getDropDownMenuButton());
 
   await testScreenshot(t, takeScreenshot, 'grid-export-one-button-in-menu.png', { element: 'html' });
@@ -85,6 +93,8 @@ test('allowExportSelectedData: true, menu: true', async (t) => {
   const dataGrid = new DataGrid('#container');
   const headerPanel = dataGrid.getHeaderPanel();
 
+  await t.expect(dataGrid.isReady()).ok();
+
   await t.click(headerPanel.getDropDownMenuButton());
 
   await testScreenshot(t, takeScreenshot, 'grid-export-dropdown-button-in-menu.png', { element: 'html' });
@@ -105,6 +115,7 @@ test.meta({ browserSize: [800, 800] })('Export is disabled when no data columns
   const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
 
   const dataGrid = new DataGrid('#container');
+  await t.expect(dataGrid.isReady()).ok();
 
   await testScreenshot(t, takeScreenshot, 'disabled-export_when-no-columns-visible.png', { element: dataGrid.element });
   await t
@@ -131,6 +142,8 @@ test.meta({ browserSize: [800, 800] })('Export is disabled when no data columns
   const dataGrid = new DataGrid('#container');
   const headerPanel = dataGrid.getHeaderPanel();
 
+  await t.expect(dataGrid.isReady()).ok();
+
   await t.click(headerPanel.getDropDownMenuButton());
 
   await testScreenshot(t, takeScreenshot, 'disabled-export-in-menu_when-no-columns-visible.png', { element: 'html' });

e2e/testcafe-devextreme/tests/dataGrid/common/grouping/grouping.ts

@@ -15,6 +15,8 @@ test('Grouping Panel label should not overflow in a narrow grid (T1103925)', asy
 
   const dataGrid = new DataGrid('#container');
 
+  await t.expect(dataGrid.isReady()).ok();
+
   await testScreenshot(t, takeScreenshot, 'groupingPanel.png', { element: dataGrid.getToolbar().element });
   await t
     .expect(compareResults.isValid())
@@ -46,6 +48,8 @@ test('Headers should be rendered correctly after changing the grouping.autoExpan
   const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
   const dataGrid = new DataGrid('#container');
 
+  await t.expect(dataGrid.isReady()).ok();
+
   await testScreenshot(t, takeScreenshot, 'T1155453-expanded-groups.png', { element: dataGrid.element });
 
   // act
@@ -96,6 +100,8 @@ test('Headers should be rendered correctly after changing the grouping.autoExpan
   const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
   const dataGrid = new DataGrid('#container');
 
+  await t.expect(dataGrid.isReady()).ok();
+
   await testScreenshot(t, takeScreenshot, 'T1155453-expanded-groups-with-fixed-content.png', { element: dataGrid.element });
 
   // act
@@ -149,6 +155,8 @@ test.meta({ browserSize: [800, 800] })('Empty header message should appear when
 
   const dataGrid = new DataGrid('#container');
 
+  await t.expect(dataGrid.isReady()).ok();
+
   await testScreenshot(t, takeScreenshot, 'empty-header-message-with-selection-enabled.png', { element: dataGrid.element });
 
   // assert
@@ -186,6 +194,8 @@ test('Group panel message should be vertically aligned (T1186613)', async (t) =>
   const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
   const dataGrid = new DataGrid('#container');
 
+  await t.expect(dataGrid.isReady()).ok();
+
   await testScreenshot(t, takeScreenshot, 'group-panel-message-align.png', { element: dataGrid.getToolbar().element });
   await t
     .expect(compareResults.isValid())
@@ -228,6 +238,8 @@ test('The collapse icon should update if repaintChangesOnly option is enabled (T
   const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
   const dataGrid = new DataGrid('#container');
 
+  await t.expect(dataGrid.isReady()).ok();
+
   await t.click(dataGrid.getPager().getNavPage('2').element);
 
   await testScreenshot(t, takeScreenshot, 'continued_group-collapse_icon-T1201981.png', { element: dataGrid.element });
@@ -276,6 +288,8 @@ const customersT1232129 = [
 test('DataGrid loses grouping after the expandAll method if a grouped column has calculateDisplayValue (T1232129)', async (t) => {
   const dataGrid = new DataGrid('#container');
 
+  await t.expect(dataGrid.isReady()).ok();
+
   await dataGrid.apiExpandAll();
   await t
     .expect(dataGrid.apiColumnOption('groupId', 'groupIndex'))
@@ -301,6 +315,8 @@ test('DataGrid loses grouping after the expandAll method if a grouped column has
 test('DataGrid should not lose grouping after the expandAll method if a grouped column has string calculateGroupValue (T1321187)', async (t) => {
   const dataGrid = new DataGrid('#container');
 
+  await t.expect(dataGrid.isReady()).ok();
+
   await dataGrid.apiExpandAll();
 
   await t
@@ -324,6 +340,8 @@ test('DataGrid should not change group column after the expandAll method, string
   const dataGrid = new DataGrid('#container');
   const firstGroupCellText = await dataGrid.getGroupRow(0).getCell(1).element.textContent;
 
+  await t.expect(dataGrid.isReady()).ok();
+
   await dataGrid.apiExpandAll();
 
   await t
@@ -353,6 +371,8 @@ test('DataGrid should not change group column after the expandAll method, string
   const dataGrid = new DataGrid('#container');
   const firstGroupCellText = await dataGrid.getGroupRow(0).getCell(1).element.textContent;
 
+  await t.expect(dataGrid.isReady()).ok();
+
   await dataGrid.apiExpandAll();
 
   await t