Quick Start with PhantomJS

MustWatch

Quick Start with PhantomJS

https://phantomjs.org/quick-start.html

Hello, World!

Create a new text file that contains the following two lines: console.log('Hello, world!'); phantom.exit(); Save it as hello.js and then run it from the terminal or command prompt: phantomjs hello.js The output is: Hello, world! In the first line, console.log will print the passed string to the terminal. In the second line, phantom.exit terminates the execution. It is very important to call phantom.exit at some point in the script, otherwise PhantomJS will not be terminated at all.

Page Loading

A web page can be loaded, analyzed, and rendered by creating a webpage object. The following script demonstrates the simplest use of page object. It loads example.com and then saves it as an image, example.png in the same directory the script was run in. var page = require('webpage').create(); page.open('http://example.com', function(status) { console.log("Status: " + status); if(status === "success") { page.render('example.png'); } phantom.exit(); }); Because of its rendering features, PhantomJS can be used to capture web pages, essentially taking a screenshot of the contents. The following loadspeed.js script loads a specified URL (do not forget the http protocol) and measures the time it takes to load it. var page = require('webpage').create(), system = require('system'), t, address; if (system.args.length === 1) { console.log('Usage: loadspeed.js [some URL]'); phantom.exit(); } t = Date.now(); address = system.args[1]; page.open(address, function(status) { if (status !== 'success') { console.log('FAIL to load the address'); } else { t = Date.now() - t; console.log('Loading ' + system.args[1]); console.log('Loading time ' + t + ' msec'); } phantom.exit(); }); Run the script with the command: phantomjs loadspeed.js http://www.google.com It outputs something like: Loading http://www.google.com Loading time 719 msec

Code Evaluation

To evaluate JavaScript code in the context of the web page, use evaluate() function. The execution is "sandboxed", there is no way for the code to access any JavaScript objects and variables outside its own page context. An object can be returned from evaluate(), however it is limited to simple objects and can’t contain functions or closures. Here is an example to show the title of a web page: var page = require('webpage').create(); page.open(url, function(status) { var title = page.evaluate(function() { return document.title; }); console.log('Page title is ' + title); phantom.exit(); }); Any console message from a web page, including from the code inside evaluate(), will not be displayed by default. To override this behavior, use the onConsoleMessage callback. The previous example can be rewritten to: var page = require('webpage').create(); page.onConsoleMessage = function(msg) { console.log('Page title is ' + msg); }; page.open(url, function(status) { page.evaluate(function() { console.log(document.title); }); phantom.exit(); }); Since the script is executed as if it is running on a web browser, standard DOM scripting and CSS selectors work just fine. It makes PhantomJS suitable to carry out various page automation tasks.

Further Study

The code shown above is also available in various examples included with PhantomJS. You are also recommended to explore the use of PhantomJS for page automation, network monitoring, screen capture, and headless testing.

Page Automation with PhantomJS

Because PhantomJS can load and manipulate a web page, it is perfect to carry out various page automation tasks.

DOM Manipulation

Since the script is executed as if it is running on a web browser, standard DOM scripting and CSS selectors work just fine. The following useragent.js example demonstrates reading the textContent property of the element whose id is qua: var page = require('webpage').create(); console.log('The default user agent is ' + page.settings.userAgent); page.settings.userAgent = 'SpecialAgent'; page.open('http://www.httpuseragent.org', function(status) { if (status !== 'success') { console.log('Unable to access network'); } else { var ua = page.evaluate(function() { return document.getElementById('qua').textContent; }); console.log(ua); } phantom.exit(); }); The above example also shows the approach to customize the User-Agent string seen by the remote web server.

Use jQuery and Other Libraries

As of version 1.6, you are also able to include jQuery into your page using page.includeJs as follows: var page = require('webpage').create(); page.open('http://www.sample.com', function() { page.includeJs("http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js", function() { page.evaluate(function() { $("button").click(); }); phantom.exit() }); }); The above snippet will open up a web page, include the jQuery library into the page, and then click on all buttons using jQuery. It will then exit from the web page. Make sure to put the phantom.exit() statement within the page.includeJs or else it may exit prematurely before the JavaScript library is included.

The Webpage instance

Suppose you have an instance of the webpage: var page = require('webpage').create(); What can be extracted and executed on it?

Attributes

page.canGoForward -> boolean

If window.history.forward would be a valid action

page.canGoBack -> boolean

If window.history.back would be a valid action

page.clipRect -> object

Can be set to an object of the following form: { top: 0, left: 0, width: 1024, height: 768 } It specifies which part of the screen will be taken in the screenshot

page.content -> string

The whole HTML content of the page

page.cookies -> object

The cookies. They have this form: { 'name' : 'Valid-Cookie-Name', 'value' : 'Valid-Cookie-Value', 'domain' : 'localhost', 'path' : '/foo', 'httponly' : true, 'secure' : false }

page.customHeaders -> object

TODO

page.event -> object

Contains modifiers and keys TODO

page.libraryPath -> string

The current library path, usually it’s the directory where the script is executed from

page.loading -> boolean

If the page is loading or not

page.loadingProgress -> number

The percentage that has been loaded. 100 means that the page is loaded.

page.navigationLocked -> boolean

TODO

page.offlineStoragePath -> string

Where the sqlite3 localstorage and other offline data are stored.

page.offlineStorageQuota, ‘number

The quota in bytes that can be stored offline

page.paperSize -> object

Similar to clipRect but takes real paper sizes such as A4. For an in depth example, check this example: printheaderfooter.js.

page.plainText -> string

The elements that are plain text in the page

page.scrollPosition -> object

The current scrolling position as an object of the following form: { left: 0, top: 0 }

page.settings -> object

The settings which currently only has the useragent string, e.g page.settings.userAgent = 'SpecialAgent';

page.title -> string

The page title

page.url -> string

The page url

page.viewportSize -> object

The browser size which is in the following form: { width: 1024, height: 768 }

page.windowName -> string

The name of the browser window that is assigned by the WM.

page.zoomFactor -> number

The zoom factor. 1 is the normal zoom.

Functions

page.childFramesCount

page.childFramesName

page.close

page.currentFrameName

page.deleteLater

page.destroyed

page.evaluate

page.initialized

page.injectJs

page.javaScriptAlertSent

page.javaScriptConsoleMessageSent

page.loadFinished

page.loadStarted

page.openUrl

page.release

page.render

page.resourceError

page.resourceReceived

page.resourceRequested

page.uploadFile

page.sendEvent

page.setContent

page.switchToChildFrame

page.switchToMainFrame

page.switchToParentFrame

page.addCookie

page.deleteCookie

page.clearCookies

Handlers/Callbacks

List of all the page events:

onInitialized

onLoadStarted

onLoadFinished

onUrlChanged

onNavigationRequested

onRepaintRequested

onResourceRequested

onResourceReceived

onResourceError

onResourceTimeout

onAlert

onConsoleMessage

onClosing

For more information check this in depth example: page_event.js.

Example Scripts for PhantomJS

PhantomJS comes with a lot of included examples.

Basic examples

arguments.js shows the arguments passed to the script

countdown.js prints a 10 second countdown

echoToFile.js writes the command line arguments to a file

fibo.js lists the first few numbers in the Fibonacci sequence

hello.js displays the famous message

module.js and universe.js demonstrate the use of module system

outputEncoding.js displays a string in various encodings

printenv.js displays the system’s environment variables

scandir.js lists all files in a directory and its subdirectories

sleepsort.js sorts integers and delays display depending on their values

version.js prints out PhantomJS version number

page_events.js prints out page events firing: useful to better grasp page.on* callbacks

Rendering/rasterization

colorwheel.js creates a color wheel using HTML5 canvas

rasterize.js rasterizes a web page to image or PDF

render_multi_url.js renders multiple web pages to images

Page automation

injectme.js injects itself into a web page context

phantomwebintro.js uses jQuery to read .version element text from phantomjs.org

unrandomize.js modifies a global object at page initialization

waitfor.js waits until a test condition is true or a timeout occurs

Network

detectsniff.js detects if a web page sniffs the user agent

loadspeed.js computes the loading speed of a web site

netlog.js dumps all network requests and responses

netsniff.js captures network traffic in HAR format

post.js sends an HTTP POST request to a test server

postserver.js starts a web server and sends an HTTP POST request to it

server.js starts a web server and sends an HTTP GET request to it

serverkeepalive.js starts a web server which answers in plain text

simpleserver.js starts a web server which answers in HTML

Testing

run-jasmine.js runs Jasmine based tests

run-qunit.js runs QUnit based tests

Browser

features.js detects browser features using modernizr.js

useragent.js changes the browser’s user agent property

Headless Testing with PhantomJS

One major use case of PhantomJS is headless testing of web applications. It is suitable for general command-line based testing, within a precommit hook, and as part of a continuous integration system.

Test Frameworks

PhantomJS itself is not a test framework, it is only used to launch the tests via a suitable test runner. The following table summarizes the list of various test frameworks and the corresponding test runners. If the framework does not need an external/third-party runner, it is marked as “built-in”.

Framework	Test Runner
Buster.JS	built-in
Capybara	Poltergeist, Terminus
Mocha	Chutzpah, mocha-phantomjs
FuncUnit	built-in
Hiro	built-in
Karma (née Testacular)	built-in
Jasmine	Chutzpah, grunt-contrib-jasmine, guard-jasmine, phantom-jasmine
Laika	built-in
Preamble	built-in
phantom-assert	built-in
QUnit	qunit-phantomjs-runner, Chutzpah, Qlive, QUnited
Robot Framework	phantomrobot
Rx Test Runner	built-in
tape-run	built-in
Testem	built-in
Venus.js	built-in
WebDriver	GhostDriver
wru	built-in
YUITest	Grover, phantomjs-yuitest

PhantomJS includes run-qunit and run-jasmine in its examples subdirectory. However, these are for illustration purposes and lack important reporting features necessary for real-world uses!

PhantomJS tailored testing

In addition, there are Related Projects which are built on top of PhantomJS to provide convenient high-level functionality for testing purposes:

Casper.js is useful to build scripted navigation and testing

Lotte adds jQuery-like methods, chaining, and more assertion logic

WebSpecter is a BDD-style acceptance test framework for web applications

Continuous Integration Systems

