diff --git a/e2e/testcafe-devextreme/tests/scheduler/virtualScrolling/appointments.ts b/e2e/testcafe-devextreme/tests/scheduler/virtualScrolling/appointments.ts index 7f38bce43cc3..e4dbae824a5b 100644 --- a/e2e/testcafe-devextreme/tests/scheduler/virtualScrolling/appointments.ts +++ b/e2e/testcafe-devextreme/tests/scheduler/virtualScrolling/appointments.ts @@ -1,4 +1,5 @@ import Scheduler from 'devextreme-testcafe-models/scheduler'; +import { createScreenshotsComparer } from 'devextreme-screenshot-comparer'; import { getStyleAttribute, setStyleAttribute } from '../../../helpers/domUtils'; import { createWidget } from '../../../helpers/createWidget'; import url from '../../../helpers/getPageUrl'; @@ -39,3 +40,48 @@ test.skip('Appointment should not repaint after scrolling if present on viewport }], }); }); + +test('The appointment should render correctly when scrolling vertically (T1263428)', async (t) => { + const scheduler = new Scheduler('#container'); + const { takeScreenshot, compareResults } = createScreenshotsComparer(t); + + await scrollTo(new Date('2024-11-12T09:00:00+0100')); + + await takeScreenshot('T1263428-virtual-scrolling-render-appointment.png', scheduler.element); + + await t + .expect(compareResults.isValid()) + .ok(compareResults.errorMessages()); +}).before(async () => { + await createWidget('dxScheduler', { + height: 500, + width: 900, + timeZone: 'Europe/Vienna', + dateSerializationFormat: 'yyyy-MM-ddTHH:mm:ssxx', + currentDate: new Date(2024, 10, 11, 20, 54, 23, 361), + cellDuration: 20, + firstDayOfWeek: 1, + startDayHour: 12.0, + endDayHour: 18.0, + allDayPanelMode: 'hidden', + scrolling: { + mode: 'virtual', + }, + crossScrollingEnabled: true, + currentView: 'week', + textExpr: 'Subject', + startDateExpr: 'StartDate', + endDateExpr: 'EndDate', + views: [{ + type: 'week', + groupByDate: true, + startDayHour: 6.0, + endDayHour: 22.0, + }], + dataSource: [{ + Subject: 'Website Re-Design Plan', + StartDate: new Date('2024-11-11T12:10:00+0100'), + EndDate: new Date('2024-11-12T21:00:00+0100'), + }], + }); +}); diff --git a/e2e/testcafe-devextreme/tests/scheduler/virtualScrolling/etalons/T1263428-virtual-scrolling-render-appointment.png b/e2e/testcafe-devextreme/tests/scheduler/virtualScrolling/etalons/T1263428-virtual-scrolling-render-appointment.png new file mode 100644 index 000000000000..d5178062bb8c Binary files /dev/null and b/e2e/testcafe-devextreme/tests/scheduler/virtualScrolling/etalons/T1263428-virtual-scrolling-render-appointment.png differ diff --git a/packages/devextreme/js/__internal/scheduler/appointments/rendering_strategies/m_strategy_vertical.ts b/packages/devextreme/js/__internal/scheduler/appointments/rendering_strategies/m_strategy_vertical.ts index 127723415116..461f9c290386 100644 --- a/packages/devextreme/js/__internal/scheduler/appointments/rendering_strategies/m_strategy_vertical.ts +++ b/packages/devextreme/js/__internal/scheduler/appointments/rendering_strategies/m_strategy_vertical.ts @@ -207,8 +207,8 @@ class VerticalRenderingStrategy extends BaseAppointmentsStrategy { vMax, vMin, } = appointmentSettings; - - const maxHeight = this.isVirtualScrolling ? vMax : vMax - vMin; + const { bottomVirtualRowHeight = 0 } = this.viewDataProvider.getViewOptions(); + const maxHeight = this.isVirtualScrolling ? vMax + bottomVirtualRowHeight : vMax - vMin; const hasTailPart = this.options.endViewDate > appointmentSettings.info.appointment.endDate; let left = Math.round(appointmentSettings.left + offset);