I am attempting to test application logic involving dragging and dropping points on a Gantt chart using an automated browser testing framework. Because of this, I cannot access Highcharts properties to simulate drag and drop interactions. I am instead relying on DOM element selectors and Mouse events to simulate the desired behavior.
So far, I have been able to successfully simulate "hover" and "click" interactions on the Gantt points. The method I have used to do so is roughly like so:
Hover:
Code: Select all
document.querySelector(<selector for Gantt point>).dispatchEvent(new MouseEvent('mouseover', {
bubbles: true,
cancelable: true,
}));
Click:
Code: Select all
document.querySelector(<selector for Gantt point>).dispatchEvent(new MouseEvent('mouseover', {
bubbles: true,
cancelable: true,
}));
document.querySelector(<selector for Gantt point>).dispatchEvent(new MouseEvent('click', {
bubbles: true,
cancelable: true,
}));
I have tried a similar flow for drag and drop by issuing a series of `mouseover`, `mousedown`, `mousemove` and `mouseup` events to the desired point, but with no success in getting the point to actually be moved on the chart. I am wondering if any one has experience attempting to accomplish this and/or can provide tips. Thanks!