casperJS css选择器:waitFor函数总是超时

时间:2016-03-17 14:07:01

标签: javascript css-selectors casperjs

我正在编写一个自动登录测试,并希望断言我已成功登录该页面,然后截取该页面的截图。

我试图访问的DOM看起来像这样:

<div class="form-group hidden-xs">
    <ul class="nav navbar-nav navbar-left logged-menu"> <strong class="pull-left"><font><font>Welcome,</font></font> </strong> 
        <li>
            <a href="/usuario"> <i class="glyphicon glyphicon-user"></i>
                <span class="hidden-xs">
                    <font><font class="">tocijan</font></font> 
                </span>
            </a>
        </li>
        <li>
            <div class="btn-group balance">
                <button type="button" class="btn btn-danger btn-xs">
                    <span id="balance_info">
                        <font>
                            <font>$ 178,345.79</font>
                        </font>
                    </span>
                </button>
                <button type="button" class="btn btn-danger btn-xs dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                    <span class="caret"></span>
                    <span class="sr-only">
                        <font>
                            <font>Toggle Dropdown</font>
                        </font>
                    </span>
                </button>
                <ul class="dropdown-menu" role="menu">
                    <li>
                        <font>
                            <font>Bonus:</font>
                        </font>
                        <span id="hdnBonus">
                            <font>
                                <font>$ 0.00</font>
                            </font>
                        </span>
                    </li>
                    <li class="divider"></li>
                    <li>
                        <font>
                            <font>Extractable:</font>
                        </font>
                        <span id="real_info">
                            <font>
                                <font>$ 178,345.79</font>
                            </font>
                        </span>
                    </li>
                    <li class="divider"></li>
                    <li>
                        <font>
                            <font>Reserved Bonus:</font>
                        </font>
                        <span id="resbon_info">
                            <font>
                                <font>$ 100.00</font>
                            </font>
                        </span>
                    </li>
                </ul>
            </div>
        </li>
        <li>
            <a href="/LoginPartial/Logoff?n2page=466&amp;n2part=799"> <i class="glyphicon glyphicon-arrow-left"></i>
                <font>
                    <font>Get out</font>
                </font>
            </a>
        </li>
    </ul>
    <div class="clr"></div>
</div>

我想声明这个元素:

<a href="/usuario"><i class="glyphicon glyphicon-user"></i><span class="hidden-xs"><font><font class="">tocijan</font></font></span></a>

具有tocijan

的innerHTML(或文本)

我写了等待这样的功能,但总是超时:

//waitfor function
this.waitFor(function check() {
    //evaluate if the page has a link to the user profile
    return this.evaluate(function() {
      return document.querySelector('a[href="/usuario"] span font font').innerHTML == 'tocijan';
    });
},
//after the condition is met
function then() {
    //capture a test image of the page
    this.capture('test.png');
});

我知道我登录了,因为我刚刚实现了10秒超时的基本等待并截取了页面的截图,并显示了正确的结果,但现在我想用waitFor函数来断言。 / p>

我使用错误的css选择器?

1 个答案:

答案 0 :(得分:0)

大多数时候都有空白,因为我们作为开发人员喜欢我们的缩进。尝试检查HTML中是否包含该元素:

return document.querySelector('...').innerHTML.indexOf('tocijan') != -1;

如果这不起作用,请检查该元素是否在iframe中。您需要专门切换到casper.withFrame()的iframe。