Using PhantomJS with CI system such as Jenkins or TeamCity does not require special setup. Make sure PhantomJS is installed properly on the slave/build agent and it is ready to go. Since PhantomJS is purely headless on Linux, the agent can run on an installation without any GUI. This means, a barebone Linux system without X11 is not a problem for PhantomJS. It makes it possible to spawn light build agents on Amazon EC2 or Heroku instances. Travis CI, a popular hosted CI system, has built-in support for PhantomJS. See its documentation for details.

Screen Capture with PhantomJS

Since PhantomJS is using WebKit, a real layout and rendering engine, it can capture a web page as a screenshot. Because PhantomJS can render anything on the web page, it can be used to convert HTML content styled with CSS but also SVG, images and Canvas elements. The following script demonstrates the simplest use of page capture. It loads the GitHub homepage and then saves it as an image, github.png. var page = require('webpage').create(); page.open('http://github.com/', function() { page.render('github.png'); phantom.exit(); }); To run this example create a new file called github.js. Copy and paste the above code into the github.js file. In the command line, run this newly created script with PhantomJS: phantomjs github.js Beside PNG format, PhantomJS supports JPEG, GIF, and PDF. In the examples subdirectory, there is a script rasterize.js which demonstrates a more complete rendering feature of PhantomJS. An example to produce the rendering of the famous Tiger (from SVG): phantomjs rasterize.js http://ariya.github.io/svg/tiger.svg tiger.png which gives the following tiger.png: Rendered Tiger

Another example is to show polar clock (from RaphaelJS): phantomjs rasterize.js https://dmitrybaranovskiy.github.io/raphael/polar-clock.html clock.png

Producing PDF output is also easy, such as from a Wikipedia article: phantomjs rasterize.js 'http://en.wikipedia.org/w/index.php?title=Jakarta&printable=yes' jakarta.pdf You can change the size of the screenshot and the webpage using the page’s attributes: var page = require('webpage').create(); //viewportSize being the actual size of the headless browser page.viewportSize = { width: 1024, height: 768 }; //the clipRect is the portion of the page you are taking a screenshot of page.clipRect = { top: 0, left: 0, width: 1024, height: 768 }; //the rest of the code is the same as the previous example page.open('http://example.com/', function() { page.render('github.png'); phantom.exit(); }); Canvas can be easily constructed and converted to an image. The included example colorwheel.js produces the following color wheel:

It is possible to build a web screenshot service using PhantomJS. Some related projects make it easy to create such a service.

Network Monitoring with PhantomJS

Because PhantomJS permits the inspection of network traffic, it is suitable to build various analysis on the network behavior and performance. All the resource requests and responses can be sniffed using onResourceRequested and onResourceReceived. A very simple example to log every request and response is illustrated in the script netlog.js: var page = require('webpage').create(); page.onResourceRequested = function(request) { console.log('Request ' + JSON.stringify(request, undefined, 4)); }; page.onResourceReceived = function(response) { console.log('Receive ' + JSON.stringify(response, undefined, 4)); }; page.open(url); By collecting the data and reformatting it, another example, netsniff.js, exports the network traffic in HAR format. Use HAR viewer to visualize the result and get the waterfall diagram. The following shows an examplary waterfall diagram obtained from BBC website:

For more advanced network analysis, see projects like Confess.js and YSlow. The integration of YSlow and PhantomJS is very useful for automated web performance. The report can be in TAP (Test Anything Protocol) and JUnit. Running YSlow with PhantomJS in a continuous integration system such as Jenkins is an easy DIY solution to performance monitoring: YSlow and Jenkins

PhantomJS - Frequently Asked Questions (FAQ)

Q: Why there is no binary package or installer for <insert your favorite OS>? A: Binary packages, executables, and installer are provided on a volunteer basis. They may appear later, or they may not exist at all. We are a very small team and we can’t afford to produce all possible combinations of packages for the different platforms and operating systems out there. Q: Why does building PhantomJS take a long time? A: Because PhantomJS build workflow bundles the WebKit module, it needs to compile thousands of source files. Using the binary package is highly recommended. It is fast to download and easy to install. Q: Can you give a time estimate of the availability of feature X? Because nobody is working full time on PhantomJS, there is no way to predict the exact timing of the completion of a particular feature. Since every contributor to PhantomJS works at their own pace, sometimes it can take a few release cycles until a certain feature is shipped. Q: Is there any update on issue XYZ?? Any progress related to an issue, whether it is a change in the plan or an implementation check-in, will be always posted to the issue page. This is part of PhantomJS contribution guide, it is essential to the development workflow. If an issue hasn’t received any new update for a while, a question like "Is there any update?" has an obvious answer. Q: Why do I get build failure with PhantomJS 1.5 after successfully compiled 1.4? A: PhantomJS has a completely different build workflow in version 1.5 compared to its previous versions (read the details). If the working directory still has some left-over from 1.4 build process, there will be a compile error, such as: phantom.cpp:305: error: no matching function for call to 'QWebFrame::evaluateJavaScript(QString, QString) The solution is to completely clean the directory from old build files. The recommended way is to run git clean -xfd from the top-level. Warning: this will remove everything not stored in the Git repository database (read Git documentation for more info). Please back-up any files appropriately. After that, run the build script again. Q: Why do I get the error message phantomjs: cannot connect to X server? A: In PhantomJS 1.4 or earlier, X server is still needed. The workaround is to use Xvfb. Starting with PhantomJS 1.5, it is pure headless and there is no need to run X11/Xvfb anymore. Q: Which WebKit version is used by PhantomJS? A: If you want to know HTML5/CSS3/other features supported by PhantomJS, using WebKit version is not a good idea. See Supported Web Standards documentation page for details. If you really like to get the WebKit version, find it via the user agent, run the examples/useragent.js. The actual version depends on the libraries with which PhantomJS was compiled. Q: Why is PhantomJS not written as Node.js module? A: The short answer: "No one can serve two masters." A longer explanation is as follows. As of now, it is technically very challenging to do so. Every Node.js module is essentially "a slave" to the core of Node.js, i.e. “the master”. In its current state, PhantomJS (and its included WebKit) needs to have the full control (in a synchronous matter) over everything: event loop, network stack, and JavaScript execution. If the intention is just about using PhantomJS right from a script running within Node.js, such a "loose binding" can be achieved by launching a PhantomJS process and interact with it. Q: When using render(), why is the background transparent? A: PhantomJS does not set the background color of the web page at all, it is left to the page to decide its background color. If the page does not set anything, then it remains transparent. To set an initial background color for a web page, use the following trick: page.evaluate(function() { document.body.bgColor = 'white'; });

Example Scripts for PhantomJS

PhantomJS comes with a lot of included examples.

Basic examples

arguments.js shows the arguments passed to the script

countdown.js prints a 10 second countdown

echoToFile.js writes the command line arguments to a file

fibo.js lists the first few numbers in the Fibonacci sequence

hello.js displays the famous message

module.js and universe.js demonstrate the use of module system

outputEncoding.js displays a string in various encodings

printenv.js displays the system’s environment variables

scandir.js lists all files in a directory and its subdirectories

sleepsort.js sorts integers and delays display depending on their values

version.js prints out PhantomJS version number

page_events.js prints out page events firing: useful to better grasp page.on* callbacks

Rendering/rasterization

colorwheel.js creates a color wheel using HTML5 canvas

rasterize.js rasterizes a web page to image or PDF

render_multi_url.js renders multiple web pages to images

Page automation

injectme.js injects itself into a web page context

phantomwebintro.js uses jQuery to read .version element text from phantomjs.org

unrandomize.js modifies a global object at page initialization

waitfor.js waits until a test condition is true or a timeout occurs

Network

detectsniff.js detects if a web page sniffs the user agent

loadspeed.js computes the loading speed of a web site

netlog.js dumps all network requests and responses

netsniff.js captures network traffic in HAR format

post.js sends an HTTP POST request to a test server

postserver.js starts a web server and sends an HTTP POST request to it

server.js starts a web server and sends an HTTP GET request to it

serverkeepalive.js starts a web server which answers in plain text

simpleserver.js starts a web server which answers in HTML

Testing

run-jasmine.js runs Jasmine based tests

run-qunit.js runs QUnit based tests

Browser

features.js detects browser features using modernizr.js

useragent.js changes the browser’s user agent property

Source Code API Examples F.A.Q

Command Line Interface

PhantomJS Tutorial

PhantomJS is a lightweight headless browser built on WebKit. It is called headless because the execution does not happen on the browser, but on the terminal. This tutorial covers most of the topics required for a basic understanding of PhantomJS. Additionally, this tutorial also explains how to deal with its various components and to get a feel of how it works. PhantomJS is said to be a headless browser because there is no involvement of browser while executing the JavaScript code. The execution will not be seen in the browser display, but on the command line prompt. The functionalities like CSS Handling, DOM Manipulation, JSON, Ajax, Canvas, SVG, etc., will all be taken care at the command prompt. PhantomJS does not have a GUI and hence, all its execution takes place at the command line. Using PhantomJS, we can write to a file, read the contents of the file or upload a file, take an screen capture, convert the webpage into a pdf and lots more. With headless browsers, you get all the browser behavior i.e. Cookies, Http Request Methods i.e. GET /POST, Clearing Cookies, Deleting Cookies, etc., Reloading of Page, Navigating to a Different Page. PhantomJS uses WebKit that has a similar browsing environment like the famous browsers 鈥<93> Google Chrome, Mozilla Firefox, Safari, etc. It also provides a lot of JavaScript API, which helps in taking screenshots, uploading of file, writing to file, reading a file, interacting with the web pages, etc. PhantomJS does not support Flash or Video, as it requires plugins and it is difficult to support the same on the command line.

Features of PhantomJS

Let us now understand the features that PhantomJS offers.

Page Automation

PhantomJS allows you to read the page contents with the help of its API. It can help to manipulate the DOM, use external libraries to carry out the task required.

Screen Capture

PhantomJS helps in taking a screen capture of a page specified and save the same as an image in various formats like PNG, JPEG, PDF, and GIF. With the help of the screen capture, it can easily help to make sure the web content is fine. PhantomJS offers properties and methods with the help of which it allows developers to adjust the size of the screenshots and specify the area they want to capture.

