如何从CasperJS访问iframe?

Jim*_*ris 32 javascript iframe webkit phantomjs casperjs

我有一个带iframe的网页.我想使用CasperJS访问iframe的内容.特别是,我需要单击按钮并填写表单.我怎样才能做到这一点?

主要网页是 main.html:

<html><body>
<a id='main-a' href="javascript:console.log('pressed main-a');">main-a</a>
<iframe src="iframe.html"></iframe>
<a id='main-b' href="javascript:console.log('pressed main-b');">main-b</a>
</body></html>
Run Code Online (Sandbox Code Playgroud)

iframe是:

<html><body>
<a id='iframe-c' href="javascript:console.log('pressed iframe-c');">iframe-c</a>
</body></html>
Run Code Online (Sandbox Code Playgroud)

我天真的做法:

var casper = require('casper').create({
    verbose: true,
    logLevel: "debug"
});

casper.start("http://jim.sh/~jim/tmp/casper/main.html", function() {
    this.click('a#main-a');
    this.click('a#main-b');
    this.click('a#iframe-c');
});

casper.run(function() {
    this.exit();
});
Run Code Online (Sandbox Code Playgroud)

当然,这不起作用,因为a#iframe-c选择器在主框架中无效:

[info] [phantom] Starting...
[info] [phantom] Running suite: 2 steps
[debug] [phantom] opening url: http://jim.sh/~jim/tmp/casper/main.html, HTTP GET
[debug] [phantom] Navigation requested: url=http://jim.sh/~jim/tmp/casper/main.html, type=Other, lock=true, isMainFrame=true
[debug] [phantom] url changed to "http://jim.sh/~jim/tmp/casper/main.html"
[debug] [phantom] Navigation requested: url=http://jim.sh/~jim/tmp/casper/iframe.html, type=Other, lock=true, isMainFrame=false
[debug] [phantom] Successfully injected Casper client-side utilities
[info] [phantom] Step 2/2 http://jim.sh/~jim/tmp/casper/main.html (HTTP 200)
[debug] [phantom] Mouse event 'click' on selector: a#main-a
[info] [remote] pressed main-a
[debug] [phantom] Mouse event 'click' on selector: a#main-b
[info] [remote] pressed main-b
[debug] [phantom] Mouse event 'click' on selector: a#iframe-c
FAIL CasperError: Cannot dispatch click event on nonexistent selector: a#iframe-c
#    type: uncaughtError
#    error: "CasperError: Cannot dispatch click event on nonexistent selector: a#iframe-c"
CasperError: Cannot dispatch click event on nonexistent selector: a#iframe-c    
  /tmp:901 in mouseEvent
  /tmp:365 in click
  /tmp/test.js:9
  /tmp:1103 in runStep
  /tmp:324 in checkStep
Run Code Online (Sandbox Code Playgroud)

有没有办法让这项工作?涉及直接戳入phantomjs的黑客攻击会很好,但我不知道该怎么做.

我正在使用CasperJS版本1.0.0-RC1和phantomjs版本1.6.0.

Jim*_*ris 41

花了很长时间寻找这个,当然我在发布问题后找到答案的几分钟.

我可以使用在此提交中添加到phantomjs的新帧切换命令.具体来说,this.page.switchToChildFrame(0)this.page.switchToParentFrame()功能.它似乎没有文档,似乎已经为即将发布的版本更改了方法,但它确实有效:

var casper = require('casper').create({
    verbose: true,
    logLevel: "debug"
});

casper.start("http://jim.sh/~jim/tmp/casper/main.html", function() {
    this.click('a#main-a');
    this.click('a#main-b');
    this.page.switchToChildFrame(0);
    this.click('a#iframe-c');
    this.page.switchToParentFrame();
});

casper.run(function() {
    this.exit();
});
Run Code Online (Sandbox Code Playgroud)

  • 是的,我做到了.当我问这个问题或接受这个答案时,`withFrame`不存在,但从现在开始使用它听起来是正确的. (3认同)

oll*_*lle 35

从1.0开始,您可以使用withFrame

  casper.open("http://www.example.com/page.html", function() {
    casper.withFrame('flashHolder', function() {
      this.test.assertSelectorExists('#the-flash-thing', 'Should show Flash');
    });
  });
Run Code Online (Sandbox Code Playgroud)