在 dthmlx 组件中使用量角器拖放答案

【问题标题】：Drag and drop using protractor in dthmlx component在 dthmlx 组件中使用量角器拖放
【发布时间】：2014-12-30 13:30:55
【问题描述】：

我正在使用带角度的 dhtmlx 调度程序组件。 Dhtmlx scheduler您可以在时间轴视图的现场演示中找到事件的拖放。

我需要为它编写量角器测试用例。如何使用量角器执行 dhtmlx 组件的拖放？

【问题讨论】：

标签： angularjs protractor dhtmlx-scheduler

【解决方案1】：

Dhtmlx 调度程序页面上提供的演示不使用 Angular。我找到了another suitable demo page，我将使用它作为示例。

总体思路很简单——使用dragAndDrop() 函数。不幸的是，API documentation page 上没有记录。可能是因为它来自 webdriverjs 而量角器与它无关。无论如何，目前，您可以在这里找到一些信息和示例：

基本上，您可以通过x 或y 向左或向右或顶部或底部移动元素；或者，您可以移动到另一个元素。

这是一个示例（将Task #1 向右移动 1000）：

describe("Sample test", function () {
    beforeEach(function () {
        browser.get("http://dhtmlx.github.io/angular-gantt-demo/");
        browser.waitForAngular();
    });

    it("should move the task", function () {
        var task = element(by.xpath('//div[@class="gantt_bars_area"]//div[@task_id="2"]'));

        browser.actions().dragAndDrop(
            task,
            {x:1000, y:0}
        ).perform();

        browser.sleep(10000);
    });
});

或者，您可以手动链接mouseDown()、mouseMove()、mouseUp() 操作，示例：

【讨论】：