Skip to content

Instantly share code, notes, and snippets.

@phpdude phpdude/example.js
Last active Jun 9, 2018

Embed
What would you like to do?
PhantomJS: hellper for writing scripts waiting full page load (DOMContentLoaded event)
var system = require("system");
var url = system.args[1];
require('./phantom-full-load')(phantom, url, function (page, logs) {
logs.forEach(function (i) {
console.log('> ' + i);
});
result = page.evaluate(function () {
return $('body *').attr('class');
});
console.log(result);
}, function (error) {
console.log(error);
});
// This example shows how to render pages that perform AJAX calls
// upon page load.
//
// Instead of waiting a fixed amount of time before doing the render,
// we are keeping track of every resource that is loaded.
//
// Once all resources are loaded, we wait a small amount of time
// (resourceWait) in case these resources load other resources.
//
// The page is rendered after a maximum amount of time (maxRenderTime)
// or if no new resources are loaded.
// from https://gist.github.com/cjoudrey/1341747
var jquery = './vendor/jquery.min.js';
var maxRenderWait = 30000;
var resourceTimeout = 5000;
module.exports = function (phantom, url, onOk, onError) {
var page = require('webpage').create(), forcedRenderTimeout;
page.viewportSize = {width: 1280, height: 1024};
page.settings.resourceTimeout = resourceTimeout;
var consoleLogs = [];
function onLoad() {
clearTimeout(forcedRenderTimeout);
onOk(page, consoleLogs);
phantom.exit();
}
page.onConsoleMessage = function (msg) {
consoleLogs.push(JSON.stringify(msg));
};
page.onCallback = function (data) {
onLoad();
};
page.onInitialized = function () {
page.injectJs(jquery) || (console.log("Unable to inject jQuery") && phantom.exit());
page.evaluate(function () {
$(function () {
window.callPhantom();
});
});
page.evaluate(function () {
var isFunction = function (o) {
return typeof o == 'function';
};
var bind,
slice = [].slice,
proto = Function.prototype,
featureMap;
featureMap = {
'function-bind': 'bind'
};
function has(feature) {
var prop = featureMap[feature];
return isFunction(proto[prop]);
}
// check for missing features
if (!has('function-bind')) {
// adapted from Mozilla Developer Network example at
// https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function/bind
bind = function bind(obj) {
var args = slice.call(arguments, 1),
self = this,
nop = function () {
},
bound = function () {
return self.apply(this instanceof nop ? this : (obj || {}), args.concat(slice.call(arguments)));
};
nop.prototype = this.prototype || {}; // Firefox cries sometimes if prototype is undefined
bound.prototype = new nop();
return bound;
};
proto.bind = bind;
}
});
};
phantom.onError = page.onError = function (err) {
consoleLogs.push(err);
};
page.open(url, function (status) {
if (status !== "success") {
onError(new Error('Unable to load url'));
} else {
forcedRenderTimeout = setTimeout(onLoad, maxRenderWait);
}
});
};
@phpdude

This comment has been minimized.

Copy link
Owner Author

commented Oct 9, 2015

Output of example script

root # phantomjs example.js http://vk.com
> [0.019]  Real time offset: 0, minDt: 0, final time offset: 0
> [0.02]  dom started
fixed
@phpdude

This comment has been minimized.

Copy link
Owner Author

commented Oct 9, 2015

Helper can be used as starting point for new PhantomJS scripts.

This helper makes all dirty job:

  1. Wait for full page load
  2. Embed jquery into page
  3. Callback to your function when #1 and #2 are ready!

PR are welcome.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.