CasperJS单击不在锚点上工作而不使用href

时间:2014-03-28 22:07:53

标签: jquery phantomjs casperjs

我是CasperJS的新手。我试图在没有href属性的页面上模拟锚点上的“单击”。该页面使用jquery绑定一个javascript函数,以便在单击此元素时调用。如果我通过浏览器手动运行它,它可以工作,但尝试使用click()或thenClick()来模拟它不起作用。这是一个简化页面,用于演示我面临的问题:

one.html

<!DOCTYPE html>
<html>
<head>
  <title>One.html Page</title>
  <meta charset=”utf-8”>
  <meta http-equiv="X-UA-Compatible" content="IE=edge">

</head>
<body>
  <div class="container">    
    <div>
      <h3>Test</h3>
    </div>

    <div>
        <a id="enterButton" name="enterButton" class="btn btn-primary btn-lg" role="button">Enter</a>
    </div>

  </div>

  <script src="http://code.jquery.com/jquery-1.7.0.min.js"></script>

  <script>

  $("#enterButton").click(validateOne);
  function validateOne() {
    window.location.href = "pageTwo.html";
  }

  </script>
</body>
</html>

我的casper.js测试脚本:

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

casper.start('urlTo/one.html', function() {
  this.echo(this.getTitle());
});

casper.then(function() {
  this.click('#enterButton');
});

casper.wait(200, function() {
  this.capture('pageTwo.png');
});

casper.run();

当我运行我的casper.js脚本时,我捕获的屏幕仍然是初始页面(one.html),而不是pageTwo.html。我尝试了几件事,但似乎问题是“点击”事件没有被触发。我确认如果我在html中为锚标签添加一个href来调用javascript函数,那么事情就可以了。但是,我无法更改html的实现以使我的测试脚本正常工作。我认为应该有一种方法可以在casperJS中完成这项工作。希望这里的一些有经验的用户能够对此有所了解。

谢谢!

1 个答案:

答案 0 :(得分:0)

抓取网站时我遇到了这个问题。为我修复的是将视口casper.create()更改为

viewportSize: { width: 1920, height: 1080 }

并在后续步骤中使用casper.viewport(1920, 1080)函数。

我试图抓取的页面是单页面应用程序,要求我使用CasperJS单击链接以查看下一页。由于小的默认视口大小为400x300,因此无论出于何种原因我都在考虑下一页未被加载。这可能是一种更有效的方法,但这对我有用。