update

Author: EugeniyKiyashko

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

@@ -8,6 +8,8 @@ import { createWidget } from '../../../../helpers/createWidget';
 fixture.disablePageReloads`Editing.Functional`
   .page(url(__dirname, '../../../container.html'));
 
+const FOCUS_ASSERTION_TIMEOUT = 3000;
+
 const getGridConfig = (config): Record<string, unknown> => {
   const defaultConfig = {
     errorRowEnabled: true,
@@ -67,8 +69,8 @@ test('DataGrid - The "Cannot read properties of undefined error" occurs when usi
     .pressKey('enter tab tab');
   await resolveOnSavingDeferred();
   await t
-    .expect(dataGrid.isReady()).ok()
-    .expect(dataGrid.getDataCell(2, 0).isFocused).ok();
+    .expect(dataGrid.isReady()).ok({ timeout: FOCUS_ASSERTION_TIMEOUT })
+    .expect(dataGrid.getDataCell(2, 0).isFocused).ok({ timeout: FOCUS_ASSERTION_TIMEOUT });
 }).before(async () => {
   await ClientFunction(() => {
     (window as any).deferred = $.Deferred();

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

@@ -21,6 +21,7 @@ import { testScreenshot } from '../../../../helpers/themeUtils';
 import { addFocusableElementBefore } from '../../../../helpers/domUtils';
 
 const CLASS = ClassNames;
+const FOCUS_ASSERTION_TIMEOUT = 3000;
 
 const getOnKeyDownCallCount = ClientFunction(() => (window as any).onKeyDownCallCount);
 
@@ -6801,10 +6802,12 @@ test('Focus should be set to the grid to allow keyboard navigation when the focu
     // act
     await t
       .click(searchPanel.input)
-      .pressKey('tab tab tab tab tab');
+      .expect(searchPanel.isFocused)
+      .ok({ timeout: FOCUS_ASSERTION_TIMEOUT })
+      .pressKey('tab tab tab tab tab', { speed: 0.5 });
 
     // assert
-    await t.expect(secondIDCell.isFocused).ok();
+    await t.expect(secondIDCell.isFocused).ok({ timeout: FOCUS_ASSERTION_TIMEOUT });
 
     // act
     await searchPanel.focus();
@@ -6817,22 +6820,22 @@ test('Focus should be set to the grid to allow keyboard navigation when the focu
       .notOk('focus should be on the search panel');
 
     // act
-    await t.pressKey('tab tab tab');
+    await t.pressKey('tab tab tab', { speed: 0.5 });
 
     // assert
-    await t.expect(secondIDCell.isFocused).ok();
+    await t.expect(secondIDCell.isFocused).ok({ timeout: FOCUS_ASSERTION_TIMEOUT });
 
     // act
     await t.pressKey('tab tab');
 
     // assert
-    await t.expect(button.isFocused).ok();
+    await t.expect(button.isFocused).ok({ timeout: FOCUS_ASSERTION_TIMEOUT });
 
     // act
     await t.pressKey('shift+tab');
 
     // assert
-    await t.expect(secondNameCell.isFocused).ok();
+    await t.expect(secondNameCell.isFocused).ok({ timeout: FOCUS_ASSERTION_TIMEOUT });
   }).before(async () => {
     await createWidget('dxDataGrid', {
       dataSource: [{ id: 1, name: 'test1' }, { id: 2, name: 'test2' }],

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

@@ -776,9 +776,14 @@ test('Navigate to first cell in the first row when virtual scrolling and columns
     await expectDataCellFocusState(t, dataGrid, 199, 34);
     await t
       .expect(dataGrid.isReady())
-      .ok({ timeout: KEYBOARD_NAVIGATION_TIMEOUT })
-      .expect(isScrollAtEnd('horizontal'))
       .ok({ timeout: KEYBOARD_NAVIGATION_TIMEOUT });
+
+    if (!useNative) {
+      await t
+        .expect(isScrollAtEnd('horizontal'))
+        .ok({ timeout: KEYBOARD_NAVIGATION_TIMEOUT });
+    }
+
     await waitForPaint();
 
     await testScreenshot(t, takeScreenshot, `${useNative ? 'native' : 'simulated'}_scrolling_-_navigate_to_last_cell_row_dragging__virtual_scrolling__virtual_columns.png`, { element: dataGrid.element });

packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/chat.tests.js

@@ -88,7 +88,12 @@ const waitForEditingPreviewToHide = async(getEditingPreview) => {
     await waitForCondition(() => getEditingPreview().length === 0
         || getEditingPreview().hasClass(CHAT_EDITING_PREVIEW_HIDING_CLASS));
 
-    getEditingPreview().get(0)?.dispatchEvent(new Event('animationend'));
+    const editingPreview = getEditingPreview().get(0);
+    if(editingPreview) {
+        editingPreview.dispatchEvent(new Event('animationend'));
+    }
+
+    await waitForCondition(() => getEditingPreview().length === 0);
 };
 
 export const MOCK_COMPANION_USER_ID = 'COMPANION_USER_ID';

packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/messageList.tests.js

@@ -1647,8 +1647,7 @@ QUnit.module('MessageList', () => {
             });
         });
 
-        QUnit.test('should not be scroll down after render companion message if scroll position not at the bottom', function(assert) {
-            const done = assert.async();
+        QUnit.test('should not be scroll down after render companion message if scroll position not at the bottom', async function(assert) {
             const items = generateMessages(52);
 
             this.reinit({
@@ -1665,24 +1664,25 @@ QUnit.module('MessageList', () => {
                 text: 'NEW MESSAGE',
             };
 
-            setTimeout(() => {
-                this.getScrollView().scrollBy({ top: -100 });
-                setTimeout(() => {
+            await waitForCondition(() => Math.abs(this.getScrollView().scrollTop() - this.getScrollOffsetMax()) <= 1);
 
-                    const scrollTopBefore = this.getScrollView().scrollTop();
-                    assert.roughEqual(scrollTopBefore, this.getScrollOffsetMax() - 100, 1, 'scroll position should not be at the bottom before rendering the message');
+            const initialScrollTop = this.getScrollOffsetMax() - 100;
+            this.getScrollView().scrollTo({ top: initialScrollTop });
 
-                    setTimeout(() => {
-                        this.instance.option('items', [...items, newMessage]);
+            await waitForCondition(() => Math.abs(this.getScrollView().scrollTop() - initialScrollTop) <= 1);
 
-                        const scrollTop = this.getScrollView().scrollTop();
+            const scrollTopBefore = this.getScrollView().scrollTop();
+            assert.roughEqual(scrollTopBefore, initialScrollTop, 1, 'scroll position should not be at the bottom before rendering the message');
 
-                        assert.notEqual(scrollTop, 0, 'scroll position should not be 0 after a new message is rendered');
-                        assert.roughEqual(scrollTop, scrollTopBefore, 1, 'scroll position should be at the bottom after rendering the new message');
-                        done();
-                    }, this._resizeTimeout);
-                }, this._resizeTimeout);
-            }, this._resizeTimeout);
+            this.instance.option('items', [...items, newMessage]);
+
+            await waitForCondition(() => this.getBubbles().length === items.length + 1
+                && Math.abs(this.getScrollView().scrollTop() - scrollTopBefore) <= 1);
+
+            const scrollTop = this.getScrollView().scrollTop();
+
+            assert.notEqual(scrollTop, 0, 'scroll position should not be 0 after a new message is rendered');
+            assert.roughEqual(scrollTop, scrollTopBefore, 1, 'scroll position should remain the same after rendering the new message');
         });
 
         QUnit.test('should be scrolled down after showing if was initially rendered inside an invisible element', function(assert) {
@@ -1977,4 +1977,3 @@ QUnit.module('MessageList', () => {
     });
 });
 
-

packages/devextreme/testing/tests/DevExpress.ui.widgets/mapParts/azureTests.js

@@ -30,6 +30,13 @@ const prepareTestingAzureProvider = () => {
     atlas.popupOpened = false;
 };
 
+const loadAzureMock = () => $.getScript({
+    url: '../../packages/devextreme/testing/helpers/forMap/azureMock.js',
+    scriptAttrs: { nonce: 'qunit-test' },
+}).done(() => {
+    prepareTestingAzureProvider();
+});
+
 const moduleConfig = {
     beforeEach: function() {
         const fakeURL = '/fakeAzureUrl';
@@ -43,12 +50,7 @@ const moduleConfig = {
                 if(!azureMockCreated) {
                     azureMockCreated = true;
 
-                    $.getScript({
-                        url: '../../packages/devextreme/testing/helpers/forMap/azureMock.js',
-                        scriptAttrs: { nonce: 'qunit-test' },
-                    }).done(() => {
-                        prepareTestingAzureProvider();
-                    });
+                    loadAzureMock();
                 }
             },
             responseText: {
@@ -86,10 +88,7 @@ QUnit.module('map loading', moduleConfig, () => {
     QUnit.test('map initialize with loaded map', function(assert) {
         const done = assert.async();
 
-        $.getScript({
-            url: '../../packages/devextreme/testing/helpers/forMap/azureMock.js',
-            scriptAttrs: { nonce: 'qunit-test' }
-        }).done(function() {
+        loadAzureMock().done(function() {
             window.atlas.Map.customFlag = true;
 
             setTimeout(function() {
@@ -308,15 +307,23 @@ QUnit.module('basic options', moduleConfig, () => {
         const done = assert.async();
         const center = 'Cedar Park, Texas';
 
-        $('#map').dxMap({
-            provider: 'azure',
-            center,
-            onReady: () => {
-                assert.deepEqual(atlas.cameraOptions.center, this.geocodedCoordinates, 'center coordinates are correct');
+        const initMap = () => {
+            $('#map').dxMap({
+                provider: 'azure',
+                center,
+                onReady: () => {
+                    assert.deepEqual(atlas.cameraOptions.center, this.geocodedCoordinates, 'center coordinates are correct');
 
-                done();
-            }
-        });
+                    done();
+                }
+            });
+        };
+
+        if(window.atlas && window.atlas.Map) {
+            initMap();
+        } else {
+            loadAzureMock().done(initMap);
+        }
     });
 
     QUnit.test('Previously geocoded location should be taken from cache instead of geocoding second time', function(assert) {