Headless Testing

PhantomJS helps testing of UI at the command line. While, with the help of a screenshot, it can easily help to find errors in the UI. PhantomJS sometimes cannot help with testing alone. However, it can be wrapped along with other testing libraries like Mocha, Yoeman, etc. You can take the help of PhantomJS to upload a file and submit the form. PhantomJS can be used to test logins across the sites and make sure the security is not compromised. PhantomJS can be used along with other tools like CasperJS, Mocha, Qunit to make the testing more powerful.

Network Monitoring

One of the important features of PhantomJS is its usage to monitor the network connection using the API available. PhantomJS permits the inspection of network traffic; it is suitable to build various analysis on the network behavior and performance. PhantomJS can be used to collect the data about the performance of the webpage in a live environment. PhantomJS can be used with tools like Yslow to gather performance metrics of any websites.

PhantomJS - Overview

PhantomJS - Environment Setup

PhantomJS is a free software and is distributed under the BSD License. It is easy to install and it offers multiple features to execute the scripts. PhantomJS can be easily run on multiple platforms such as Windows, Linux, and Mac. For downloading PhantomJS, you can go to 鈥<93> http://phantomjs.org/ and then click on the download option.

For Windows

The download page shows you the options for download for different OS. Download the zip file, unpack it and you will get an executable phantom.exe. Set the PATH environment variable to the path of phantom.exe file. Open a new command prompt and type phantomjs 鈥搗. It should give you the current version of PhantomJS that is running.

For MAC OS X

Download the PhantomJS zip file meant for MAC OS and extract the content. Once the content is downloaded, move the PhantomJS to 鈥<93> /usr/local/bin/. Execute PhantomJS command i.e. phantomjs 鈥搗 at the terminal and it should give you the version description of PhantomJS.

Linux 64 bit

Download the PhantomJS zip file meant for Linux 64 bit and extract the content. Once the content is downloaded, move PhantomJS folder to /usr/local/share/ and create a symlink sudo mv $PHANTOM_JS /usr/local/share sudo ln -sf /usr/local/share/$PHANTOM_JS/bin/phantomjs /usr/local/bin. Execute phantomjs 鈥搗 at the terminal and it should give the version of PhantomJS.

Linux 32 bit

Download the PhantomJS zip file meant for Linux 32 bit and extract the content. Once the content is downloaded, move the PhantomJS folder to /usr/local/share/ and create a symlink sudo mv $PHANTOM_JS /usr/local/share sudo ln -sf /usr/local/share/$PHANTOM_JS/bin/phantomjs /usr/local/bin. Execute phantomjs 鈥搗 at the terminal and it should give the version of PhantomJS. The PhantomJS source code can also be taken from the git repository by clicking on the following link 鈥<93> https://github.com/ariya/phantomjs/ To run scripts in PhantomJS, the command is as follows phantomjs jsfile arg1 arg2鈥

PhantomJS - Environment Setup

PhantomJS - Object

In this chapter, we will look at the four important objects PhantomJS. They are as follows

CookiesEnabled

Here is an example to find out the version. var a = phantom.version;console.log(JSON.stringify(a));console.log(a.major);console.log(a.minor);console.log(a.patch);phantom.exit(); The above program generates the following output. {"major":2,"minor":1,"patch":1} 2 1 1 In the above example, we have used console.log to print the version. Currently, we are running on version 2. It returns the object with the details shown in the above code block.

PhantomJS - Object

PhantomJS - Methods

PhantomJS is a platform to help execute JavaScript without a browser. To do that, the following methods are used, which help in Adding the Cookie, Deleting, Clearing, Exiting the Script, Injecting JS, etc. We will discuss more on these PhantomJS methods and their syntax in this chapter. Similar methods i.e. addcookie, injectjs exists on the webpage module, which will be discussed in the subsequent chapters. PhantomJS exposes the following methods that can help us to execute JavaScript without the browser

addCookie

clearCookie

deleteCookie

Exit

InjectJS

Let us now understand these methods in detail with examples.

addCookie

The addcookie method is used to add cookies and store in the data. It is similar to how the browser stores it. It takes a single argument that is an object with all the properties of cookies and the syntax for it looks like shown below

Syntax

Its syntax is as follows phantom.addCookie ({ "name" : "cookie_name", "value" : "cookie_value", "domain" : "localhost" }); The name, value, domain are mandatory properties to be added to the addcookie function. If any of this property is missing in the cookie objects, this method will fail.

Let us look at the following example to understand the use of injectJs. Filename: inject.js console.log(鈥淎dded file鈥<9d>); File name: addfile.js var addfile = injectJs(inject.js);console.log(addfile);phantom.exit();

Output

Command C:\phantomjs\bin>phantomjs addfile.js Added file // coming from inject.jstrue In the above example, addfile.js calls the file inject.js using injectJs. When you execute addfile.js, the console.log present in inject.js is shown in the output. It also shows true for addfile variable since the file inject.js was added successfully.

PhantomJS - Methods

PhantomJS - Webpage Module Properties

PhantomJS provides quite a lot of properties and methods to help us to interact with the contents inside a webpage. The require("webpage").create() command creates a webpage object. We will use this object to manipulate the webpage with the help of properties and methods listed below. var wpage = require("webpage").create(); The following table has the list of all the webpage properties that we are going to discuss.

S.No	Properties & Description
1	canGoBackThis property returns true if there is previous page in the navigation history; if not, false.
2	canGoForwardThis property returns true if there is next page in the navigation history; if not, false.
3	clipRectclipRect is an object with values top, left, width and height and used to take the image capture of the webpage when used by the render() method.
4	ContentThis property contains the contents of webpage.
5	cookiesWith cookies, you can set /get the cookies available on the URL. It will also give you the cookies available on the URL and the new cookies set on the page.
6	customHeaderscustomHeaders specifies additional HTTP request headers that will be send to server for every request issued by the page.
7	EventIt gives long list of events i.e. modifier, keys details.
8	focusedFrameNameReturns the name of the currently focused frame.
9	frameContentThis property gives the content of the frame which is active.
10	frameNameReturns the name of the currently focused frame.
11	framePlainTextThis property also gives the contents of the current active frame but only contents without any html tags.
12	frameTitleGives the title of the active frame.
13	frameUrlThis property will give the url of the currently focused frame.
14	framesCountGives the count of the frames present on the page.
15	framesNameGives array of frame names.
16	libraryPathThis property has the path, which is used by page.inectJs method.
17	navigationLockedThis property defines whether navigation of the page is allowed or not. If true it will be on current page url and clicking on page to go to next page will not be allowed.
18	offlineStoragePathThis property gives the path where the data is stored using window.localStorage.The path can be changed using --local-storage-path from command line.
19	offlineStorageQuotaThis property defines the maximum amount of data you can store in window.localStorage.The value is 5242880 bytes which is 5MB.This value can overwritten at command line using the following command --localstorage-quota = size over here.
20	ownsPagesownsPages returns true or false if the page opened by the webpage is a child of the webpage.
21	pagesWindowNamePagesWindowName will give the names of the windows open using window.open
22	pagesThe pages property will you give array of pages opened in a page using window.open. If the page is closed in url you referring the page will not be considered.
23	paperSizeThis property gives the size ie dimensions of the webpage when needs to be used to convert the webpage in a pdf format.paperSize contains the dimensions required in an object.
24	plaintextThis property also gives the contents of the current active frame but only contents without any html tags.
25	scrollPositionThis contains object indicating the scroll position. It gives left and top.
26	settingsThis property will give the settings of the webpage when page.open method is used. Once the page is loaded the changes in settings properties will not create any impact.
27	titleThis property will give you the title of the page you are reading.
28	urlThis property will give the page url.
29	viewportSizeThis property allows to change the size of the window display. It contains width and height, which you can read or change it as per the needs.
30	windowNameGives the name of the window.
31	zoomFactorThis property specifies the zoom factor for render and renderBase64 methods. It helps to zoom a page and take a screen capture if required.

PhantomJS - Webpage Module Properties

PhantomJS - Webpage Module Methods

The Web Page Module has methods for Cookies, Frames, Page Navigation, Reload, Rendering and Uploading of Files. Following are the methods available on the web page.

S.No	Methods & Description
1	addCookie()addCookie method adds cookies to the page specified.
2	childFramesCount()This method is deprecated as per http://phantomjs.org.
3	childFramesName()This method is deprecated as per http://phantomjs.org.
4	clearCookies()Will delete all the cookies for the page specified.
5	close()This method is used to close the page and release the memory used. Any of the webpage methods or properties will not work once the close is called.
6	currentFrameName()This method is deprecated as per http://phantomjs.org.
7	deleteCookie()This will delete a cookie with the name matching with the existing list of cookies present for a given page url.
8	evaluateAsync()Evaluate given function asynchronously within the page without blocking current execution. This function helps to execute certain scripts asynchronously.
9	evaluateJavascript()EvaluateJavaScript helps to execute the function passed to it as a string. Please note the string passed has to be a function only.
10	evaluate()Evaluate will execute the function passed to it. If the function contain console messages it is not displayed directly in the terminal. To display any console messages you need to use onConsoleMessage phantom callback.
11	getPage()This will give you the child page that matches the windowname passed in getpage.
12	goBack()It gives the previous page in navigation history, if only the navigation is not locked.
13	goForward()It gives the next page in navigation history, if only the navigation is not locked.
14	go()This method allows you to navigate with the pages.
15	includeJs()Includejs executes the external JS file on page and executes the callback function on completion.
16	injectJs()InjectJs includes external script from a specified file into the page. If the file is not available in the current directory, then it used libraryPath for additional search of the file. It returns true if the file is injected, otherwise false.
17	openUrl()OpenUrl opens up a webpage. It is similar to open method of PhantomJS. OpenUrl has some additional parameters, which are httpConf, settings and callback functions.
18	open()Open is used to open up a webpage.
19	release()Release will release the memory heap usage for the page. Do not use page instance methods after the release is called. This method is similar to the close method and the usage of it is deprecated. Instead use wpage.close().
20	reload()Reload is used to reload the current page used.
21	renderBase64()This method takes the screen capture and gives the image as a string in base46. Renderbase64 supports format like PNG, JPEG and JPG. It does not support gif as of now. You can use clipRect property to define the portion for image capture.
22	renderBuffer()RenderBuffer takes the capture of the webpage to an image buffer, which can be directly sent to the server. Formats supported are PNG, GIF and JPEG.
23	render()Render helps to take the image buffer and save it as per the format specified.
24	sendEvent()It is used to send an event to the webpage. They are not dom events. Each of these events are sent to the webpage based on user interaction.
25	setContent()setcontent will change the page content of the specified url with the contents specified.
26	stop()It helps to stop loading of the page.
27	switchToChildFrame()It is deprecated to use switchToFrame();
28	switchToFocusedFrame()It selects the frame, which is in focus.
29	switchToFrame()Selects frame with the name specified and which is child of current frame.
30	switchToMainFrame()Selects mainframe i.e. the root window.
31	switchToParentFrame()It takes the parent frame of the current child frame.
32	uploadFile()This method is used to handle the file upload done using form in html. PhantomJS does not have a direct way to do so using forms the same can be achieved using uploadFile method. It takes html tag selector for file location and the destination where it has to be copied.

