update

Author: EugeniyKiyashko

.github/workflows/demos_visual_tests_frameworks.yml

@@ -35,7 +35,7 @@ jobs:
     needs: check-should-run
     if: needs.check-should-run.outputs.should-run == 'true'
     env:
-      NODE_OPTIONS: "--max-old-space-size=8192"
+      NODE_OPTIONS: --max-old-space-size=8192
     timeout-minutes: 40
 
     steps:
@@ -152,7 +152,7 @@ jobs:
       if: github.event_name != 'pull_request' || contains(github.event.pull_request.labels.*.name, 'force all tests')
       working-directory: apps/demos
       env:
-        NODE_OPTIONS: "--max-old-space-size=8192"
+        NODE_OPTIONS: --max-old-space-size=8192
       run: pnpx nx prepare-bundles
 
     - name: Demos - Run tsc

.github/workflows/qunit_tests.yml

@@ -144,19 +144,15 @@ jobs:
       matrix:
         constel: [
           'ui',
-          'ui.widgets(1/3)',
-          'ui.widgets(2/3)',
-          'ui.widgets(3/3)',
+          'ui.widgets(1/2)',
+          'ui.widgets(2/2)',
           'ui.editors(1/2)',
           'ui.editors(2/2)',
           'ui.htmlEditor',
-          'ui.grid(1/4)',
-          'ui.grid(2/4)',
-          'ui.grid(3/4)',
-          'ui.grid(4/4)',
-          'ui.scheduler(1/3)',
-          'ui.scheduler(2/3)',
-          'ui.scheduler(3/3)',
+          'ui.grid(1/2)',
+          'ui.grid(2/2)',
+          'ui.scheduler(1/2)',
+          'ui.scheduler(2/2)',
           'viz'
         ]
 

.github/workflows/testcafe_tests.yml

@@ -70,7 +70,9 @@ jobs:
 
     - name: Build
       shell: bash
-      run: pnpx nx build devextreme
+      env:
+        NODE_OPTIONS: --max-old-space-size=8192
+      run: pnpx nx build devextreme --uglify
 
     - name: Zip artifacts
       working-directory: ./packages/devextreme
@@ -96,10 +98,9 @@ jobs:
           { componentFolder: "common", name: "common" },
 
           # Grids tests need to be reworked to work in fluent theme
-          { componentFolder: "dataGrid/common", name: "dataGrid / common (1/4)", indices: "1/4" },
-          { componentFolder: "dataGrid/common", name: "dataGrid / common (2/4)", indices: "2/4" },
-          { componentFolder: "dataGrid/common", name: "dataGrid / common (3/4)", indices: "3/4" },
-          { componentFolder: "dataGrid/common", name: "dataGrid / common (4/4)", indices: "4/4" },
+          { componentFolder: "dataGrid/common", name: "dataGrid / common (1/3)", indices: "1/3" },
+          { componentFolder: "dataGrid/common", name: "dataGrid / common (2/3)", indices: "2/3" },
+          { componentFolder: "dataGrid/common", name: "dataGrid / common (3/3)", indices: "3/3" },
           { componentFolder: "dataGrid/sticky/common", name: "dataGrid / sticky common" },
           { componentFolder: "dataGrid/sticky/fixed", name: "dataGrid / sticky"},
           { componentFolder: "cardView", name: "cardView" },
@@ -115,8 +116,7 @@ jobs:
           { componentFolder: "scheduler/timezones", name: "scheduler / timezones (Europe/Berlin)", timezone: "Europe/Berlin", theme: 'generic.light' },
           { componentFolder: "scheduler/timezones", name: "scheduler / timezones (America/Los_Angeles)", timezone: "America/Los_Angeles", theme: 'generic.light' },
 
-          { componentFolder: "editors", name: "editors (1/2)", indices: "1/2" },
-          { componentFolder: "editors", name: "editors (2/2)", indices: "2/2" },
+          { componentFolder: "editors", name: "editors" },
           { componentFolder: "navigation", name: "navigation" },
         ]
     runs-on: devextreme-shr2
