Scroll dragging over the schedule

[Gonzalo Trujillo Almeida]

Hi,

I think that doesn't exists a native option in the ScheduleComponent to make vertical and horizontal scroll dragging the mouse over the component, like the behavior in mobile devices with touch events.

I want to implement this feature manually in timeline views. I have a code with a dedicated service and it works well if I click with the mouse left button and move the cursor over the component. However if I move it over the component but release it outside, when I hover the component again, the scroll still moves if I move the cursor over the component.

It seems that in this case, the scroll behavior still work and not stop it although I'm not clicking the mouse button. The method that I use to make the scroll, seems not fired when this wrong behavior occurs.

I don't know if this implementation may have some collision with other events or styles of the component, therefore I write this post.

I made have a demo to reproduce this and this is the stackblitz url: https://stackblitz.com/edit/angular-d8xfgh7p?file=src%2Fscroll.service.ts

I appreciate any help with this issue, thank you

[Swathi Ravi]

Hi Gonzalo,

Thank you for reaching out!

Your reported problem is considered a bug. The fix for this defect will be included in our upcoming weekly patch release, which is expected to be rolled out by January 7, 2025. You can track the status of the fix at the following link:

 

Feedback: Scroll Dragging Persists After Releasing Mouse Button Outside the Schedule Component in Angular | Feedback Portal

 

Disclaimer: Inclusion of this solution in the weekly release may change due to other factors including but not limited to QA checks and works reprioritization.

Regards,

Swathi

[Gonzalo Trujillo Almeida]

Hi Swathi,

Thank you for your answer. I will keep an eye on the bug fix

[Swathi Ravi]

Gonzalo,

You are most welcome! We will let you know once the fix is included.

[Swathi Ravi]

Hi Gonzalo,

We are glad to announce that our weekly release (V28.1.38) has been rolled out successfully. The fix for the issue has been included in our weekly release (28.1.38). Upgrade to the latest version to resolve the issue.

 

Release notes: https://ej2.syncfusion.com/angular/documentation/release-notes/28.1.38?type=all#schedule

Feedback: Scroll dragging persists after releasing mouse button outside the Scheduler in Angular | Feedback Portal

Sample: Wm23by4j (forked) - StackBlitz

Root Cause: The root cause of this issue is that, mousemove event is still on even when mouse leaves the scheduler which is the cause of the issue.

We thank you for your support and appreciate your patience in waiting for this release. Please get in touch with us if you would require any further assistance.

Regards,

Swathi

[Gonzalo Trujillo Almeida]

Hi Swathi,

Thank you for your help. I updated the packages in my project but the bug still persist. 

I have only explicitly set this two syncfusion dependencies in the package.json:

"@syncfusion/ej2-angular-navigations": "28.1.33",

"@syncfusion/ej2-angular-schedule": "28.1.38",

Although I know that more dependencies are installed automatically. Maybe it could be a bug with some dependency that I don't have in the correct version? In which packages was the bug fix implemented?

Thanks in advance

[Swathi Ravi]

Gonzalo,

We have reviewed the issue with the two packages you shared but were unable to replicate the problem on our end. For your reference, we have attached a sample.

If you are still experiencing the issue, please follow these steps:

1. Ensure all Syncfusion components are using the same major version.
2. Delete the @syncfusion folder from the node_modules directory and the package-lock.json file from your project's root folder.
3. Clear the npm cache.
4. Update all Syncfusion packages to the same major version.
5. Run npm install to reinstall the node modules.

Let us know if the issue persists after following these steps.

Attachment: ej2angularscheduler_1249f97e.zip

[Gonzalo Trujillo Almeida]

Hi Swathi,

I realized that I have a few changes in the scroll.service. I put it like the example code and it works.

Thank you very much for your help.

[Swathi Ravi]

Gonzalo,

You are welcome! Get back to us if you need any further assistance.