PhantomJS - Webpage Module Methods

Webpage Module Events/Callbacks

The callbacks available with the webpage module are described in the following table.

S.No	Callbacks & Description
1	onAlert()This callback is called when there is an alert on the page; the callback takes a string and does not return anything.
2	onCallback()OnCallback is used to pass values from webpage to webpage object and it is done using the window.callPhantom() method, which internally invokes the onCallback function.
3	onClosing()This is called when the window is closed either by using the page.close() method or the window.close() method.
4	onConfirm()This callback is called when there is a confirmed message called with ok /cancel from the page.
5	onConsoleMessage()This callback is used when there are console messages used in the webpage. The onConsoleMessage method takes 3 arguments.
6	onError()It is called when there is JavaScript error. The arguments for onError are msg and stack trace, which is an array.
7	onFilePicker()This is used for upload file the callback is called when user want to upload a file.
8	onInitialized()This callback is invoked when the page is called before loading.
9	onLoadFinished()This function is called when the page opened is fully loaded. It has one argument, which tells when loading was a success or a failure.
10	onLoadStarted()This callback is invoked when the page starts loading.
11	onNavigationRequested()This callback tells when the navigation event is taking place.
12	onPageCreated()This callback is invoked when a new child window is opened by the page.
13	onPrompt()This callback is called when a prompt is called by the web page. It takes 2 arguments, message and the answer. The return value is a string.
14	onResourceError()This callback is called when the webpage is not able to upload the file.
15	onResourceReceived()This callback is called when the resource requested by the page is received.
16	onResourceRequested()This function is invoked when page requests a resource.
17	onResourceTimeout()This callback is called when the requested resource times out, when settings.resourceTimeout is used.
18	onUrlChanged()This is called when the URL changes from the current one using navigation. It has one argument to the call back, which is a new URL targetUrl string.

Webpage Module Events/Callbacks

Webpage Child Process Module

The Phantomjs Child process module helps to interact with the sub-processes and talk to them using stdin /stdout/stderr. The child processes can be used for tasks like printing, sending mail or to invoke programs written in another language. To create a child process module, you need references. For example var process = require("child_process");

Spawn Method

With the spawn child process, you can subscribe to its stdout and stderr streams to get data real-time.

Syntax

Its syntax is as follows var spawn = require('child_process').spawn;

Example

Let us look at an example of the spawn method. var process = require("child_process")var spawn = process.spawnvar child = spawn("cmd", ['/c', 'dir']);child.stdout.on("data", function (data) { console.log("spawnSTDOUT---VALUE:", JSON.stringify(data))})child.stderr.on("data", function (data) { console.log("spawnSTDERR:", JSON.stringify(data))})child.on("exit", function (code) { console.log("spawnEXIT:", code)})

Output

The above program generates the following output. spawnSTDOUT---VALUE: " Volume in drive C is OS\r\n"spawnSTDOUT---VALUE: " Volume Serial Number is 7682-9C1B\r\n\r\n Directory of C:\\phantomjs\\bin\r\n\r\n"spawnSTDOUT---VALUE: "20-05-2017 10:01<DIR> .\r\n20-05-2017 10:01<DIR> ..\r\n13-05-2017 20:48 12 a,txt.txt\r\n07-05-2017 08:5163 a.js\r\n06-05-2017 16:32 120,232 a.pdf\r\n13-05-2017 20:49 spawnEXIT: 0

Webpage Child Process Module

PhantomJS - File System Module Properties

The File System Module has many APIs to deal with files and directories. You can create/write and delete a file/directory. To start using the file system module you must require a reference to the fs module. var fs = require('fs'); There are two properties available for file system module: Separator and Working Directory. Let us understand them in detail.

Separator

It tells you the separator used for the file paths.

For windows:\

For Linux: /

Syntax

Its syntax is as follows fs.seperator

Example

var fs = require('fs');console.log(fs.seperator);phantom.exit(); The above program generates the following output. undefined

workingDirectory

The working directory is the directory in which PhantomJS executes.

Syntax

Its syntax is as follows var fs = require('fs');fs.workingDirectory;

Example

var fs = require('fs');console.log(fs.workingDirectory);phantom.exit(); The above program generates the following output. C:/phantomjs/bin

PhantomJS - File System Module Properties

PhantomJS - File System Module Methods

The following table has all the methods and their descriptions, which are available on the File System module.

S.No	Methods & Description
1	absoluteThis method gives the absolute path where PhantomJS runs.
2	changeWorkingDirectoryThis allows you to change the working directory and returns true, if it succeeds otherwise returns false.
3	copyTreecopyTree will copy a directory from one path to another. The first parameter is a source folder and the second parameter is a destination folder.
4	copyThis method helps to copy file from one location to another. It takes two parameters. The first parameter is the source file and the second parameter is the file path, where it has to be copied. It will throw an error, if the source or destination file does not exist.
5	existsIt checks whether the given file path exists in the system. It returns true, if it is present, otherwise false.
6	isAbsoluteThis method will return true, if the file path is absolute and false, if relative.
7	isDirectoryisDirectory tells if the given file is a directory or not. It returns true, if directory otherwise false. It gives false in case if the given path does not exist.
8	isExecutableThis method will tell if the given file is executable or not. It returns true, if executable, otherwise false.
9	isFileThis gives details whether the filepath given is a file or not. It returns true, if it is a file and false, if it is not.
10	isLinkThis will give you true, if the file path is a symlink, otherwise false.
11	isReadableIt checks if the given file is readable or not. It gives true, if yes and false, if not.
12	isWritableIt tells whether if a given file is writable. Returns true, if yes, otherwise false.
13	lastModifiedGives the details of the last modification done to the file. It tells the date and time of when the file was last modified.
14	listIt gives all the files present in the directory.
15	makeDirectoryCreates a new directory.
16	makeTreemakeTree creates all necessary folders to be able to form final directories. This will return true, if the creation was successful, otherwise false. If the directory already exists, it will return true.
17	moveIt will move the file from one path to another.
18	openIt is used to open up the file.
19	readLinkThis will return the absolute path of a file or a folder pointed by a symlink (or shortcut on Windows). If the path is not a symlink or shortcut, it will return an empty string.
20	readThis will read the given file.
21	removeDirectoryThis will remove the given directory.
22	removeTreeIt will delete all the files and folders from the given folder and finally delete the folder itself. If there is any error while doing this process, it will throw an error 鈥<93> 'Unable to remove directory tree PATH' and hang execution.
23	removeIt removes the given file.
24	sizeIt gives the size of the file.
25	touchIt creates a given file.
26	writeWrites to a given file.

Its syntax is as follows var system = require('system');system.platform;

Example

var system = require('system');console.log(system.platform);phantom.exit(); The above program generates the following output. Phantomjs

PhantomJS - System Module Properties

PhantomJS - Web Server Module Properties

PhantomJS uses an embedded web server called mongoose. Right now, PhantomJS cannot connect with any other production webserver. With respect to connection, it can deal with 10 connections at a time and more than 10 requests will be waiting in a queue. To start a webserver, we need to use the following syntax var webserver = require (鈥榳ebserver鈥<99>); Let us understand the Port property, which is used to listen to the requests that are sent to the webserver.

port

The Port property for a webserver is used to listen to the request that are sent to it.

Syntax

Its syntax is as follows var server = require('webserver').create();var listening = server.listen(port, function (request, response) {});

Example

Let us take an example to understand how the port property works. var webserver = require('webserver'); var server = webserver.create(); var service = server.listen(8080,function(request,response){ }); if(service) console.log("server started - http://localhost:" + server.port); The above program generates the following output. server started - http://localhost:8080

PhantomJS - Web Server Module Properties

PhantomJS - Web Server Module Methods

In this chapter, we will discuss regarding the various methods of the Web Server Module of PhantomJS.

close

The close method is used to close the webserver.

Syntax

Its syntax is as follows var server = require('webserver').create();server.close();

Example

The following example shows how you can use the close method. var webserver = require('webserver');var server = webserver.create();var service = server.listen(8080,function(request,response){});if(service) console.log("server started - http://localhost:" + server.port);console.log(server.port);server.close();console.log(server.port); The above program generates the following output. server started - http://localhost:8080 8080 Here, we have consoled server.port after closing the server. Hence, it will not respond, as the webserver is already closed.

listen

The server.listen method takes the port and callback function with two arguments, which are 鈥<93> Request Object and Response Object. The Request Object contains the following properties

Method This defines the method GET /POST.

URL This displays the requested URL.

httpVersion This displays the actual http version.

Headers This displays all the headers with key value pairs.

Post Request body applicable only for the post method.

postRaw If the Content-Type header is set to 'application/x-www-formurlencoded', the original content of the post will be stored in this extra property (postRaw) and then that post will be automatically updated with a URL-decoded version of the data.

The Response Object contains the following properties

Headers Has all the HTTP headers as key-value pairs. It should be set before calling write for the first time.

SetHeader This sets a specific header.

Header (name) It returns the value of the given header.

StatusCode It sets the returned HTTP status code.

SetEncoding (encoding) This is used to convert data given to write(). By default, data will be converted to UTF-8. Indicate "binary" if data is a binary string. Not required if data is a Buffer (e.g. from page.renderBuffer).

