Skip to content

Migrate the PivotGrid e2e tests to Playwright - #34960

Open
aleksei-semikozov wants to merge 59 commits into
DevExpress:mainfrom
aleksei-semikozov:playwright-scheduler-pivotgrid
Open

Migrate the PivotGrid e2e tests to Playwright#34960
aleksei-semikozov wants to merge 59 commits into
DevExpress:mainfrom
aleksei-semikozov:playwright-scheduler-pivotgrid

Conversation

@aleksei-semikozov

Copy link
Copy Markdown
Contributor

No description provided.

Aleksey Semikozov added 18 commits August 27, 2026 11:32
@aleksei-semikozov aleksei-semikozov self-assigned this Aug 27, 2026
@aleksei-semikozov
aleksei-semikozov marked this pull request as ready for review August 27, 2026 23:56
@aleksei-semikozov
aleksei-semikozov requested a review from a team as a code owner August 27, 2026 23:56
Copilot AI lite review requested due to automatic review settings August 27, 2026 23:56

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Pull request overview

This PR migrates end-to-end coverage from TestCafe to Playwright by introducing a new Playwright-based component E2E package (focused on PivotGrid) and migrating wrapper E2E tests, while removing the corresponding legacy TestCafe runner/tests and wiring the new suites into CI.

Changes:

  • Added e2e/playwright Playwright test harness (runner, server, fixtures, helpers, models) and migrated PivotGrid E2E scenarios to it.
  • Migrated wrapper E2E tests in e2e/wrappers from TestCafe (*.test.js) to Playwright (*.spec.ts) and replaced the old runner with a Playwright webServer-based setup.
  • Updated workspace dependencies and CI workflows to lint/run the new Playwright projects and removed obsolete React/Vue playground TestCafe runners.

Reviewed changes

Copilot reviewed 123 out of 220 changed files in this pull request and generated 1 comment.

