using phantomjs to qa your analytics implementation
TRANSCRIPT
PhantomJS and Analytics
MeasureCamp London
19 Sep 2015
Spiders and robots
Until a few years ago spiders and bots could only read the HTML. They could not execute Javascript.
Spiders and robots
Until a few years ago spiders and bots could only read the HTML. They could not execute Javascript.
Now they can:
Spiders and robots
Until a few years ago spiders and bots could only read the HTML. They could not execute Javascript.
Now they can:• Access the DOM
Spiders and robots
Until a few years ago spiders and bots could only read the HTML. They could not execute Javascript.
Now they can:• Access the DOM• Interpret Javascript
Spiders and robots
Until a few years ago spiders and bots could only read the HTML. They could not execute Javascript.
Now they can:• Access the DOM• Interpret Javascript• Fill login forms
Just like you and me
Headless testing
Increasingly testing requires writing code
• Test Driven Development• Extreme Programming
An automated test goes through the pages, executes the relevant tests and produces a bug report
Introducing
Introducing
A scriptable WebKit chrome-less browser
Simulate user behaviour and more
PhantomJS can respond to different stages of the page load
• Page initialised• Page load start• Page load finished• Page closed• Page not found
Simulate user behaviour and more
PhantomJS can respond to HTTP requests
• Resource requested• Resource received• Resource error• HTTP status text and codes
Simulate user behaviour and more
PhantomJS can respond to alerts and messages
• Javascript alert sent• Javascript console sent• Javascript prompt
Simulate user behaviour and more
PhantomJS can also
• Scan and manipulate the DOM• Catch Javascript errors in the page analysed
Simulate user behaviour and more
PhantomJS can also
• Scan and manipulate the DOM• Catch Javascript errors in the page analysed
• It can do screenshots
With PhantomJS you can write a spider to audit your analytics
implementation
Continuously
// Set the start URLvar page = require("webpage").create();var url = "http://www.adobe.com";//var url = "http://www.webtrends.com";var links;
page.viewPortSize={ width: 1280, height: 800};page.clipRect={ top:0, left:0, width:1280, height:800}phantom.onError=function(){};page.onError=function(){};page.onLoadStarted=function(){};page.onResourceReceived=function(responseData){};
Source code
page.onResourceRequested=function(requestData,networkRequest){ if(requestData.url.match(/\/b\/ss\//)) console.log(requestData.url);//Adobe Analytics if(requestData.url.match(/dcs\.gif/)) console.log(requestData.url);//Webtrends};page.onLoadFinished=function(status){ if(status=="success"){ var links = page.evaluate(function(){ var a=document.createElement("a"); return [].map.call(document.querySelectorAll("a[href]"), function(link){ a.href=link.getAttribute("href"); return a.href; }); }); console.log(links.join("\n")); }else{ //log error }; //check next page};
Source code
page.open(url,function (status){ if(status=="success"){ }else{ //log error }; phantom.exit();});
Source code
Alban Gérômeemail: [email protected]: @albangerome
All pictures from this deck taken by myself in Barcelona