Write (data) It sends data for the response body. Can be called multiple times.

WriteHead (statusCode, headers) It sends a response header to the request. The status code is a 3-digit HTTP status code (e.g. 404). The last arguments and headers are the response headers.

Close It closes the http connection.

CloseGracefully It is similar to close(), but it makes sure the response headers have been sent first.

Syntax

Its syntax is as follows var server = require('webserver').create(); var listening = server.listen(8080, function (request, response) {}

Example

Let us take an example to understand how the listen method works. var page = require('webpage').create(); var server = require('webserver').create(); var port = 8080; var listening = server.listen(8080, function (request, response) { console.log("GOT HTTP REQUEST"); console.log(JSON.stringify(request, null, 4)); // we set the headers here response.statusCode = 200; response.headers = {"Cache": "no-cache", "Content-Type": "text/html"}; // the headers above will now be sent implictly // now we write the body response.write("<html><head><title>Welcone to Phantomjs</title></head>"); response.write("<body><p>Hello World</p></body></html>"); response.close(); }); if (!listening) { console.log("could not create web server listening on port " + port); phantom.exit(); } var url = "http://localhost:" + port + "/foo/response.php"; console.log("sending request to :" +url); page.open(url, function (status) { if (status !== 'success') { console.log('page not opening'); } else { console.log("Getting response from the server:"); console.log(page.content); } phantom.exit(); }); The above program generates the following output. sending request to :http://localhost:8080/foo/response.php GOT HTTP REQUEST { "headers": { "Accept": "text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8", "Accept-Encoding": "gzip, deflate", "Accept-Language": "en-IN,*", "Connection": "Keep-Alive", "Host": "localhost:8080", "User-Agent": "Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/538.1 (KHTML, like Gecko) PhantomJS/2.1.1 Safari/538.1" }, "httpVersion": "1.1", "method": "GET", "url": "/foo/response.php" } Getting response from the server: <html><head><title>Welcone to Phantomjs</title></head><body><p>Hello World</p></body></html>

PhantomJS - Web Server Module Methods

PhantomJS - Command Line Interface

PhantomJS can be executed using the keyword "phantomjs" and the name of the file. For example, "phantomjs file.js". You can also pass arguments into "file.js" as follows phantomjs [options] file.js arg1 arg2 ... Let us go through some of the options available at the command line.

S.No	Option & Description
1	--help or 鈥揾 Will display all the command line options. Halts immediately and will not run the script passed.
2	--version or 鈥搗 Prints the version of PhantomJS running. This will halt the execution of script to be run.
3	--debug[true\|false] Prints warnings and debug messages. By default, it is set to false. You can also use [yes\|no].
4	--cookies-file = /path/to/cookies.txt File name to store persistent cookies.
5	--diskcache=[true\|false] Enables disk cache. It also takes values [yes\|no]
6	--disk-cahe-path Path for disk cache.
7	--ignore-sslerrors=[true\|false] Ignore SSL errors. For example 鈥<93> Expired or self-signed certificate errors. Default is false. It also takes values [yes\|no].
8	--loadimages=[true\|false] Loads all inline images. Default value is true. It also takes [yes\|no].
9	--local-storagepath=/some/path Path to save LocalStorage content and WebSQL content.
10	--local-storagequota=number Maximum size to allow for data.
11	--local-url-access Allows use of 鈥榝ile:///鈥<99> URLs (default is true).
12	--local-to-remote-urlaccess=[true\|false] Allows local content to access remote URL. Default is false. It also takes values [yes\|no].
13	--max-disk-cachesize=size Limits the size of disk cache (in KB)
14	--offline-storage-path Specifies location for offline storage.
15	--offline-storage-quota Sets the maximum size of the offline storage in KB.
16	--outputencoding=encoding Sets the encoding used for terminal output. Default is utf-8.
17	--proxy=address:port Specifies the proxy server to be used (For example 鈥<93> proxy=192.168.1.1:8080)
18	--proxytype=[http\|socks5\|none] Specifies the type of proxy server (default is http)
19	--proxy-auth Authentication information for the proxy. For example 鈥<93> --proxy-auth=username:password
20	--scriptencoding=encoding Sets the encoding used for the script. Default is utf8.
21	--script-language Sets the script language.

PhantomJS - Command Line Interface

PhantomJS - Screen Capture

PhantomJS is very helpful in taking a screenshot of a webpage and converting a webpage into a PDF. We have given here a simple example to demonstrate how it works.

Example

var page = require('webpage').create();page.open('http://phantom.org/',function(status){ page.render('phantom.png'); phantom.exit();}); Execute the above program and the output will be saved as phantom.png. Optimal Solution

Convert Webpages into PDFs

PhantomJS also helps to convert webpages into PDFs with header and footer added to it. Take a look at the following example to understand how it works. var wpage = require('webpage').create(); var url = "https://en.wikipedia.org/wiki/Main_Page"; var output = "test.pdf"; wpage.paperSize = { width: screen.width+'px', height: '1500px', margin: { 'top':'50px', 'left':'50px', 'rigtht':'50px' }, orientation:'portrait', header: { height: "1cm", contents: phantom.callback(function(pageNumber, nPages) { return "<h5>Header <b>" + pageNumber + " / " + nPages + "</b></h5>"; }) }, footer: { height: "1cm", contents: phantom.callback(function(pageNumber, nPages) { return "<h5>Footer <b>" + pageNumber + " / " + nPages + "</b></h5>"; }) } } wpage.open(url, function (status) { if (status !== 'success') { console.log('Page is not opening'); phantom.exit(); } else { wpage.render(output); phantom.exit(); } }); The above program generates the following output. The above will convert the page into pdf and will be saved in test.pdf

Convert a Canvas to an Image

Phantomjs can easily convert a Canvas to an Image. Take a look at the following example to understand how it works. var page = require('webpage').create(); page.content = '<html><body><canvas id="surface" width="400" height="400"></canvas></body></html>'; page.evaluate(function() { var context,e1; el = document.getElementById('surface'); context = el.getContext('2d'); context.font = "30px Comic Sans MS"; context.fillStyle = "red"; context.textAlign = "center"; context.fillText("Welcome to PhantomJS ", 200, 200); document.body.style.backgroundColor = 'white'; document.body.style.margin = '0px'; }); page.render('canvas.png'); phantom.exit(); The above program generates the following output. Welcome Phantomjs

PhantomJS - Screen Capture

PhantomJS - Page Automation

PhantomJS, with the help of its webpage module APIs, can manipulate webpages and perform operations such as DOM manipulation, clicking on buttons, etc.

Fetch Images from a Page

The following program shows how you can use PhantomJS to fetch images from a page. var wpage = require('webpage').create();wpage.onConsoleMessage = function(str) { console.log(str.length);}wpage.open("http://phantomjs.org", function(status) { console.log(status); var element = wpage.evaluate(function() { var imgdata = document.querySelectorAll('img'); var imgsrc = []; if (imgdata) { for (var i in imgdata) { imgsrc.push(imgdata[0].src); } } return imgsrc; }); console.log(JSON.stringify(element));}); The above program generates the following output. Success ["http://phantomjs.org/img/phantomjslogo.png","http://phantomjs.org/img/phantom js-logo.png","http://phantomjs.org/img/phantomjslogo.png","http://phantomjs.org /img/phantomjs-logo.png"] It is possible to include external JavaScript in a page using the injectJS webpage method. There are many properties and methods, which can help page automation and do many other things. You can refer the webpage module where the properties and methods are explained in detail.

PhantomJS - Page Automation

PhantomJS - Network Monitoring

With help of PhantomJS, we can monitor the network and validate the behavior and performance of a particular webpage. There are callbacks in PhantomJS, i.e., onResourceRequested and onResourceReceived, which help in monitoring the traffic for a given page.

Example

The following example shows how you can use PhantomJS to monitor traffic for a given page. function createHAR(address, title, startTime, resources) { // this function formats the data which is coming from onresourcerequest and onresourcereceived var entries = []; resources.forEach(function (resource) { var request = resource.request, startReply = resource.startReply, endReply = resource.endReply; if (!request || !startReply || !endReply) { return; } // Exclude Data URI from HAR file because // they aren't included in specification if (request.url.match(/(^data:image\/.*)/i)) { return; } entries.push ({ startedDateTime: request.time.toISOString(), time: endReply.time - request.time, request: { method: request.method, url: request.url, httpVersion: "HTTP/1.1", cookies: [], headers: request.headers, queryString: [], headersSize: -1, bodySize: -1 }, response: { status: endReply.status, statusText: endReply.statusText, httpVersion: "HTTP/1.1", cookies: [], headers: endReply.headers, redirectURL: "", headersSize: -1, bodySize: startReply.bodySize, content: { size: startReply.bodySize, mimeType: endReply.contentType } }, cache: {}, timings: { blocked: 0, dns: -1, connect: -1, send: 0, wait: startReply.time - request.time, receive: endReply.time - startReply.time, ssl: -1 }, pageref: address }); }); return { log: { version: '1.2', creator: { name: "PhantomJS", version: phantom.version.major + '.' + phantom.version.minor + '.' + phantom.version.patch }, pages: [{ startedDateTime: startTime.toISOString(), id: address, title: title, pageTimings: { onLoad: page.endTime - page.startTime } }], entries: entries } }; } var page = require('webpage').create(), system = require('system'); var fs = require('fs'); if (system.args.length === 1) { console.log('Usage: netsniff.js <some URL>'); phantom.exit(1); } else { page.address = system.args[1]; page.resources = []; page.onLoadStarted = function () { // called when page is loaded page.startTime = new Date(); }; page.onResourceRequested = function (req) { // called when any files are requested from given page url page.resources[req.id] = { request: req, startReply: null, endReply: null }; }; page.onResourceReceived = function (res) { //called when any files are received. if (res.stage === 'start') { page.resources[res.id].startReply = res; } if (res.stage === 'end') { page.resources[res.id].endReply = res; } }; page.open(page.address, function (status) { // open given page url var har; if (status !== 'success') { console.log('FAIL to load the address'); phantom.exit(1); } else { page.endTime = new Date(); page.title = page.evaluate(function () { // gets the page title return document.title; }); har = createHAR(page.address, page.title, page.startTime, page.resources); // calls the function createHAR with page url, starttime, and page resources. // console.log(JSON.stringify(har, undefined, 4)); fs.write('log.txt', JSON.stringify(har, undefined, 4), 'w'); // logs are collected in log.txt file. phantom.exit(); } }); }

Example of log.txt given to HAR preview

{ "log": { "version": "1.2", "creator": { "name": "PhantomJS", "version": "2.1.1" }, "pages": [ { "startedDateTime": "2017-05-21T13:41:21.824Z", "id": "http://www.sample.com", "title": "Free Sample Products 鈥<93> Sample.com &Gt; Free Samples, Free Product Samples, Product Test Marketing", "pageTimings": { "onLoad": 11081 } } ], "entries": [ { "startedDateTime": "2017-05-21T13:41:21.815Z", "time": 1999, "request": { "method": "GET", "url": "http://www.sample.com/", "httpVersion": "HTTP/1.1", "cookies": [], "headers": [ { "name": "Accept", "value": "text/html,application/xhtml+xml, application/xml;q = 0.9,*/*;q = 0.8" }, { "name": "User-Agent", "value": "Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/538.1 (KHTML, like Gecko) PhantomJS/2.1.1 Safari/538.1" } ], "queryString": [], "headersSize": -1, "bodySize": -1 }, "response": { "status": 301, "statusText": "Moved Permanently", "httpVersion": "HTTP/1.1", "cookies": [], "headers": [ { "name": "Date", "value": "Sun, 21 May 2017 13:41:25 GMT" }, { "name": "Server", "value": "Apache/2.2.14 (Ubuntu)" }, { "name": "Location", "value": "http://sample.com//" }, { "name": "Vary", "value": "Accept-Encoding" }, { "name": "Content-Encoding", "value": "gzip" }, { "name": "Keep-Alive", "value": "timeout = 15, max = 100" }, { "name": "Connection", "value": "Keep-Alive" }, { "name": "Content-Type", "value": "text/html; charset = iso-8859-1" } ], "redirectURL": "", "headersSize": -1, "bodySize": 307, "content": { "size": 307, "mimeType": "text/html; charset = iso-8859-1" } }, "cache": {}, "timings": { "blocked": 0, "dns": -1, "connect": -1, "send": 0, "wait": 1999, "receive": 0, "ssl": -1 }, "pageref": "http://www.sample.com" }, ] { "startedDateTime": "2017-05-21T13:41:24.898Z", "time": 885, "request": { "method": "GET", "url": "http://sample.com/", "httpVersion": "HTTP/1.1", "cookies": [], "headers": [ { "name": "Accept", "value": "text/html,application/xhtml+xml, application/xml;q = 0.9,*/*;q = 0.8" }, { "name": "User-Agent", "value": "Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/538.1 (KHTML, like Gecko) PhantomJS/2.1.1 Safari/538.1" } ], "queryString": [], "headersSize": -1, "bodySize": -1 }, "response": { "status": 200, "statusText": "OK", "httpVersion": "HTTP/1.1", "cookies": [], "headers": [ { "name": "Date", "value": "Sun, 21 May 2017 13:41:27 GMT" }, { "name": "Server", "value": "Apache/2.2.14 (Ubuntu)" }, { "name": "X-Powered-By", "value": "PHP/5.3.2-1ubuntu4.29" }, { "name": "X-Pingback", "value": "http://sample.com/xmlrpc.php" }, { "name": "Link", "value": "<http://sample.com/wp-json/>; rel = \"https://api.w.org/\", <http://wp.me/P6Jj5H-4>; rel = shortlink" }, { "name": "Vary", "value": "Accept-Encoding" }, { "name": "Content-Encoding", "value": "gzip" }, { "name": "Keep-Alive", "value": "timeout = 15, max = 99" }, { "name": "Connection", "value": "Keep-Alive" }, { "name": "Content-Type", "value": "text/html; charset = UTF-8" } ], "redirectURL": "", "headersSize": -1, "bodySize": 1969, "content": { "size": 1969, "mimeType": "text/html; charset = UTF-8" } }, "cache": {}, "timings": { "blocked": 0, "dns": -1, "connect": -1, "send": 0, "wait": 869, "receive": 16, "ssl": -1 }, "pageref": http://www.sample.com }, { "startedDateTime": "2017-05-21T13:41:25.767Z", "time": 388, "request": { "method": "GET", "url": "http://sample.com/wpcontent/themes/samplecom/style.css", "httpVersion": "HTTP/1.1", "cookies": [], "headers": [ { "name": "Accept", "value": "text/css,*/*;q = 0.1" }, { "name": "Referer", "value": "http://sample.com/" }, { "name": "User-Agent", "value": "Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/538.1 (KHTML, like Gecko) PhantomJS/2.1.1 Safari/538.1" } ], "queryString": [], "headersSize": -1, "bodySize": -1 }, "response": { "status": 200, "statusText": "OK", "httpVersion": "HTTP/1.1", "cookies": [], "headers": [ { "name": "Date", "value": "Sun, 21 May 2017 13:41:27 GMT" }, { "name": "Server", "value": "Apache/2.2.14 (Ubuntu)" }, { "name": "Last-Modified", "value": "Fri, 22 Apr 2011 00:32:22 GMT" }, { "name": "ETag", "value": "\"e1d7-1836-4a176fdbbd180\"" }, { "name": "Accept-Ranges", "value": "bytes" }, { "name": "Vary", "value": "Accept-Encoding" }, { "name": "Content-Encoding", "value": "gzip" }, { "name": "Keep-Alive", "value": "timeout = 15, max = 98" }, { "name": "Connection", "value": "Keep-Alive" }, { "name": "Content-Type", "value": "text/css" } ], "redirectURL": "", "headersSize": -1, "bodySize": 3174, "content": { "size": 3174, "mimeType": "text/css" } }, "cache": {}, "timings": { "blocked": 0, "dns": -1, "connect": -1, "send": 0, "wait": 388, "receive": 0, "ssl": -1 }, "pageref": "http://www.sample.com" } }}

Output

The above program generates the following output.

All the logs are collected in a .txt file and later, the same is converted as above using the HAR preview, for example, (http://www.softwareishard.com/har/viewer/)

PhantomJS - Network Monitoring

PhantomJS - Testing

PhantomJS has a lot of API for a webpage, which gives all the details. PhantomJS can be used to for testing like getting the content of a page, taking screen share, converting page into a pdf, etc. There are many popular testing libraries in the market, which can be used along with PhantomJS and can be used for testing. Some of the popular frameworks that can work with PhantomJS are as follows

Mocha

Jasmine

Qunit

Hiro

Laika

Buster.JS

WebDriver

Example 鈥<93> PhantomJS with Qunit

qunit.html

<!DOCTYPE html> <html> <head> <meta charset = "utf-8"> <meta name = "viewport" content = "width = device-width"> <title>QUnit Example</title> <link rel = "stylesheet" href = "https://code.jquery.com/qunit/qunit-2.3.2.css"> </head> <body> <div id = "qunit"></div> <div id = "qunit-fixture"></div> <script src = "https://code.jquery.com/qunit/qunit-2.3.2.js"></script> </body> </html>

Output

Command phantomjs qunit.js http://localhost/tasks/qunit.html The above program generates the following output. {"passed":3,"failed":2,"total":5,"runtime":23}Time taken is 23ms to run 5 tests.3 passed, 2 failed.

PhantomJS - Testing

PhantomJS - REPL

REPL stands for Read Eval Print Loop. In PhantomJS, REPL is an interactive mode to test the JavaScript code. You can do the same thing, which is done in Google Chrome Inspector or Firebug to execute some piece of code directly on the console. REPL returns you the same platform to execute the scripts. The typed command is sent to the interpreter for immediate interpretation (EVAL) and to provide feedback (PRINT). Enter PhantomJS in the command line and it will take you to the interactive mode, where you can execute your code directly.

Syntax

Its syntax is as follows Phantomjs

Example

The following example demonstrates how REPL works in PhantomJS. phantomjs> console.log("Welcome to phantomjs");Welcome to phantomjsUndefinedphantomjs> window.navigator { "appCodeName": "Mozilla", "appName": "Netscape", "appVersion": "5.0 (Windows NT 6.2; WOW64) AppleWebKit/538.1 (KHTML, like Gecko) PhantomJS/2.1.1 Safari/538.1", "cookieEnabled": true, "language": "en-IN", "mimeTypes": { "length": 0 }, "onLine": false, "platform": "Win32", "plugins": { "length": 0 }, "product": "Gecko "productSub": "20030107", "userAgent": "Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/538.1 (KHTML, like Gecko) PhantomJS/2.1.1 Safari/538.1", "vendor": "Apple Computer, Inc.", "vendorSub": ""}phantomjs>To find the versionphantomjs> phantom.version { "major": 2, "minor": 1, "patch": 1}phantomjs> Each command is executed and the result is displayed. Use CTRL+C, CTRL+D or phantom.exit() to come out of the interactive mode. Use the up/down arrow keys to listen to the previously typed commands. There is another feature called autocompletion, which helps to remember the command. Just type "phantom" and hit the "Tab" button to get a list of available commands you can execute.

Output

The above program generates the following output. phantomjs> phantom.→| phantomjs> phantom.cookies→| phantomjs> phantom.exit→| phantomjs> phantom.version→|

PhantomJS - REPL

PhantomJS - Examples

In this chapter, we are providing a few more practical examples to understand some important features of PhantomJS.

Example 1 - Find the Page Speed

In this example, we will use PhantomJS to find the page speed for any given page URL. var page = require('webpage').create(), system = require('system'), t, address; if (system.args.length === 1) { console.log('Usage: loadspeed.js <some URL>'); phantom.exit(1); } else { t = Date.now(); address = system.args[1]; page.open(address, function (status) { if (status !== 'success') { console.log('FAIL to load the address'); } else { t = Date.now() - t; console.log('Page title is ' + page.evaluate(function () { return document.title; })); console.log('Loading time ' + t + ' msec'); } phantom.exit(); }); } The above program generates the following output. Command phantomjs pagespeed.js http://www.google.com Page title is Google Loading time 1396 msec

Example 2 - Send a Click Event to a Page

In the following example, we will use PhantomJS to send a click event to a page. var page = require('webpage').create(); page.onConsoleMessage = function(str) { console.log(str); } page.open('http://phantomjs.org/api/phantom/', function(status) { page.render('beforeclick.png'); console.log(page.url); var element = page.evaluate(function() { return document.querySelector('img[src = "http://phantomjs.org/img/phantomjslogo.png"]'); }); page.sendEvent('click', element.offsetLeft, element.offsetTop, 'left'); window.setTimeout(function () { console.log(page.url); page.render('afterclick.png'); phantom.exit(); }, 5000); console.log('element is ' + element); }); The above program generates the following output. http://phantomjs.org/api/phantom/ element is [object Object] http://phantomjs.org/ Our program will create the following two png images in the bin folder. These two images show the difference before and after the execution of the above program. Before Click

Example 3 - Submit a Form

The following example shows how to submit a form using PhantomJS. var wpage = require('webpage').create(); wpage.open("http://localhost/tasks/submitform.html", function(status) { console.log(status); wpage.uploadFile('input[name = fileToUpload]', 'output.png'); wpage.render("sform.png"); var element = wpage.evaluate(function() { return document.querySelector('input[type = "submit"]'); // getting details of submit button using queryselector. }); wpage.sendEvent('click', element.offsetLeft, element.offsetTop, 'left'); // sendevent is used to send click event and also giving the left and top position of the submit button. window.setTimeout(function () { console.log(wpage.url); wpage.render("submit.png"); // screenshot is saved in submit.png phantom.exit(); }, 5000); console.log('element is ' + element); });

submitform.html

The following code shows how to use the submitform.html file. <html> <head> <title>Window 2</title> </head> <body> <form action = "submitform.php" method = "post" enctype = "multipart/form-data" id = "form1"> <input type = "file" name = "fileToUpload" id = "fileToUpload"> <input type = "submit" value = "Upload Image" name = "submit"> </form> </body> </html> Once the form is submitted, it goes to submitform.php.

submitform.php

submitform.php is just printing the details of the files. <?php print_r($_FILES); ?> The above program generates the following output. Success element is [object Object] http://localhost/tasks/submitform.php

Images

Following are the images for file upload and form submit.

PhantomJS - Examples

PhantomJS - Quick Guide

PhantomJS - Overview

PhantomJS is said to be a headless browser because there is no involvement of browser while executing the JavaScript code. The execution will not be seen in the browser display, but on the command line prompt. The functionalities like CSS Handling, DOM Manipulation, JSON, Ajax, Canvas, SVG, etc., will all be taken care at the command prompt. PhantomJS does not have a GUI and hence, all its execution takes place at the command line. Using PhantomJS, we can write to a file, read the contents of the file or upload a file, take an screen capture, convert the webpage into a pdf and lots more. With headless browsers, you get all the browser behavior i.e. Cookies, Http Request Methods i.e. GET /POST, Clearing Cookies, Deleting Cookies, etc., Reloading of Page, Navigating to a Different Page. PhantomJS uses WebKit that has a similar browsing environment like the famous browsers 鈥<93> Google Chrome, Mozilla Firefox, Safari, etc. It also provides a lot of JavaScript API, which helps in taking screenshots, uploading of file, writing to file, reading a file, interacting with the web pages, etc. PhantomJS does not support Flash or Video, as it requires plugins and it is difficult to support the same on the command line.

Features of PhantomJS

Let us now understand the features that PhantomJS offers.

Page Automation

PhantomJS allows you to read the page contents with the help of its API. It can help to manipulate the DOM, use external libraries to carry out the task required.

Screen Capture

Headless Testing

Network Monitoring

PhantomJS - Environment Setup

For Windows

For MAC OS X

Linux 64 bit

Linux 32 bit

PhantomJS - Object

In this chapter, we will look at the four important objects PhantomJS. They are as follows

CookiesEnabled

LibraryPath

Version

Let us now discuss each of these in detail.

cookiesEnabled

It tells whether the cookies are enabled or not. It will return true, if yes; otherwise false.

Syntax

Its syntax is as follows phantom.cookiesEnabled

Example

Output

Command phantomjs cookieenabled.js Cookie Enabled value is : true

Cookies

It helps to add and set cookies to a domain. It returns an object with all the cookies available for the domain.

Syntax

Its syntax is as follows phantom.cookies;

Example

Output

LibraryPath

PhantomJS libraryPath stores the script path to be used by the injectJS method.

Syntax

Its syntax is as follows phantom.libraryPath

Example

Version

It gives the version of the PhantomJS that is running and returns the details in an object. For example: {"major":2,"minor":1,"patch":1}

Syntax

Its syntax is as follows phantom.version

Example

PhantomJS - Methods

addCookie

clearCookie

deleteCookie

Syntax

Its syntax is as follows phantom.injectJs(filename);

Example

Output

PhantomJS - Webpage Module Properties

S.No	Properties & Description
1	canGoBackThis property returns true if there is previous page in the navigation history; if not, false.
2	canGoForwardThis property returns true if there is next page in the navigation history; if not, false.
3	clipRectclipRect is an object with values top, left, width and height and used to take the image capture of the webpage when used by the render() method.
4	ContentThis property contains the contents of webpage.
5	cookiesWith cookies, you can set /get the cookies available on the URL. It will also give you the cookies available on the URL and the new cookies set on the page.
6	customHeaderscustomHeaders specifies additional HTTP request headers that will be send to server for every request issued by the page.
7	EventIt gives long list of events i.e. modifier, keys details.
8	focusedFrameNameReturns the name of the currently focused frame.
9	frameContentThis property gives the content of the frame which is active.
10	frameNameReturns the name of the currently focused frame.
11	framePlainTextThis property also gives the contents of the current active frame but only contents without any html tags.
12	frameTitleGives the title of the active frame.
13	frameUrlThis property will give the url of the currently focused frame.
14	framesCountGives the count of the frames present on the page.
15	framesNameGives array of frame names.
16	libraryPathThis property has the path, which is used by page.inectJs method.
17	navigationLockedThis property defines whether navigation of the page is allowed or not. If true it will be on current page url and clicking on page to go to next page will not be allowed.
18	offlineStoragePathThis property gives the path where the data is stored using window.localStorage.The path can be changed using --local-storage-path from command line.
19	offlineStorageQuotaThis property defines the maximum amount of data you can store in window.localStorage.The value is 5242880 bytes which is 5MB.This value can overwritten at command line using the following command --localstorage-quota = size over here.
20	ownsPagesownsPages returns true or false if the page opened by the webpage is a child of the webpage.
21	pagesWindowNamePagesWindowName will give the names of the windows open using window.open
22	pagesThe pages property will you give array of pages opened in a page using window.open. If the page is closed in url you referring the page will not be considered.
23	paperSizeThis property gives the size ie dimensions of the webpage when needs to be used to convert the webpage in a pdf format.paperSize contains the dimensions required in an object.
24	plaintextThis property also gives the contents of the current active frame but only contents without any html tags.
25	scrollPositionThis contains object indicating the scroll position. It gives left and top.
26	settingsThis property will give the settings of the webpage when page.open method is used. Once the page is loaded the changes in settings properties will not create any impact.
27	titleThis property will give you the title of the page you are reading.
28	urlThis property will give the page url.
29	viewportSizeThis property allows to change the size of the window display. It contains width and height, which you can read or change it as per the needs.
30	windowNameGives the name of the window.
31	zoomFactorThis property specifies the zoom factor for render and renderBase64 methods. It helps to zoom a page and take a screen capture if required.

PhantomJS - Webpage Module Methods

The Web Page Module has methods for Cookies, Frames, Page Navigation, Reload, Rendering and Uploading of Files. Following are the methods available on the web page.

S.No	Methods & Description
1	addCookie()addCookie method adds cookies to the page specified.
2	childFramesCount()This method is deprecated as per http://phantomjs.org.
3	childFramesName()This method is deprecated as per http://phantomjs.org.
4	clearCookies()Will delete all the cookies for the page specified.
5	close()This method is used to close the page and release the memory used. Any of the webpage methods or properties will not work once the close is called.
6	currentFrameName()This method is deprecated as per http://phantomjs.org.
7	deleteCookie()This will delete a cookie with the name matching with the existing list of cookies present for a given page url.
8	evaluateAsync()Evaluate given function asynchronously within the page without blocking current execution. This function helps to execute certain scripts asynchronously.
9	evaluateJavascript()EvaluateJavaScript helps to execute the function passed to it as a string. Please note the string passed has to be a function only.
10	evaluate()Evaluate will execute the function passed to it. If the function contain console messages it is not displayed directly in the terminal. To display any console messages you need to use onConsoleMessage phantom callback.
11	getPage()This will give you the child page that matches the windowname passed in getpage.
12	goBack()It gives the previous page in navigation history, if only the navigation is not locked.
13	goForward()It gives the next page in navigation history, if only the navigation is not locked.
14	go()This method allows you to navigate with the pages.
15	includeJs()Includejs executes the external JS file on page and executes the callback function on completion.
16	injectJs()InjectJs includes external script from a specified file into the page. If the file is not available in the current directory, then it used libraryPath for additional search of the file. It returns true if the file is injected, otherwise false.
17	openUrl()OpenUrl opens up a webpage. It is similar to open method of PhantomJS. OpenUrl has some additional parameters, which are httpConf, settings and callback functions.
18	open()Open is used to open up a webpage.
19	release()Release will release the memory heap usage for the page. Do not use page instance methods after the release is called. This method is similar to the close method and the usage of it is deprecated. Instead use wpage.close().
20	reload()Reload is used to reload the current page used.
21	renderBase64()This method takes the screen capture and gives the image as a string in base46. Renderbase64 supports format like PNG, JPEG and JPG. It does not support gif as of now. You can use clipRect property to define the portion for image capture.
22	renderBuffer()RenderBuffer takes the capture of the webpage to an image buffer, which can be directly sent to the server. Formats supported are PNG, GIF and JPEG.
23	render()Render helps to take the image buffer and save it as per the format specified.
24	sendEvent()It is used to send an event to the webpage. They are not dom events. Each of these events are sent to the webpage based on user interaction.
25	setContent()setcontent will change the page content of the specified url with the contents specified.
26	stop()It helps to stop loading of the page.
27	switchToChildFrame()It is deprecated to use switchToFrame();
28	switchToFocusedFrame()It selects the frame, which is in focus.
29	switchToFrame()Selects frame with the name specified and which is child of current frame.
30	switchToMainFrame()Selects mainframe i.e. the root window.
31	switchToParentFrame()It takes the parent frame of the current child frame.
32	uploadFile()This method is used to handle the file upload done using form in html. PhantomJS does not have a direct way to do so using forms the same can be achieved using uploadFile method. It takes html tag selector for file location and the destination where it has to be copied.

Webpage Module Events/Callbacks

The callbacks available with the webpage module are described in the following table.

S.No	Callbacks & Description
1	onAlert()This callback is called when there is an alert on the page; the callback takes a string and does not return anything.
2	onCallback()OnCallback is used to pass values from webpage to webpage object and it is done using the window.callPhantom() method, which internally invokes the onCallback function.
3	onClosing()This is called when the window is closed either by using the page.close() method or the window.close() method.
4	onConfirm()This callback is called when there is a confirmed message called with ok /cancel from the page.
5	onConsoleMessage()This callback is used when there are console messages used in the webpage. The onConsoleMessage method takes 3 arguments.
6	onError()It is called when there is JavaScript error. The arguments for onError are msg and stack trace, which is an array.
7	onFilePicker()This is used for upload file the callback is called when user want to upload a file.
8	onInitialized()This callback is invoked when the page is called before loading.
9	onLoadFinished()This function is called when the page opened is fully loaded. It has one argument, which tells when loading was a success or a failure.
10	onLoadStarted()This callback is invoked when the page starts loading.
11	onNavigationRequested()This callback tells when the navigation event is taking place.
12	onPageCreated()This callback is invoked when a new child window is opened by the page.
13	onPrompt()This callback is called when a prompt is called by the web page. It takes 2 arguments, message and the answer. The return value is a string.
14	onResourceError()This callback is called when the webpage is not able to upload the file.
15	onResourceReceived()This callback is called when the resource requested by the page is received.
16	onResourceRequested()This function is invoked when page requests a resource.
17	onResourceTimeout()This callback is called when the requested resource times out, when settings.resourceTimeout is used.
18	onUrlChanged()This is called when the URL changes from the current one using navigation. It has one argument to the call back, which is a new URL targetUrl string.

Webpage Child Process Module

Spawn Method

With the spawn child process, you can subscribe to its stdout and stderr streams to get data real-time.

Syntax

Its syntax is as follows var spawn = require('child_process').spawn;

Example

Output

PhantomJS - File System Module Properties

Separator

It tells you the separator used for the file paths.

For windows:\

For Linux: /

Syntax

Its syntax is as follows fs.seperator

Example

var fs = require('fs');console.log(fs.seperator);phantom.exit(); The above program generates the following output. undefined

workingDirectory

The working directory is the directory in which PhantomJS executes.

Syntax

Its syntax is as follows var fs = require('fs');fs.workingDirectory;

Example

var fs = require('fs');console.log(fs.workingDirectory);phantom.exit(); The above program generates the following output. C:/phantomjs/bin

PhantomJS - File System Module Methods

The following table has all the methods and their descriptions, which are available on the File System module.

S.No	Methods & Description
1	absoluteThis method gives the absolute path where PhantomJS runs.
2	changeWorkingDirectoryThis allows you to change the working directory and returns true, if it succeeds otherwise returns false.
3	copyTreecopyTree will copy a directory from one path to another. The first parameter is a source folder and the second parameter is a destination folder.
4	copyThis method helps to copy file from one location to another. It takes two parameters. The first parameter is the source file and the second parameter is the file path, where it has to be copied. It will throw an error, if the source or destination file does not exist.
5	existsIt checks whether the given file path exists in the system. It returns true, if it is present, otherwise false.
6	isAbsoluteThis method will return true, if the file path is absolute and false, if relative.
7	isDirectoryisDirectory tells if the given file is a directory or not. It returns true, if directory otherwise false. It gives false in case if the given path does not exist.
8	isExecutableThis method will tell if the given file is executable or not. It returns true, if executable, otherwise false.
9	isFileThis gives details whether the filepath given is a file or not. It returns true, if it is a file and false, if it is not.
10	isLinkThis will give you true, if the file path is a symlink, otherwise false.
11	isReadableIt checks if the given file is readable or not. It gives true, if yes and false, if not.
12	isWritableIt tells whether if a given file is writable. Returns true, if yes, otherwise false.
13	lastModifiedGives the details of the last modification done to the file. It tells the date and time of when the file was last modified.
14	listIt gives all the files present in the directory.
15	makeDirectoryCreates a new directory.
16	makeTreemakeTree creates all necessary folders to be able to form final directories. This will return true, if the creation was successful, otherwise false. If the directory already exists, it will return true.
17	moveIt will move the file from one path to another.
18	openIt is used to open up the file.
19	readLinkThis will return the absolute path of a file or a folder pointed by a symlink (or shortcut on Windows). If the path is not a symlink or shortcut, it will return an empty string.
20	readThis will read the given file.
21	removeDirectoryThis will remove the given directory.
22	removeTreeIt will delete all the files and folders from the given folder and finally delete the folder itself. If there is any error while doing this process, it will throw an error 鈥<93> 'Unable to remove directory tree PATH' and hang execution.
23	removeIt removes the given file.
24	sizeIt gives the size of the file.
25	touchIt creates a given file.
26	writeWrites to a given file.

PhantomJS - System Module Properties

In this chapter, we will discuss regarding the various System Module Properties of PhantomJS.

args

Syntax

Its syntax is as follows var system = require('system'); system.args;

Example

env

The env property returns the details of the system.

Syntax

Its syntax is as follows var system = require('system'); system.env;

var system = require('system');console.log(system.platform);phantom.exit(); The above program generates the following output. Phantomjs

PhantomJS - Web Server Module Properties

port

The Port property for a webserver is used to listen to the request that are sent to it.

Syntax

Its syntax is as follows var server = require('webserver').create();var listening = server.listen(port, function (request, response) {});

Example

PhantomJS - Web Server Module Methods

In this chapter, we will discuss regarding the various methods of the Web Server Module of PhantomJS.

close

The close method is used to close the webserver.

Syntax

Its syntax is as follows var server = require('webserver').create();server.close();

Example

listen

Method This defines the method GET /POST.

URL This displays the requested URL.

httpVersion This displays the actual http version.

Headers This displays all the headers with key value pairs.

Post Request body applicable only for the post method.

The Response Object contains the following properties

Headers Has all the HTTP headers as key-value pairs. It should be set before calling write for the first time.

SetHeader This sets a specific header.

Header (name) It returns the value of the given header.

StatusCode It sets the returned HTTP status code.

Write (data) It sends data for the response body. Can be called multiple times.

WriteHead (statusCode, headers) It sends a response header to the request. The status code is a 3-digit HTTP status code (e.g. 404). The last arguments and headers are the response headers.

Close It closes the http connection.

CloseGracefully It is similar to close(), but it makes sure the response headers have been sent first.

Syntax

Its syntax is as follows var server = require('webserver').create(); var listening = server.listen(8080, function (request, response) {}

Example

PhantomJS - Command Line Interface

S.No	Option & Description
1	--help or 鈥揾 Will display all the command line options. Halts immediately and will not run the script passed.
2	--version or 鈥搗 Prints the version of PhantomJS running. This will halt the execution of script to be run.
3	--debug[true\|false] Prints warnings and debug messages. By default, it is set to false. You can also use [yes\|no].
4	--cookies-file = /path/to/cookies.txt File name to store persistent cookies.
5	--diskcache=[true\|false] Enables disk cache. It also takes values [yes\|no]
6	--disk-cahe-path Path for disk cache.
7	--ignore-sslerrors=[true\|false] Ignore SSL errors. For example 鈥<93> Expired or self-signed certificate errors. Default is false. It also takes values [yes\|no].
8	--loadimages=[true\|false] Loads all inline images. Default value is true. It also takes [yes\|no].
9	--local-storagepath=/some/path Path to save LocalStorage content and WebSQL content.
10	--local-storagequota=number Maximum size to allow for data.
11	--local-url-access Allows use of 鈥榝ile:///鈥<99> URLs (default is true).
12	--local-to-remote-urlaccess=[true\|false] Allows local content to access remote URL. Default is false. It also takes values [yes\|no].
13	--max-disk-cachesize=size Limits the size of disk cache (in KB)
14	--offline-storage-path Specifies location for offline storage.
15	--offline-storage-quota Sets the maximum size of the offline storage in KB.
16	--outputencoding=encoding Sets the encoding used for terminal output. Default is utf-8.
17	--proxy=address:port Specifies the proxy server to be used (For example 鈥<93> proxy=192.168.1.1:8080)
18	--proxytype=[http\|socks5\|none] Specifies the type of proxy server (default is http)
19	--proxy-auth Authentication information for the proxy. For example 鈥<93> --proxy-auth=username:password
20	--scriptencoding=encoding Sets the encoding used for the script. Default is utf8.
21	--script-language Sets the script language.

PhantomJS - Screen Capture

PhantomJS is very helpful in taking a screenshot of a webpage and converting a webpage into a PDF. We have given here a simple example to demonstrate how it works.

Example

Convert Webpages into PDFs

Convert a Canvas to an Image

PhantomJS - Page Automation

PhantomJS, with the help of its webpage module APIs, can manipulate webpages and perform operations such as DOM manipulation, clicking on buttons, etc.

Fetch Images from a Page

PhantomJS - Network Monitoring

Example

Example of log.txt given to HAR preview

Output

The above program generates the following output.

All the logs are collected in a .txt file and later, the same is converted as above using the HAR preview, for example, (http://www.softwareishard.com/har/viewer/)

PhantomJS - Testing

Mocha

Jasmine

Qunit

Hiro

Laika

Buster.JS

WebDriver

Example 鈥<93> PhantomJS with Qunit

qunit.html

Output

PhantomJS - REPL

Syntax

Its syntax is as follows Phantomjs

Example

Output

The above program generates the following output. phantomjs> phantom.→| phantomjs> phantom.cookies→| phantomjs> phantom.exit→| phantomjs> phantom.version→|

PhantomJS - Examples

In this chapter, we are providing a few more practical examples to understand some important features of PhantomJS.