3

我正在尝试使用分叉的版本和元素。 我的环境是带有分叉的 phantomJS 版本的。 1.10.0 1.0.2
Vagrant image

Flash 支持工作得很好,但模拟点击却不行。
对于以下展示,我从adobe 示例页面中获取了一个 flash 按钮并将其放入jsfiddle.

收到点击事件后,按钮标签从“点击我”变为“哎哟”。

因此,以下代码的预期结果将是:

预期结果

然而结果

实际结果

CasperJS 代码:

var casper = require('casper').create({
  pageSettings: {
    loadPlugins: true
  }
});

casper.start("http://fiddle.jshell.net/Da3q7/show/light/");

casper.wait(1000);

// CasperJS click
casper.then(function () {
  this.echo("Click", "INFO");
  this.click('#section04example1');
});

casper.wait(1000);

casper.then(function () {
  this.echo("Screenshot", "INFO");
  this.captureSelector('button-demo.png', '#section04example1');
  this.exit();
});

casper.run();
4

1 回答 1

3

出于安全原因,CasperJS 仅调用不会触发 Flash 鼠标事件的 javascript 事件。
然而,PhantomJSsendEvent方法调用真实的浏览器事件。

下一个问题是元素必须在当前视口中可见,这在大多数情况下需要 scolling。

最后我写了一个小的 CasperJSclickRelative扩展:

casper.clickRelative = function (selector, offset) {
  "use strict";

  var docSize = casper.evaluate(function () {
    return {width: document.width, height: document.height};
  });
  var position = this.getElementBounds(selector);
  if (position !== null) {

    var left = position.left + (offset.left || 0);
    var scrollX = this.page.viewportSize.width > docSize.width ? 0 :
      Math.min(left, docSize.width - this.page.viewportSize.width);

    var top = position.top + (offset.top || 0);
    var scrollY = this.page.viewportSize.height > docSize.height ? 0 :
      Math.min(top, docSize.height - this.page.viewportSize.height);

    var scrollOrig = {left: this.page.scrollPosition.left, top: this.page.scrollPosition.top};

    this.page.scrollPosition = {left: scrollX, top: scrollY};

    this.wait(10);
    this.then(function () {
      this.page.sendEvent("click", left - scrollX, top - scrollY, 'left');
    });
    this.wait(10);
    this.then(function () {
      this.page.scrollPosition = scrollOrig;
    });
  }
};

所以现在我的脚本能够单击按钮并生成以下 Flash 按钮的屏幕截图:

Flash 按钮被点击

var casper = require('casper').create({
  pageSettings: {
    loadPlugins: true
  }
});

casper.start("http://www.adobe.com/devnet/flash/quickstart/button_component_as3.edu.html");

casper.wait(1000);

casper.then(function () {
  this.echo("Click", "INFO");
  // The button has a margin so we have to add a little offset to the
  // click position:
  this.clickRelative('#section04example1', {left: 30, top: 15});
});

casper.wait(1000);

casper.then(function () {
  this.echo("Screenshot", "INFO");
  this.captureSelector('button-demo.png', '#section04example1');
  this.exit();
});

casper.run();
于 2013-07-04T12:32:37.783 回答