使用phantomjs-node实现waitFor功能

今天遇到了这个问题，想分享一下我的解决方案。

  // custom helper function
  function wait(testFx, onReady, maxWait, start) {
    var start = start || new Date().getTime()
    if (new Date().getTime() - start < maxWait) {
      testFx(function(result) {
        if (result) {
          onReady()
        } else {
          setTimeout(function() {
            wait(testFx, onReady, maxWait, start)
          }, 250)
        }
      })
    } else {
      console.error('page timed out')
      ph.exit()
    }
  }

第一步是创建新的wait函数。它采用与原waitFor函数相同的参数，但工作方式略有不同。在触发测试函数testFx的回调之后，我们必须递归地运行wait函数，而不是使用间隔。另外，请注意，您实际上不需要为start传递一个值，因为它是自动设置的。

  wait(function (cb) {
    return page.evaluate(function () 
      // check if something is on the page (should return true/false)
      return something
    }, cb)
  }, function () { // onReady function
    // code
  }, 5000) // maxWait

在这个例子中，我将testFx函数的回调设置为page.evaluate的回调，它根据是否能够在页面上找到某些元素返回true/false值。或者，您可以为page.evaluate创建回调，然后从中触发testFx回调，如下所示:

  wait(function (cb) {
    return page.evaluate(function () 
      // check if something is on the page (should return true/false)
      return something
    }, function(result) {
      var newResult = doSomethingCrazy(result)
      cb(newResult)
    }
  }, function () { // onReady function
    // code
  }, 5000) // maxWait

我为phantomjs-node编写了一个名为phridge的替代方案。它没有将所有函数调用和赋值转换为异步操作，而是在PhantomJS中执行整个函数。

我认为你的问题可以这样解决:

phridge.spawn()
    .then(function (phantom) {
        return phantom.openPage(url);
    })
    .then(function (page) {
        return page.run(selector, function (selector, resolve, reject) {
            // this function runs inside PhantomJS bound to the webpage instance
            var page = this;
            var intervalId = setInterval(function () {
                var hasBeenFound = page.evaluate(function (selector) {
                    return Boolean(document.querySelector(selector));
                }, selector);
                if (hasBeenFound === false &&
                    /* check if there is still some time left  */) {
                    // wait for next interval
                    return;
                }
                clearInterval(intervalId);
                if (hasBeenFound) {
                    resolve();
                } else {
                    reject(new Error("Wait for " + selector + " timeout"));
                }
            }, 100);
        });
    })
    .then(function () {
        // element has been found
    })
    .catch(function (err) {
        // element has not been found
    });

我最近创建了一个相当简单的节点模块，将waitFor移植到节点:https://gist.github.com/joseym/1d01edbcc40a7698f55a#file-phantomjs-waitfor-js

var async = require('async');
module.exports = waitFor;
/**
 * waitFor port used with 
 * @see    {@link https://github.com/ariya/phantomjs/blob/master/examples/waitfor.js}
 * @see    {@link https://github.com/sgentle/phantomjs-node}
 * @callback testFx - Test function, will repeat until true or timeout limit is reached
 * @callback onReady - Fires if/when `testFx` passes.
 * @param {(number|boolean|string)} [timeOut=false] - If defined and falsey or string value of`forever` 
 *                                                    then `waitFor` will run until `testFx` passes without 
 *                                                    timing out, otherwise pass a number in miliseconds.
 */
function waitFor(testFx, onReady, timeOut) {
    var maxtimeOutMillis = typeof timeOut !== 'undefined' ? timeOut : 5000 // Default Max Timout is 5s if not defined
        , start = new Date().getTime()
        , isAsync = testFx.length > 0
        , passing = undefined
    ;
    async.until(
        function Test() { 
            return typeof passing !== 'undefined'; 
        },
        function Action(cb) {
            setTimeout(function(){
                if (!maxtimeOutMillis || maxtimeOutMillis == 'forever' || new Date().getTime() - start < maxtimeOutMillis) {
                    // If a callback is passed to `testFx` we'll handle that.
                    function useCallback(){
                        passing = arguments[0]
                        return cb();
                    };                    
                    passing = (function(){
                        return (typeof(testFx) === "string" ? eval(testFx) : testFx).apply(this, arguments);
                    })(isAsync ? useCallback : undefined);
                    if(!isAsync) cb();
                } else {
                    return cb(new Error('`waitFor` timeout'));
                }
            }, 250);
        },
        function Done(err) {
            return (function(){
                return (typeof(onReady) === "string" ? eval(onReady) : onReady).apply(this, arguments);                  
            })(err, passing);
        }
    );
}