Show a summary per file
File Description
pnpm-workspace.yaml Adds Playwright test dependency to the workspace catalog.
e2e/wrappers/tests/textbox.test.js Removes legacy TestCafe wrapper test.
e2e/wrappers/tests/textbox.spec.ts Adds Playwright wrapper test for TextBox dynamic styles.
e2e/wrappers/tests/select-box-nested-validator.test.js Removes legacy TestCafe wrapper test.
e2e/wrappers/tests/select-box-nested-validator.spec.ts Adds Playwright wrapper tests for nested Validator scenarios.
e2e/wrappers/tests/inputs-list-in-form.test.js Removes legacy TestCafe wrapper test.
e2e/wrappers/tests/inputs-list-in-form.spec.ts Adds Playwright wrapper test for dynamic inputs in form.
e2e/wrappers/tests/gantt-template-state-update.test.js Removes legacy TestCafe wrapper test.
e2e/wrappers/tests/gantt-template-state-update.spec.ts Adds Playwright wrapper test with framework-based skip.
e2e/wrappers/tests/chat-template-rerender.test.js Removes legacy TestCafe wrapper test.
e2e/wrappers/tests/chat-template-rerender.spec.ts Adds Playwright wrapper test with framework-based skip.
e2e/wrappers/tests/button.test.js Removes legacy TestCafe wrapper test.
e2e/wrappers/tests/button.spec.ts Adds Playwright wrapper smoke test for Button.
e2e/wrappers/test-helpers.js Removes TestCafe wrapper test helper utilities.
e2e/wrappers/serve.mjs Adds Express-based static server for wrapper builds.
e2e/wrappers/runner.js Removes legacy TestCafe-based wrapper runner.
e2e/wrappers/README.md Adds local/CI run documentation for wrapper Playwright tests.
e2e/wrappers/playwright.config.ts Adds Playwright configuration for wrapper E2E (webServer, chrome channel, traces).
e2e/wrappers/package.json Switches wrapper test scripts/deps from TestCafe runner to Playwright.
e2e/wrappers/fixtures.ts Adds wrapper Playwright fixtures/options for framework selection.
e2e/wrappers/docker/run.sh Adds container runner for wrapper Playwright tests (including UI mode).
e2e/wrappers/docker/Dockerfile Adds Docker image to mirror CI environment for wrapper tests.
e2e/wrappers/.gitignore Ignores Playwright reports/results for wrapper suite.
e2e/testcafe-devextreme/tests/common/pivotGrid/virtualScrolling_T1210807.ts Removes legacy TestCafe PivotGrid test.
e2e/testcafe-devextreme/tests/common/pivotGrid/sort/sortWithSummaryDisplayMode_T1173442.ts Removes legacy TestCafe PivotGrid test.
e2e/testcafe-devextreme/tests/common/pivotGrid/sort/localSort_T1150523.ts Removes legacy TestCafe PivotGrid test.
e2e/testcafe-devextreme/tests/common/pivotGrid/scrolling.ts Removes legacy TestCafe PivotGrid scrolling matrix tests.
e2e/testcafe-devextreme/tests/common/pivotGrid/runningTotal/runningTotal.ts Removes legacy TestCafe PivotGrid running total tests.
e2e/testcafe-devextreme/tests/common/pivotGrid/kbn/rowHeaders.ts Removes legacy TestCafe keyboard navigation tests.
e2e/testcafe-devextreme/tests/common/pivotGrid/kbn/fieldChooser.ts Removes legacy TestCafe FieldChooser keyboard tests.
e2e/testcafe-devextreme/tests/common/pivotGrid/kbn/expandIcon.ts Removes legacy TestCafe expandable cell focus test.
e2e/testcafe-devextreme/tests/common/pivotGrid/kbn/contextMenu.ts Removes legacy TestCafe context menu keyboard tests.
e2e/testcafe-devextreme/tests/common/pivotGrid/kbn/columnHeaders.ts Removes legacy TestCafe column header keyboard tests.
e2e/testcafe-devextreme/tests/common/pivotGrid/headerFilter.ts Removes legacy TestCafe header filter tests.
e2e/testcafe-devextreme/tests/common/pivotGrid/fieldPanel/T1283238_OLAP_drag_and_drop_field.ts Removes legacy TestCafe OLAP drag-n-drop test.
e2e/testcafe-devextreme/tests/common/pivotGrid/fieldPanel/dragAndDropFieldItems.ts Removes legacy TestCafe field panel drag-n-drop tests.
e2e/testcafe-devextreme/tests/common/pivotGrid/fieldChooser/T1138119_dragAndDropAreaItems.ts Removes legacy TestCafe field chooser drag tests.
e2e/testcafe-devextreme/tests/common/pivotGrid/export/onExportingOption.ts Removes legacy TestCafe export callback test.
e2e/testcafe-devextreme/tests/common/pivotGrid/contextMenu.ts Removes legacy TestCafe context menu screenshot test.
e2e/testcafe-devextreme/tests/common/pivotGrid/const.ts Removes legacy TestCafe-only constants.
e2e/testcafe-devextreme/tests/common/pivotGrid/apiMocks/OLAP_api.mock.ts Removes legacy TestCafe OLAP RequestMock.
e2e/playwright/tsconfig.json Adds TS config for the Playwright E2E package.
e2e/playwright/tests/navigation/button/common.spec.ts Adds Playwright Button E2E coverage (states + API assertions + screenshots).
e2e/playwright/tests/editors/checkBox/common.spec.ts Adds Playwright CheckBox E2E coverage with model assertions.
e2e/playwright/tests/container.html Adds a dedicated Playwright test container page loading built artifacts and themes.
e2e/playwright/tests/common/pivotGrid/virtualScrolling_T1210807.spec.ts Migrates PivotGrid virtual scrolling screenshot test to Playwright.
e2e/playwright/tests/common/pivotGrid/sort/sortWithSummaryDisplayMode_T1173442.spec.ts Migrates PivotGrid sorting screenshot test to Playwright.
e2e/playwright/tests/common/pivotGrid/sort/localSort_T1150523.spec.ts Migrates PivotGrid sort vs reload behavior to Playwright with request logging.
e2e/playwright/tests/common/pivotGrid/scrolling.spec.ts Migrates PivotGrid scrolling matrix screenshot tests to Playwright.
e2e/playwright/tests/common/pivotGrid/runningTotal/runningTotal.spec.ts Migrates PivotGrid running total screenshot tests to Playwright.
e2e/playwright/tests/common/pivotGrid/kbn/rowHeaders.spec.ts Migrates PivotGrid row header keyboard navigation tests to Playwright.
e2e/playwright/tests/common/pivotGrid/kbn/fieldChooser.spec.ts Migrates PivotGrid field chooser keyboard/focus tests to Playwright.
e2e/playwright/tests/common/pivotGrid/kbn/expandIcon.spec.ts Migrates PivotGrid expandable cell focus outline screenshot test to Playwright.
e2e/playwright/tests/common/pivotGrid/kbn/columnHeaders.spec.ts Migrates PivotGrid column header keyboard navigation tests to Playwright.
e2e/playwright/tests/common/pivotGrid/headerFilter.spec.ts Migrates PivotGrid header filter tests to Playwright using List model.
e2e/playwright/tests/common/pivotGrid/fieldPanel/T1283238_OLAP_drag_and_drop_field.spec.ts Migrates OLAP drag-n-drop test to Playwright with route-based mocks.
e2e/playwright/tests/common/pivotGrid/fieldPanel/dragAndDropFieldItems.spec.ts Migrates field panel drag-in-progress screenshot tests to Playwright.
e2e/playwright/tests/common/pivotGrid/fieldChooser/T1138119_dragAndDropAreaItems.spec.ts Migrates field chooser drag direction screenshot tests to Playwright.
e2e/playwright/tests/common/pivotGrid/export/onExportingOption.spec.ts Migrates export callback test to Playwright.
e2e/playwright/tests/common/pivotGrid/contextMenu.spec.ts Migrates context menu width screenshot test to Playwright.
e2e/playwright/tests/common/pivotGrid/apiMocks/OLAP_measure_groups_response.ts Adds XMLA mock payload for Playwright OLAP tests.
e2e/playwright/tests/common/pivotGrid/apiMocks/OLAP_api.mock.ts Adds Playwright route-based OLAP API mock helper.
e2e/playwright/serve.mjs Adds static HTTP server for Playwright component test pages (repo-root document root).
e2e/playwright/runner.mjs Adds CLI-compatible runner translating legacy flags into Playwright CLI args.
e2e/playwright/README.md Adds documentation for running/writing Playwright component E2E tests.
e2e/playwright/project.json Adds Nx project definition for Playwright E2E lint/test targets.
e2e/playwright/playwright.config.ts Adds Playwright config for component tests (themes/timezones, screenshot budgets, webServer).
e2e/playwright/package.json Adds package manifest for Playwright E2E project scripts/deps.
e2e/playwright/models/types.ts Adds widget/type mapping scaffold for model typing.
e2e/playwright/models/treeView/treeViewNode.ts Adds TreeView node model used by PivotGrid field chooser tests.
e2e/playwright/models/treeView/index.ts Adds TreeView widget model.
e2e/playwright/models/popup.ts Adds Popup model used by PivotGrid field chooser popup interactions.
e2e/playwright/models/pivotGrid/rowsArea.ts Adds PivotGrid rows area model helpers.
e2e/playwright/models/pivotGrid/rowHeaderArea.ts Adds PivotGrid row header area model.
e2e/playwright/models/pivotGrid/overlay.ts Adds PivotGrid-specific overlay helper (invisible detection).
e2e/playwright/models/pivotGrid/index.ts Adds PivotGrid widget model API used by migrated tests.
e2e/playwright/models/pivotGrid/headerFilter.ts Adds PivotGrid header filter icon model.
e2e/playwright/models/pivotGrid/filterHeaderArea.ts Adds PivotGrid filter header area model.
e2e/playwright/models/pivotGrid/fieldChooser.ts Adds PivotGrid field chooser model.
e2e/playwright/models/pivotGrid/dataHeaderArea.ts Adds PivotGrid data header area model.
e2e/playwright/models/pivotGrid/columnsArea.ts Adds PivotGrid columns area model helpers.
e2e/playwright/models/pivotGrid/columnHeaderArea.ts Adds PivotGrid column header area model (including popup-scoped locators).
e2e/playwright/models/overlay.ts Adds generic Overlay widget model.
e2e/playwright/models/list/item.ts Adds List item model used by header filter tests.
e2e/playwright/models/list/index.ts Adds List widget model.
e2e/playwright/models/list/checkBox.ts Adds List item checkbox model.
e2e/playwright/models/internal/widget.ts Adds base widget model with jQuery instance invocation utilities.
e2e/playwright/models/internal/hasClass.ts Adds helper for class presence checks on locators.
e2e/playwright/models/dataGrid/headers/headerFilter.ts Adds DataGrid-style header filter popup model reused in PivotGrid tests.
e2e/playwright/models/checkBox.ts Adds CheckBox widget model.
e2e/playwright/models/button.ts Adds Button widget model.
e2e/playwright/helpers/themeUtils.ts Adds theme-name utilities for screenshot naming and theme switching.
e2e/playwright/helpers/testPageUtils.ts Adds helpers to open container page, switch themes, reset state.
e2e/playwright/helpers/screenshots.ts Adds screenshot helper wrapping toHaveScreenshot with theme postfixing and optional compact pass.
e2e/playwright/helpers/requestLogger.ts Adds request counter helper mirroring TestCafe RequestLogger behavior.
e2e/playwright/helpers/mockDate.ts Adds date mocking helpers based on Playwright clock.
e2e/playwright/helpers/generateOptionMatrix.ts Adds option-matrix generator used by migrated matrix tests.
e2e/playwright/helpers/dragUtils.ts Adds drag helpers to reproduce TestCafe drag behaviors (including “drag in progress”).
e2e/playwright/helpers/domUtils.ts Adds DOM helper functions (attributes, element insertion, stylesheet injection, blur).
e2e/playwright/helpers/createWidget.ts Adds widget factory with function/date serialization to preserve handler/date options.
e2e/playwright/helpers/const.ts Adds shared constants (server port, default theme, container URL, viewport).
e2e/playwright/helpers/apiMock.ts Adds Playwright route-based API mocking helper to replace TestCafe RequestMock.
e2e/playwright/fixtures.ts Adds Playwright fixtures to preload the container page and apply theme/viewport.
e2e/playwright/eslint.config.mjs Adds local eslint config for the Playwright E2E package.
e2e/playwright/docker/run.sh Adds container runner for component Playwright E2E tests (including UI mode).
e2e/playwright/docker/Dockerfile Adds Docker image to mirror CI environment for component Playwright tests.
e2e/playwright/.gitignore Ignores Playwright artifacts folder.
apps/vue/test.js Removes legacy TestCafe playground test stub.
apps/vue/runner.js Removes legacy TestCafe playground runner.
apps/vue/project.json Removes TestCafe test exclusion now that file is deleted.
apps/vue/package.json Removes legacy TestCafe test script.
apps/react/test.js Removes legacy TestCafe playground test stub.
apps/react/runner.js Removes legacy TestCafe playground runner.
apps/react/project.json Removes TestCafe test exclusion now that file is deleted.
apps/react/package.json Removes legacy TestCafe test script.
.github/workflows/wrapper_tests_e2e.yml Switches wrapper e2e CI to Playwright and uploads report/traces on failure.
.github/workflows/lint.yml Adds lint step for the new Playwright E2E project.
.github/workflows/default_workflow.yml Includes the Playwright E2E project in the default workflow project list.
Files not reviewed (1)
  • pnpm-lock.yaml: Generated file

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

