使用 $.ajaxStop() 确定页面何时在 CasperJS 中完成加载

Question

到目前为止，在我用 CasperJS 编写的测试中，我一直在页面特定元素上使用 waitForSelector() 来确定页面是否已完全加载（包括所有异步 ajax 请求）。我希望提出一种更标准的等待页面加载的方法，并且想知道以下是否可行？

将以下内容作为客户端脚本注入 (include.js)

$(document).ajaxStop(function() {
    // Do something
})

ajax根据jquery停止的描述api：注册一个处理程序，当所有Ajax个请求都完成时被调用。

定义一个 casper.waitForLoad 函数，调用时会等待上面代码块
在测试的几个部分使用该函数。

此外，关于 // Do Something 部分的任何提示也将不胜感激 :) 我正在考虑在 phantomJS 中使用 window.callPhantom 功能，但我读到它在 casperjs 中没有得到官方支持。

Answer 1

我会在 include.js 中做这样的事情：

(function(){
    window._allAjaxRequestsHaveStopped = false;
    var interval;
    $(document).ajaxStop(function() {
        if (interval) {
            clearInterval(interval);
            interval = null;
        }
        interval = setTimeout(function(){
            window._allAjaxRequestsHaveStopped = true;
        }, 500);
    });
    $(document).ajaxStart(function() {
        window._allAjaxRequestsHaveStopped = false;
        if (interval) {
            clearInterval(interval);
            interval = null;
        }
    });
})();

这会为 window 对象设置一个（希望是唯一的）变量，稍后可以检索该对象。这也会等待更长的时间，以防在上一批结束后有另一个请求。

在 CasperJS 中，您可能会执行以下操作来等待请求状态的更改。这使用向 casper 对象添加一个新函数并在内部使用 casper.waitFor() 来检查更改。

casper.waitForAjaxStop = function(then, onTimeout, timeout){
    return this.waitFor(function(){
        return this.evaluate(function(){
            return window._allAjaxRequestsHaveStopped;
        });
    }, then, onTimeout, timeout);
};

并像这样使用它：

casper.start(url).waitForAjaxStop().then(function(){
    // do something
}).run();

或者这个：

casper.start(url).thenClick(selector).waitForAjaxStop().then(function(){
    // do something
}).run();

使用 $.ajaxStop() 确定页面何时在 CasperJS 中完成加载

Using $.ajaxStop() to determine when page is finished loading in CasperJS

javascript

ajax

jquery

phantomjs

casperjs