Skip to content

Commit b09f20f

Browse files
authored
Scheduler: fix several days appointment resize (T1294528) (DevExpress#30494)
Co-authored-by: Vladimir Bushmanov <[email protected]>
1 parent 16faaae commit b09f20f

File tree

7 files changed

+387
-47
lines changed

7 files changed

+387
-47
lines changed
Lines changed: 233 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,233 @@
1+
import Scheduler from 'devextreme-testcafe-models/scheduler';
2+
import url from '../../../../helpers/getPageUrl';
3+
import { getTimezoneTest, MACHINE_TIMEZONES } from '../../../../helpers/machineTimezones';
4+
import createScheduler from './init/widget.setup';
5+
6+
fixture.disablePageReloads`Resize all day panel appointments`
7+
.page(url(__dirname, '../../../container.html'));
8+
9+
[true, false].forEach((rtlEnabled) => {
10+
test(`Resize all day appointment rtlEnabled=${rtlEnabled}`, async (t) => {
11+
const scheduler = new Scheduler('#container');
12+
const appointment = scheduler.getAppointment('Appointment');
13+
const { left, right } = appointment.resizableHandle;
14+
const text = 'February 9, 2015, ';
15+
const startDateExtendedText = 'February 8, 2015 - February 9, 2015, ';
16+
const endDateExtendedText = 'February 9, 2015 - February 10, 2015, ';
17+
18+
await t
19+
.drag(right, 100, 0)
20+
.expect(appointment.getAriaLabel())
21+
.eql(rtlEnabled ? startDateExtendedText : endDateExtendedText);
22+
await t
23+
.drag(right, -100, 0)
24+
.expect(appointment.getAriaLabel())
25+
.eql(text);
26+
await t
27+
.drag(left, -100, 0)
28+
.expect(appointment.getAriaLabel())
29+
.eql(rtlEnabled ? endDateExtendedText : startDateExtendedText);
30+
await t
31+
.drag(left, 100, 0)
32+
.expect(appointment.getAriaLabel())
33+
.eql(text);
34+
}).before(async () => createScheduler({
35+
currentDate: new Date(2015, 1, 9),
36+
currentView: 'week',
37+
firstDayOfWeek: 0,
38+
rtlEnabled,
39+
height: 400,
40+
dataSource: [{
41+
text: 'Appointment',
42+
startDate: new Date(2015, 1, 9, 8),
43+
endDate: new Date(2015, 1, 9, 10),
44+
allDay: true,
45+
}],
46+
}));
47+
48+
getTimezoneTest([MACHINE_TIMEZONES.EuropeBerlin])(`Shrink long appointment endDate rtlEnabled=${rtlEnabled}`, async (t) => {
49+
const scheduler = new Scheduler('#container');
50+
const appointment = scheduler.getAppointment('Appointment');
51+
const { left, right } = appointment.resizableHandle;
52+
53+
// eslint-disable-next-line @typescript-eslint/no-unused-expressions
54+
rtlEnabled
55+
? await t.drag(right, -100, 0)
56+
: await t.drag(left, 100, 0);
57+
await t
58+
.expect(appointment.getAriaLabel())
59+
.eql('February 10, 2015, ')
60+
.expect(appointment.getTime())
61+
.eql('12:00 AM - 10:00 AM');
62+
}).before(async () => createScheduler({
63+
currentDate: new Date(2015, 1, 9),
64+
currentView: 'week',
65+
firstDayOfWeek: 0,
66+
rtlEnabled,
67+
height: 400,
68+
dataSource: [{
69+
text: 'Appointment',
70+
startDate: new Date(2015, 1, 9, 8),
71+
endDate: new Date(2015, 1, 10, 10),
72+
}],
73+
}));
74+
75+
getTimezoneTest([MACHINE_TIMEZONES.EuropeBerlin])(`Shrink long appointment startDate rtlEnabled=${rtlEnabled}`, async (t) => {
76+
const scheduler = new Scheduler('#container');
77+
const appointment = scheduler.getAppointment('Appointment');
78+
const { left, right } = appointment.resizableHandle;
79+
80+
// eslint-disable-next-line @typescript-eslint/no-unused-expressions
81+
rtlEnabled
82+
? await t.drag(left, 100, 0)
83+
: await t.drag(right, -100, 0);
84+
await t
85+
.expect(appointment.getAriaLabel())
86+
.eql('February 9, 2015 - February 10, 2015, ')
87+
.expect(appointment.getTime())
88+
.eql('8:00 AM - 12:00 AM');
89+
}).before(async () => createScheduler({
90+
currentDate: new Date(2015, 1, 9),
91+
currentView: 'week',
92+
firstDayOfWeek: 0,
93+
rtlEnabled,
94+
height: 400,
95+
dataSource: [{
96+
text: 'Appointment',
97+
startDate: new Date(2015, 1, 9, 8),
98+
endDate: new Date(2015, 1, 10, 10),
99+
}],
100+
}));
101+
102+
getTimezoneTest([MACHINE_TIMEZONES.EuropeBerlin])(`Resize long appointment endDate with offset rtlEnabled=${rtlEnabled}`, async (t) => {
103+
const scheduler = new Scheduler('#container');
104+
const appointment = scheduler.getAppointment('Appointment');
105+
const { left, right } = appointment.resizableHandle;
106+
const drag = async () => (rtlEnabled
107+
? t.drag(left, 100, 0)
108+
: t.drag(right, -100, 0));
109+
110+
await drag();
111+
await t
112+
.expect(appointment.getAriaLabel())
113+
.eql('March 30, 2021 - March 31, 2021, ');
114+
await drag();
115+
await t
116+
.expect(appointment.getAriaLabel())
117+
.eql('March 30, 2021, ')
118+
.expect(appointment.getTime())
119+
.eql('5:00 AM - 6:00 AM');
120+
}).before(async () => createScheduler({
121+
dataSource: [{
122+
text: 'Appointment',
123+
startDate: new Date('2021-03-30T03:00:00.000Z'),
124+
endDate: new Date('2021-04-01T03:00:00.000Z'),
125+
}],
126+
currentView: 'week',
127+
currentDate: new Date(2021, 2, 28),
128+
height: 400,
129+
offset: 360,
130+
rtlEnabled,
131+
firstDayOfWeek: 0,
132+
}));
133+
134+
getTimezoneTest([MACHINE_TIMEZONES.EuropeBerlin])(`Resize long appointment startDate with offset rtlEnabled=${rtlEnabled}`, async (t) => {
135+
const scheduler = new Scheduler('#container');
136+
const appointment = scheduler.getAppointment('Appointment');
137+
const { left, right } = appointment.resizableHandle;
138+
const drag = async () => (rtlEnabled
139+
? t.drag(right, -100, 0)
140+
: t.drag(left, 100, 0));
141+
142+
await drag();
143+
await t
144+
.expect(appointment.getAriaLabel())
145+
.eql('March 30, 2021 - April 1, 2021, ');
146+
await drag();
147+
await t
148+
.expect(appointment.getAriaLabel())
149+
.eql('March 31, 2021 - April 1, 2021, ')
150+
.expect(appointment.getTime())
151+
.eql('6:00 AM - 5:00 AM');
152+
}).before(async () => createScheduler({
153+
dataSource: [{
154+
text: 'Appointment',
155+
startDate: new Date('2021-03-30T03:00:00.000Z'),
156+
endDate: new Date('2021-04-01T03:00:00.000Z'),
157+
}],
158+
currentView: 'week',
159+
currentDate: new Date('2021-03-30T03:00:00.000Z'),
160+
height: 400,
161+
offset: 360,
162+
rtlEnabled,
163+
firstDayOfWeek: 0,
164+
}));
165+
});
166+
167+
getTimezoneTest([MACHINE_TIMEZONES.EuropeBerlin])('Resize long appointment rtlEnabled=true', async (t) => {
168+
const scheduler = new Scheduler('#container');
169+
const appointment = scheduler.getAppointment('Appointment');
170+
const { left, right } = appointment.resizableHandle;
171+
172+
await t
173+
.drag(right, 100, 0)
174+
.expect(appointment.getAriaLabel())
175+
.eql('February 8, 2015 - February 10, 2015, ');
176+
await t
177+
.drag(right, -100, 0)
178+
.expect(appointment.getAriaLabel())
179+
.eql('February 9, 2015 - February 10, 2015, ');
180+
await t
181+
.drag(left, -100, 0)
182+
.expect(appointment.getAriaLabel())
183+
.eql('February 9, 2015 - February 12, 2015, ');
184+
await t
185+
.drag(left, 100, 0)
186+
.expect(appointment.getAriaLabel())
187+
.eql('February 9, 2015 - February 11, 2015, ');
188+
}).before(async () => createScheduler({
189+
currentDate: new Date(2015, 1, 9),
190+
currentView: 'week',
191+
firstDayOfWeek: 0,
192+
rtlEnabled: true,
193+
height: 400,
194+
dataSource: [{
195+
text: 'Appointment',
196+
startDate: new Date(2015, 1, 9, 8),
197+
endDate: new Date(2015, 1, 10, 10),
198+
}],
199+
}));
200+
201+
getTimezoneTest([MACHINE_TIMEZONES.EuropeBerlin])('Resize long appointment rtlEnabled=false', async (t) => {
202+
const scheduler = new Scheduler('#container');
203+
const appointment = scheduler.getAppointment('Appointment');
204+
const { left, right } = appointment.resizableHandle;
205+
206+
await t
207+
.drag(right, 100, 0)
208+
.expect(appointment.getAriaLabel())
209+
.eql('February 9, 2015 - February 12, 2015, ');
210+
await t
211+
.drag(right, -100, 0)
212+
.expect(appointment.getAriaLabel())
213+
.eql('February 9, 2015 - February 11, 2015, ');
214+
await t
215+
.drag(left, -100, 0)
216+
.expect(appointment.getAriaLabel())
217+
.eql('February 8, 2015 - February 11, 2015, ');
218+
await t
219+
.drag(left, 100, 0)
220+
.expect(appointment.getAriaLabel())
221+
.eql('February 9, 2015 - February 11, 2015, ');
222+
}).before(async () => createScheduler({
223+
currentDate: new Date(2015, 1, 9),
224+
currentView: 'week',
225+
firstDayOfWeek: 0,
226+
rtlEnabled: false,
227+
height: 400,
228+
dataSource: [{
229+
text: 'Appointment',
230+
startDate: new Date(2015, 1, 9, 8),
231+
endDate: new Date(2015, 1, 10, 10),
232+
}],
233+
}));

packages/devextreme/js/__internal/scheduler/appointments/m_appointment_collection.ts

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -720,8 +720,7 @@ class SchedulerAppointments extends CollectionWidget {
720720

721721
return getAppointmentDateRange({
722722
handles: e.handles,
723-
appointmentSettings: $element.data(APPOINTMENT_SETTINGS_KEY),
724-
isVerticalViewDirection: this.option('isVerticalViewDirection')(),
723+
appointmentSettings: $element.data(APPOINTMENT_SETTINGS_KEY) as any,
725724
isVerticalGroupedWorkSpace: this.option('isVerticalGroupedWorkSpace')(),
726725
appointmentRect: getBoundingRect($element[0]),
727726
parentAppointmentRect: getBoundingRect($element.parent()[0]),

0 commit comments

Comments
 (0)