Comment thread e2e/playwright/tests/common/pivotGrid/scrolling.spec.ts
…t on bash 3.2 and the request counter baseline
Copilot AI review requested due to automatic review settings August 28, 2026 01:14

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Pull request overview

Copilot reviewed 123 out of 220 changed files in this pull request and generated no new comments.

Files not reviewed (1)
  • pnpm-lock.yaml: Generated file
Suppressed comments (1)

e2e/playwright/tests/common/pivotGrid/scrolling.spec.ts:58

  • scrolling.mode is set to 'standart', but PivotGrid ScrollMode only allows 'standard' | 'virtual' (see packages/devextreme/js/common.d.ts:669). Using an unsupported value can make the test exercise a fallback path and can produce misleading screenshots/test names.

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Pull request overview

Copilot reviewed 148 out of 1130 changed files in this pull request and generated 1 comment.

Suppressed comments (1)

e2e/playwright/helpers/machineTimezones.ts:14

  • getMachineTimezone treats an empty TIMEZONE env var as a real value (""), which makes getTimezoneTest skip all timezone-scoped tests. This repo already treats empty matrix env vars as "unset" (see readEnv in helpers/const.ts), so this should do the same.

Comment on lines +19 to +35
const serializeOptions = (options: unknown): string => JSON.stringify(
options,
// eslint-disable-next-line func-names
function (this: Record<string, unknown>, key: string, value: unknown) {
const raw = this[key];

if (typeof raw === 'function') {
return `${FUNCTION_MARK}${raw.toString()}`;
}

if (raw instanceof Date) {
return `${DATE_MARK}${raw.toISOString()}`;
}

return value;
},
);
Copilot AI review requested due to automatic review settings August 28, 2026 12:37

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Pull request overview

