有没有办法从页面上下文中侦听幻像上下文中的事件？

Question

例如:我用PhantomJS打开一个页面,评估异步脚本(例如ajax).当它成功时,我想让虚拟上下文(在...之外page.evaluate())知道异步过程已经完成.

我不想使用setTimeout和setInteval等待并在幻像上下文中持续检查该过程是否已完成.

Answer 1

这正是onCallback和window.callPhantom()对的关系.

因此,如果您在页面上下文中有异步调用(如AJAX请求),则可以执行以下操作:

page.onCallback = function(data){
    console.log("finished: " + data.text);
    phantom.exit();
};
page.evaluate(function(){
    var xhr = new XMLHttpRequest();
    xhr.open("GET", "/");
    xhr.onreadystatechange = function () {
        var DONE = this.DONE || 4;
        if (this.readyState === DONE){
            window.callPhantom({text: this.responseText});
        }
    };
    xhr.send();
});

另一种使用方法是将调用添加到生产JavaScript中,以便更轻松地进行测试.如果您正在编写Web应用程序,有时候找到一个表示页面完全加载的选择器会很复杂.为了更轻松地测试这样的应用程序,您可以在页面JavaScript中使用以下内容:

finishOffPage(function callback(){
    if (typeof window.callPhantom === "function") {
        window.callPhantom({type: "loadFinished"});
    }
});

然后你可以写这样的测试:

page.onCallback = function(data){
    if (data.type === "loadFinished") {
        // do some testing
    }
};
page.open(url);

这是一个动态添加此类事物的示例:等待角度应用程序从幻像脚本完全呈现