@@ -175,6 +175,8 @@ jobs:
 
     - name: Run TestCafe tests
       working-directory: ./e2e/testcafe-devextreme
+      env:
+        NODE_OPTIONS: --max-old-space-size=8192 --max-semi-space-size=1024
       run: |
         if [ "${{ matrix.ARGS.theme }}" != "" ]; then
           THEME="--theme ${{ matrix.ARGS.theme }}"

e2e/testcafe-devextreme/helpers/testPageUtils.ts

@@ -1,13 +1,10 @@
 /* eslint-disable spellcheck/spell-checker */
-import { ClientFunction } from 'testcafe';
 import {
   removeStylesheetRulesFromPage,
 } from './domUtils';
 
-export async function clearTestPage(testController: TestController): Promise<void> {
-  const shadowDom = process.env.shadowDom === 'true';
-
-  const clearTestPageFn = ClientFunction(() => {
+export async function clearTestPage(t: TestController): Promise<void> {
+  await t.eval(() => {
     const widgetSelector = '.dx-widget';
     const $elements = $(widgetSelector)
       .filter((_, element) => $(element).parents(widgetSelector).length === 0);
@@ -40,14 +37,9 @@ export async function clearTestPage(testController: TestController): Promise<voi
     `;
 
     body?.prepend(temp.firstElementChild!);
-  }, {
-    dependencies: {
-      shadowDom,
-    },
   });
 
-  await clearTestPageFn.with({ boundTestRun: testController })();
-  await removeStylesheetRulesFromPage.with({ boundTestRun: testController })();
+  await removeStylesheetRulesFromPage.with({ boundTestRun: t })();
 }
 
 export async function loadAxeCore(t: TestController): Promise<void> {
@@ -59,10 +51,44 @@ export async function loadAxeCore(t: TestController): Promise<void> {
     }
 
     const script = document.createElement('script');
+    script.id = 'axe-core-script';
     script.src = '../../../node_modules/axe-core/axe.min.js';
     // @ts-expect-error ts-error
     script.onload = resolve;
     script.onerror = reject;
     document.head.appendChild(script);
   }));
 }
+
+export async function loadGantt(t: TestController): Promise<void> {
+  await t.eval(() => new Promise<void>((resolve, reject) => {
+    if (document.getElementById('dx-gantt-script')) {
+      resolve();
+      return;
+    }
+
+    const script = document.createElement('script');
+    script.id = 'dx-gantt-script';
+    script.src = '../../../packages/devextreme/artifacts/js/dx-gantt.min.js';
+    // @ts-expect-error ts-error
+    script.onload = resolve;
+    script.onerror = reject;
+    document.head.appendChild(script);
+  }));
+}
+
+export const addShadowRootTree = async (t: TestController): Promise<void> => {
+  await t.eval(() => {
+    const root = document.querySelector('#parentContainer') as HTMLElement;
+    const { childNodes } = root;
+
+    if (!root.shadowRoot) {
+      root.attachShadow({ mode: 'open' });
+    }
+
+    const shadowContainer = document.createElement('div');
+    shadowContainer.append(...Array.from(childNodes));
+
+    root.shadowRoot!.appendChild(shadowContainer);
+  });
+};

e2e/testcafe-devextreme/helpers/themeUtils.ts

@@ -1,4 +1,5 @@
 import { isString } from 'devextreme/core/utils/type';
+import { ClientFunction } from 'testcafe';
 import { changeTheme } from './changeTheme';
 
 const defaultThemeName = 'generic.light';
@@ -8,6 +9,13 @@ export const getThemePostfix = (theme?: string): string => {
   return ` (${themeName.replace(/\./g, '-')})`;
 };
 
+export const getCurrentTheme = async (t: TestController): Promise<string> => {
+  // eslint-disable-next-line @stylistic/max-len
+  const currentTheme = await ClientFunction(() => (window as any).DevExpress.ui.themes.current()).with({ boundTestRun: t })();
+
+  return currentTheme;
+};
+
 export const isMaterial = (): boolean => process.env.theme === 'material.blue.light';
 
 export const isFluent = (): boolean => process.env.theme === 'fluent.blue.light';