onLoadFinished 触发时页面未完全加载/渲染

Question

我正在使用 Phantomjs 来检查我的应用程序。我正在查看的页面包含很多组件，并且由 Angularjs 提供支持。我的测试服务器很慢。在onLoadFinished 事件中，我正在使用渲染对网页进行成像：

page.onLoadFinished = function(response) {
    console.log(response, page.url);
    if (page.url.indexOf("login") == -1) {
        page.render('zoot.png');
        phantom.exit();
    }
};

我的问题是zoot.png 只包含网站的菜单栏。渲染了菜单栏的文本和静态图像，但图标是 X。主页区域为空白。预计会在右下角显示一个文本版本号。

render 发生时页面似乎没有完全绘制。是否还有其他事件意味着“完成并准备好使用”？

Answer 1

您可能会找到一种方法 here 在 Angular 完成渲染时注册事件，但如果您愿意等待一段静态时间，则可能没有必要：

page.onLoadFinished = function(response) {
    console.log(response, page.url);
    if (page.url.indexOf("login") == -1) {
        setTimeout(function(){
            page.render('zoot.png');
            phantom.exit();
        }, 1000);
    }
};

您也可以使用waitFor 显式等待选择器的出现，该选择器表示加载结束。

注意page.open(url); 和page.onLoadFinished = finishedFunction; 与page.open(url, finishedFunction) 相同。