使用CasperJS，如何使鼠标操作以实现＆＃34;拖动＆＃34;？

Question

我使用＆＃34; http://104.238.150.223:8888＆＃34;为了测试它，这是一个我们可以用鼠标绘制的html，我的代码如下：

var casper = require('casper').create();
var mouse = require('mouse').create(casper);

casper.start('http://104.238.150.223:8888',function() {
    this.echo(this.getTitle());
});

casper.then(function() {
    this.wait(2000,function() {
        this.mouse.down(0,0);
        this.mouse.move(40,40);
        this.mouse.move(60,40);
        this.mouse.down(60,40);
    });
    this.capture('test.png');
})

但它没有用，绘图板上没有任何东西T_T

Answer 1

原生事件

使用PhantomJS无法进行原生拖动（CasperJS建立在它之上），因为每个casper.mouse.*()调用实际上都会启动一个新的鼠标操作并“重置”前一个。在呼叫之间不保持任何鼠标按钮的按下状态。这与PhantomJS' page.sendEvent如何工作有关，它通过CasperJS处理所有用户操作（强调我的）：

  

第一个参数是事件类型。支持的类型是'mouseup'，'mousedown'，'mousemove'，'doubleclick'和'click'。接下来的两个参数是可选的，但表示事件的鼠标位置。

     

按钮参数（默认为左）指定要按下的按钮。

     

但是，对于'mousemove'，没有按下任何按钮（即它没有拖动）。

综合事件

您可以尝试使用casper.evaluate内的available DOM APIs触发合成事件。你需要

• 在页面上找到实际负责捕获这些UI事件的元素和

• trigger该元素的相应事件：1 x mousedown，n x mousemove和1 x mouseup。