From 4728dfb518b75546983dca4696b519fefcd126c0 Mon Sep 17 00:00:00 2001 From: EugeniyKiyashko Date: Mon, 26 Oct 2026 17:36:39 +0400 Subject: [PATCH 1/2] Visual tests: hide or wait out scrollbar thumbs and wait for async templates before screenshots --- e2e/testcafe-devextreme/tests/common/gantt/common.ts | 5 ++++- .../tests/dataGrid/common/scrolling.ts | 10 +++++++++- .../tests/navigation/scrollable/visibility.ts | 8 +++++++- 3 files changed, 20 insertions(+), 3 deletions(-) diff --git a/e2e/testcafe-devextreme/tests/common/gantt/common.ts b/e2e/testcafe-devextreme/tests/common/gantt/common.ts index 0a30228449e8..475d90d296cc 100644 --- a/e2e/testcafe-devextreme/tests/common/gantt/common.ts +++ b/e2e/testcafe-devextreme/tests/common/gantt/common.ts @@ -4,10 +4,11 @@ import { Selector } from 'testcafe'; import { testScreenshot } from '../../../helpers/themeUtils'; import url from '../../../helpers/getPageUrl'; import { createWidget } from '../../../helpers/createWidget'; -import { appendElementTo } from '../../../helpers/domUtils'; +import { appendElementTo, insertStylesheetRulesToPage } from '../../../helpers/domUtils'; import { Themes } from '../../../helpers/themes'; const TOOLBAR_ITEM_BUTTON = '.dx-button'; +const HIDDEN_SCROLLBAR_THUMB_STYLE = '.dx-gantt .dx-scrollable-scroll { visibility: hidden !important; }'; fixture`Gantt` .page(url(__dirname, '../../container-extended.html')); @@ -128,6 +129,7 @@ test.meta({ themes: [Themes.materialBlue] })('Gantt - show resources button shou .expect(compareResults.isValid()) .ok(compareResults.errorMessages()); }).before(async () => { + await insertStylesheetRulesToPage(HIDDEN_SCROLLBAR_THUMB_STYLE); const id = `${new Guid()}`; await appendElementTo('#container', 'div', id, {}); await createWidget('dxGantt', { @@ -149,6 +151,7 @@ test('Gantt - show dependencies button should not have focus state (T1264485)', .expect(compareResults.isValid()) .ok(compareResults.errorMessages()); }).before(async () => { + await insertStylesheetRulesToPage(HIDDEN_SCROLLBAR_THUMB_STYLE); const id = `${new Guid()}`; await appendElementTo('#container', 'div', id, {}); await createWidget('dxGantt', { diff --git a/e2e/testcafe-devextreme/tests/dataGrid/common/scrolling.ts b/e2e/testcafe-devextreme/tests/dataGrid/common/scrolling.ts index 2fdc489ba382..0b32227eb994 100644 --- a/e2e/testcafe-devextreme/tests/dataGrid/common/scrolling.ts +++ b/e2e/testcafe-devextreme/tests/dataGrid/common/scrolling.ts @@ -2063,7 +2063,15 @@ test('Last group should not disappear after collapsing another subgroup with vir // act await dataGrid.scrollTo(t, { top: 200 }); await dataGrid.scrollTo(t, { top: 600 }); - await t.expect(dataGrid.isReady()).ok(); + await t + .expect(dataGrid.isReady()) + .ok() + .expect(dataGrid.isVirtualRowIntersectViewport()) + .notOk() + .expect(dataGrid.getFixedDataCell(12, 0).element.textContent) + .eql('12') + .expect(dataGrid.getFixedDataCell(19, 0).element.textContent) + .eql('19'); // assert await testScreenshot(t, takeScreenshot, `grid-${scrollingMode}-scrolling-T1152498.png`, { element: '#container' }); diff --git a/e2e/testcafe-devextreme/tests/navigation/scrollable/visibility.ts b/e2e/testcafe-devextreme/tests/navigation/scrollable/visibility.ts index afcf1abcc073..b827058719bf 100644 --- a/e2e/testcafe-devextreme/tests/navigation/scrollable/visibility.ts +++ b/e2e/testcafe-devextreme/tests/navigation/scrollable/visibility.ts @@ -4,12 +4,14 @@ import Scrollable from 'devextreme-testcafe-models/scrollView/internal/scrollabl import { testScreenshot } from '../../../helpers/themeUtils'; import url from '../../../helpers/getPageUrl'; import { createWidget } from '../../../helpers/createWidget'; -import { appendElementTo } from '../../../helpers/domUtils'; +import { appendElementTo, insertStylesheetRulesToPage } from '../../../helpers/domUtils'; fixture.disablePageReloads`Scrollable_visibility_integration` .page(url(__dirname, '../../container.html')); type ScrollableDirection = 'both' | 'horizontal' | 'vertical'; +const PINNED_SCROLLBAR_THUMB_STYLE = '#scrollable .dx-scrollable-scroll { opacity: 1 !important; transition: none !important; }'; + (['both'] as ScrollableDirection[]).forEach((direction) => { [false, true].forEach((useNative) => { [false, true].forEach((rtlEnabled) => { @@ -42,6 +44,10 @@ type ScrollableDirection = 'both' | 'horizontal' | 'vertical'; .expect(compareResults.isValid()) .ok(compareResults.errorMessages()); }).before(async () => { + if (useNative && useSimulatedScrollbar) { + await insertStylesheetRulesToPage(PINNED_SCROLLBAR_THUMB_STYLE); + } + await appendElementTo('#container', 'div', 'scrollable'); await appendElementTo('#scrollable', 'div', 'content', { From d7856eb19f5b1322698c1525a88c6cdc9a588a27 Mon Sep 17 00:00:00 2001 From: EugeniyKiyashko Date: Mon, 26 Oct 2026 17:58:49 +0400 Subject: [PATCH 2/2] Scrollable visual tests: re-shoot the pinned-thumb etalons from 26_1 CI --- ...useSimScrollbar=true (fluent.blue.light).png | Bin 299 -> 328 bytes ...useSimScrollbar=true (fluent.blue.light).png | Bin 299 -> 330 bytes ...useSimScrollbar=true (fluent.blue.light).png | Bin 299 -> 328 bytes ...useSimScrollbar=true (fluent.blue.light).png | Bin 299 -> 330 bytes 4 files changed, 0 insertions(+), 0 deletions(-) diff --git a/e2e/testcafe-devextreme/tests/navigation/scrollable/etalons/Scroll position after show, useNative=true,rtl=false,useSimScrollbar=true (fluent.blue.light).png b/e2e/testcafe-devextreme/tests/navigation/scrollable/etalons/Scroll position after show, useNative=true,rtl=false,useSimScrollbar=true (fluent.blue.light).png index 97434201690064c1f65feff42b853e6e3d5d5ba1..0b8dc30b378c06450cb36cfd2018c7bcbdac3e4d 100644 GIT binary patch literal 328 zcmeAS@N?(olHy`uVBq!ia0vp^DIm8hyVZp literal 299 zcmeAS@N?(olHy`uVBq!ia0vp^DIm`9L=I_{rT;fs#P@ll598x4@5tm!{F)a=d#Wzp$Pyb CvXB-4 literal 299 zcmeAS@N?(olHy`uVBq!ia0vp^DIm8hyVZp literal 299 zcmeAS@N?(olHy`uVBq!ia0vp^DIm`9L=I_{rT;fs#P@ll598x4@5tm!{F)a=d#Wzp$Pyb CvXB-4 literal 299 zcmeAS@N?(olHy`uVBq!ia0vp^DIm