javascript - 从无限滚动填充完整页面时，CasperJS 的scrollToBottom 不起作用

Question

我不知道为什么scrollToBottom() 不起作用。如果当前数据(来自评估)大于以前的数据，我想继续滚动到页面底部。

PhantomJS 2.0.0
CasperJS 1.1.0-beta3

var casper = require('casper').create({
    verbose: true,
    logLevel: 'info',
    pageSettings: {
        loadImages: false,
        loadPlugins: false,
        userAgent: 'Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/29.0.1547.2 Safari/537.36'
    }
});

casper.options.waitTimeout = 60000;
var utils = require('utils');
var hospitals = [];
var prevTotalHospitals = 0;
var currentTotalHospitals = 0;

casper.start('https://www.docdoc.com/').thenClick("#form-submit-btn").then(function() {
    this.wait(5000);
    this.scrollToBottom();
    processPage();
});

casper.on("remote.message", function(msg){
    this.echo("remote> " + msg);
});

casper.on('step.error', function(err) {
    this.die("Step has failed: " + err);
})

casper.on("page.error", function(msg, trace) {
    this.echo("Error: " + msg, "ERROR");
});

casper.on('complete.error', function(err) {
    this.die("Complete callback has failed: " + err);
});

casper.run(function(){
    utils.dump(hospitals);
});

function getCurrentTotalHospitals(){
    var resultsNodeList = document.querySelectorAll("div.results-list div.result");
    return resultsNodeList.length;
}

function getDetails(){
    var details = [];
    var resultsNodeList = document.querySelectorAll("div.results-list div.result");
    console.log("resultsNodeList.length " + resultsNodeList.length);
    for (var i = 0; i < resultsNodeList.length; i++) {
        var detail = {
            "name"          : resultsNodeList[i].querySelector("h2.link").textContent.replace(/\n/g, ''),
            "country"       : resultsNodeList[i].querySelector("h3.country").textContent.replace(/\n/g, ''),
            "specialities"  : resultsNodeList[i].querySelector("div.specialities").textContent.replace(/\n/g, ''),
            "language"      : resultsNodeList[i].querySelector("div.language").textContent.replace(/\n/g, '')
        };
        details.push(detail);
    };

    return JSON.stringify(details);
}

function stopScript() {
    utils.dump(hospitals);
    console.log("Exiting..." + hospitals.length);
    casper.exit();
};

function processPage() {
    currentTotalHospitals = casper.evaluate(getCurrentTotalHospitals);
    console.log(currentTotalHospitals + " <> " + prevTotalHospitals);
    if (currentTotalHospitals > prevTotalHospitals) {
        prevTotalHospitals = currentTotalHospitals;
        hospitals = hospitals.concat(casper.evaluate(getDetails));
        casper.scrollToBottom();
        casper.wait(5000);
        processPage();
    } else {
        stopScript();
    }
}

Answer 1

evaluate() 是一个同步函数。由于它是在 processPage() 内部同步使用的，因此 processPage() 一开始也是同步的。稍后您将使用a同步的wait()。 wait() 之后的 processPage() 立即执行。

你可以这样使用它:

if (...) {
    ...
    casper.scrollToBottom();
    casper.wait(5000, processPage);
} else {...}

顺便说一句，第一个 wait() 也是如此。应该是:

this.wait(5000, function(){
    this.scrollToBottom();
    processPage();
});