在页面中导航和截图

时间:2013-09-17 14:58:24

标签: javascript casperjs

我尝试创建casperjs脚本来测试我的页面。 实际算法看起来(1-5个工作):

1) load url (login page)
2) take ss and save as img1.png
3) find inputs (login & pass)
4) fill inputs and click submit
5) take ss of new page and save as img2.png
6) change tab (page with two tabs - I want click on second tab)
7) do something

我不是100%确定代码是否正常所以我将其粘贴在这里:

casper.start(url, function(){});
casper.then(function() { this.capture('img1.png'); });

casper.thenEvaluate(function() {
    document.querySelector('input[name="user"]').setAttribute('value', 'jamal');
    document.querySelector('input[name="pass"]').setAttribute('value', 'asd');
    document.querySelector('input[name="login"]').click();
});
 casper.then(function() { this.capture('img2.png'); });

casper.thenEvaluate(function() {
    document.getElementById('keyword_form').getElementsByTagName('div')[0].getElementsByTagName('ul')[0].getElementsByTagName('li')[1].getElementsByTagName('a')[0].click();

    // this commented line works perfectly
    //document.getElementById('keyword_form').getElementsByTagName('div')[0].getElementsByTagName('ul')[0].getElementsByTagName('li')[1].getElementsByTagName('a')[0].style.background = "yellow"; 
});

casper.then(function() { 
    this.capture('img3.png');
});

在最后一个屏幕(img3)上,我看到标签没有更改。它仍然是默认的第一个标签。我真的不知道为什么会这样。有什么想法吗?

1 个答案:

答案 0 :(得分:0)

.click()实际上您遇到了问题。

你需要

  1. 使用支持.click()
  2. 的jQuery执行此操作
  3. 按照正确的方式 - elem.onclick.apply(elem);
  4. 阅读:How can I programmatically invoke an onclick() event from a anchor tag while keeping the ‘this’ reference in the onclick function?

      

    注意:您还可以在jquery.js加注页面时注入casperJS

     casper = require('casper').create({
        clientScripts:  [
            'jquery.min.js' // injected in remote DOM on every request
        ],
        pageSettings: { ... }
    });