Copilot reviewed 138 out of 1815 changed files in this pull request and generated 4 comments.

Suppressed comments (1)

e2e/playwright/tests/common/pivotGrid/scrolling.spec.ts:58

  • scrolling.mode is set to 'standart', which is not a valid PivotGrid scrolling mode (expected 'standard'). This can make the test exercise fallback behavior instead of the intended scrolling implementation.

Comment thread e2e/playwright/serve.mjs

// The test page pulls the built library and the themes straight out of the repository,
// so the whole repository is the document root.
const root = path.resolve(import.meta.dirname, '../..');
Comment thread e2e/wrappers/serve.mjs
process.exit(1);
}

const root = path.resolve(import.meta.dirname, distDir);
[true, false].forEach((rtlEnabled) => {
// The TestCafe fixture gave every combination the same name; Playwright needs each one to
// carry the parameters that tell it apart.
test(`Appointemt form tests (view=${currentView}, rtl=${rtlEnabled})`, async ({ page }) => {
Comment thread e2e/wrappers/README.md
Comment on lines +4 to +5
They run on [Playwright](https://playwright.dev/) and use the system Google Chrome
(`channel: 'chrome'`), so no browser download is needed.
Copilot AI review requested due to automatic review settings August 28, 2026 13:22

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Pull request overview

Copilot reviewed 138 out of 1815 changed files in this pull request and generated 2 comments.

Suppressed comments (2)

e2e/playwright/serve.mjs:48

  • filePath is built with path.join(root, decodeURIComponent(pathname)). Because pathname starts with /, path.join drops root and the server will try to read from the filesystem root (and then reject it), making requests like /e2e/playwright/tests/container.html and /packages/devextreme/... return 404. This will prevent the Playwright container page from loading its scripts/styles.
    e2e/playwright/helpers/generateOptionMatrix.ts:66
  • This filter indexes item and itemToExclude with a string key from Object.keys, which is a TypeScript error for generic T/Partial<T> (TS7053). Cast the keys to (keyof T)[] so the file type-checks.

import Scheduler from '../../../../models/scheduler';
import createScheduler from './init/widget.setup';

test('Should drag appoinment to the previous day`s cell (T1025952)', async ({ page }) => {
'viewSwitcher',
];

test('Scheduler default toolbar should works', async ({ page }) => {
Copilot Bot review requested due to automatic review settings August 28, 2026 14:39

ghost left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Pull request overview

Copilot reviewed 138 out of 1815 changed files in this pull request and generated 2 comments.

Suppressed comments (1)

e2e/playwright/tests/common/pivotGrid/scrolling.spec.ts:59

  • scrolling.mode is set to 'standart', which is not a valid PivotGrid scrolling mode (expected 'standard'). This makes the test exercise an unintended code path (likely relying on fallback behavior) and also propagates the typo into the test title via ${mode}.

[true, false].forEach((rtlEnabled) => {
// The TestCafe fixture gave every combination the same name; Playwright needs each one to
// carry the parameters that tell it apart.
test(`Appointemt form tests (view=${currentView}, rtl=${rtlEnabled})`, async ({ page }) => {
import Scheduler from '../../../../models/scheduler';
import createScheduler from './init/widget.setup';

test('Should drag appoinment to the previous day`s cell (T1025952)', async ({ page }) => {
Copilot Bot review requested due to automatic review settings August 29, 2026 08:58

ghost left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Pull request overview

Copilot reviewed 138 out of 1815 changed files in this pull request and generated 2 comments.

Suppressed comments (1)

e2e/playwright/tests/common/pivotGrid/scrolling.spec.ts:59

  • scrolling.mode is set to 'standart', which is not a valid PivotGrid scrolling mode ('standard'). This makes these tests rely on fallback behavior and also bakes the typo into the test titles via ${mode}.

Comment on lines +3 to +7
export const hasClass = async (locator: Locator, className: string): Promise<boolean> => {
const classes = await locator.getAttribute('class');

return classes?.split(' ').includes(className) ?? false;
};
Comment thread pnpm-workspace.yaml
Comment on lines 93 to 95
"@babel/eslint-parser": 7.29.7
"@playwright/test": 1.62.1
"@eslint-stylistic/metadata": ^2.13.0
Copilot Bot review requested due to automatic review settings August 29, 2026 09:07

ghost left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Pull request overview

Copilot reviewed 138 out of 1815 changed files in this pull request and generated no new comments.

Suppressed comments (1)

e2e/playwright/tests/common/pivotGrid/scrolling.spec.ts:58

  • scrolling.mode is set to 'standart', which is not a valid PivotGrid scrolling mode (expected 'standard'). This makes the test rely on fallback behavior and may miss the intended code path.

Copilot Bot review requested due to automatic review settings August 29, 2026 10:50

ghost left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Pull request overview

Copilot reviewed 136 out of 1820 changed files in this pull request and generated 3 comments.

Suppressed comments (1)

e2e/playwright/tests/common/pivotGrid/scrolling.spec.ts:58

  • scrolling.mode is set to 'standart', but the PivotGrid scrolling mode used elsewhere in this file is 'standard'. Using a misspelled mode here can make the test exercise a different/fallback code path and break the parameterized screenshot naming.

@@ -0,0 +1,38 @@
import { test } from '../../../../fixtures';
Comment on lines +1 to +6
import { expect, test } from '../../fixtures';
import { createWidget } from '../../helpers/createWidget';
import Scheduler from '../../models/scheduler';

// Keeps the ported page object honest while the Scheduler tests themselves are still on TestCafe.
test('Scheduler page object reaches the toolbar, the work space and the appointments', async ({ page }) => {
@@ -0,0 +1,38 @@
import { expect, test } from '../../../../fixtures';
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants