Execute scheduler.scrollToDate function in IE not working properly.

[emir@cybernetics.se]

Hi,

When you execute scheduler.scrollToDate function on certain events such as timeAxisDblClick and beforeEventSave, scrollbar scrolls to given dates on every browser, except on IE. On IE it defaults to start of timespan, for example, in Day view, timespan 24.06-26.06 , when i save event on 25.06 on time 17hours, i set scrollToDate 2 hours before event. ON chrome, edge, firefox it works properly, on IE it sets scroll to left, 24.06: 00:00/


Best regards
Emir

[mats]

How do we reproduce this? Possible on our samples?

[emir@cybernetics.se]

Hi Mats,
To reproduce the error, you need to create your own code running in the beforeEventSave event which call function schedulerEngine.scrollToDate to set vertical sroll. For example, set datum and time to 2019-06-25 21:00 o’clock. This works in all browsers except IE. It looks like that in IE hour will be ignored and always been set to 00:00.
We have a react application using the scheduler component and it is not to ease to use your sample to reproduce error.

Sincerely, Emir

[mats]

Please show the code you use to call scrollToDate.

[emir@cybernetics.se]

Hi,

<Scheduler
            ref={reference}
            scrollOnMount={this.scrollOnMount}
            language={language}
           listeners={{
              thisObj: this,
              beforeEventEdit({ eventRecord, resourceRecord, source }) {
                const { data: { CinemaId, id } } = resourceRecord;
                if (readonly) {
                  return false;
                }
                const { Status, cyberneticsIds, notEditable } = eventRecord;
                const { PRELIMINARY } = EVENT_STATUSES_IDS_BY_NAME;

                if ((cyberneticsIds && cyberneticsIds.indexOf(entityId) === -1) || notEditable) {
                  return false;
                }

                this.setAdditionalFieldsOnModal(eventRecord, source);

                eventRecord.CinemaId = CinemaId;
                eventRecord.ScreenId = id;
                eventRecord.Status = Status || PRELIMINARY;
              },
              scheduleDblClick(args) {
                const { isCreateAllowed } = this.props;
                const {
                  resourceRecord: {
                    data: {
                      leaf,
                    },
                  },
                } = args;
                if (!leaf || !isCreateAllowed || readonly) return false;
              },
              beforeDragCreate(args) {
                const { isCreateAllowed } = this.props;
                const {
                  resourceRecord: {
                    data: {
                      leaf,
                    },
                  },
                } = args;
                if (!leaf || !isCreateAllowed || readonly) return false;
              },
              eventContextMenuBeforeShow() {
                return false;
              },
              beforeEventSave({ eventRecord, values }) {
                if (readonly) {
                  return false;
                }
                const { cyberneticsIds } = eventRecord;
                const { current } = reference;
                values.cyberneticsIds = cyberneticsIds || [];

                onEventSave(values);
                const start = moment(values.startDate).subtract(2, 'hours').toDate();
                current.schedulerEngine.scrollToDate(start, { block: 'start' });

                return false;
              },
              beforeEventDelete(args) {
                const { eventRecord: { Id, Status } } = args;
                const { CONFIRMED } = EVENT_STATUSES_IDS_BY_NAME;

                if (Status === CONFIRMED || readonly) return false;

                onEventDelete(Id);
                return false;
              },
              timeAxisHeaderClick() {
                return false;
              },
              timeAxisHeaderDblClick({ start, end, event: { target } }) {
                const { current } = reference;
                const headerPosition = target.getAttribute('headerposition');
                this.handleDoubleClick(start, end);
                this.setViewPresetByHeader(headerPosition);
                current.schedulerEngine.scrollToDate(start, { block: 'start' });
                return false;
              },
              scheduleContextMenuBeforeShow() {
                return false;
              },
              headerContextMenuBeforeShow() {
                return false;
              },
              cellContextMenuBeforeShow() {
                if (readonly) {
                  return false;
                }
              },
            }}

[mats]

Please use CODE tags when posting code.

1. What's the actual value of the date you're trying to scroll to? Set a breakpoint to make sure it's what you expect
2. Regarding your "timeAxisHeaderDblClick" code, we already zoom to the clicked span if you double click the time axis, have you disabled our built-in zooming?

[emir@cybernetics.se]

Hi,

1. Value of date is correct berceuse everything works in chromu , firefoxu and edg. Exempel: Wed Apr 24 2019 16:00:00 GMT+0200 (Central European Summer Time)
2. We used timeAxisHeaderDblClick only in code which we send to you, to validate datum value instead for breakpoint. It is not part of our code in production solution.

[mats]

1. You should check in IE and compare the value, is it the same value?

[emir@cybernetics.se]

Hi,

Yes, i check and it is same datetime in the IE and chrome.

IE: Mon Jun 24 2019 02:00:00 GMT+0200 (W. Europe Daylight Time)

Chrome: Mon Jun 24 2019 02:00:00 GMT+0200 (Central European Summer Time)

Differens is only (W. Europe Daylight Time) vs. (Central European Summer Time)

//Emir

[mats]

Ok, then you just need to try to reproduce this in our demos. Should be simple I suppose if it's a clear bug. Once you succeed, please let us know how.