Merge lp:~stephen-stewart/ulysses/fix-jenkins-testing into lp:ulysses

[Stephen Stewart]

Use casperjs/phantomcss directly

Use casperjs/phantomcss directly rather than through a third party plugin, which gives us control of phantomjs version and solves a number of issues.

Casperjs error state will now be passed to gulp and any failing tests should exit correctly.

[lp:~stephen-stewart/ulysses/fix-jenkins-testing]

49. By Stephen Stewart on 2014-10-07

remove gulp-phantomcss

[Łukasz Czyżykowski (lukasz-czyzykowski)]

LGTM

review: Approve

=== modified file '.bzrignore'
--- .bzrignore	2014-09-24 18:18:18 +0000
+++ .bzrignore	2014-10-07 10:53:43 +0000
@@ -1,8 +1,5 @@
-*.swp
 node_modules
 bower_components
-*.fail.png
-*.diff.png
-.DS_Store
-failures
 npm-debug.log
+test/visual/results
+test/visual/failures

=== modified file 'gulpfile.js'
--- gulpfile.js	2014-09-24 18:18:18 +0000
+++ gulpfile.js	2014-10-07 10:53:43 +0000
@@ -6,11 +6,12 @@
 var del = require('del');
 var fs = require('fs');
 var gulp = require('gulp');
+var gutil = require('gulp-util');
 var gulpFilter = require('gulp-filter');
-var phantomcss = require('gulp-phantomcss');
 var pureGrids = require('rework-pure-grids');
 var replace = require('gulp-replace');
 var rework = require('rework');
+var spawn = require('child_process').spawn;
 var svgSymbols = require('gulp-svg-symbols');
 var webserver = require('gulp-webserver');
 
@@ -25,7 +26,6 @@
 gulp.task('default', ['build']);
 // to be run when newer versions of Pure or normalize are available in npm
 gulp.task('update', ['clean', 'copy', 'grids', 'build']);
-gulp.task('test', ['clean', 'build', 'test-small', 'test-large']);
 
 gulp.task('watch', function() {
   gulp.watch(paths.src + '**/*.css', ['build']);
@@ -47,9 +47,9 @@
   .pipe(gulp.dest(paths.dest));
 });
 
-gulp.task('clean', function(cb) {
+gulp.task('clean', function() {
   // You can use multiple globbing patterns as you would with `gulp.src`
-  del([paths.dest], cb);
+  del([paths.dest]);
 });
 
 gulp.task('copy', function() {
@@ -86,23 +86,19 @@
   .pipe(gulp.dest('assets'));
 });
 
-gulp.task('test-large', function (){
-  return gulp.src('./test/visual/config/desktop.js')
-  .pipe(phantomcss({
-    screenshots: './test/visual/screenshots/desktop/'
-  }));
-});
+gulp.task('test', ['clean', 'build'], function (cb){
+  var casper = spawn('./node_modules/.bin/casperjs', [
+  'test',
+  '--fail-fast',
+  'test/visual/config/'
+  ],
+  {stdio: 'inherit'});
 
-gulp.task('test-small', function (){
-  return gulp.src('./test/visual/config/smallscreen.js')
-  .pipe(phantomcss({
-    screenshots: './test/visual/screenshots/smallscreen/',
-    viewportSize: [320, 480]
-  }));
+  casper.on('close', cb);
 });
 
 gulp.task('webserver', function() {
-  gulp.src('test')
+  gulp.src('.')
   .pipe(webserver({
     open: true,
     host: '0.0.0.0'

=== modified file 'package.json'
--- package.json	2014-09-24 18:18:18 +0000
+++ package.json	2014-10-07 10:53:43 +0000
@@ -22,7 +22,6 @@
     "gulp-csso": "^0.2.9",
     "gulp-filter": "^1.0.2",
     "gulp-ignore": "^1.2.0",
-    "gulp-phantomcss": "0.0.4",
     "gulp-replace": "^0.4.0",
     "gulp-rework": "^1.0.2",
     "gulp-svg-symbols": "^0.1.5",
@@ -30,6 +29,7 @@
     "gulp-webserver": "^0.8.1",
     "normalize.css": "^3.0.1",
     "phantomcss": "^0.7.2",
+    "phantomjs": "^1.9.10",
     "purecss": "^0.5.0",
     "rework": "^1.0.1",
     "rework-pure-grids": "^1.0.0"

=== modified file 'tarmac_verify.sh'
--- tarmac_verify.sh	2014-09-24 10:32:46 +0000
+++ tarmac_verify.sh	2014-10-07 10:53:43 +0000
@@ -1,6 +1,6 @@
 #!/bin/bash
-GULP=./node_modules/.bin/gulp
+PATH=$PATH:./node_modules/.bin
 
 set -e
 npm --silent i
-$GULP --no-color test
+gulp --no-color test

=== modified file 'test/index.html'
--- test/index.html	2014-09-24 16:24:42 +0000
+++ test/index.html	2014-10-07 10:53:43 +0000
@@ -4,9 +4,9 @@
 <title>Ulysses CSS Test Page</title>
 
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0">
-<link rel="stylesheet" href="css/ulysses.css">
-<link rel="stylesheet" media="(max-width: 480px)" href="css/navbar-small.css">
-<link rel="stylesheet" media="(max-width: 480px)" href="css/searchbar-small.css">
+<link rel="stylesheet" href="../public/ulysses.css">
+<link rel="stylesheet" media="(max-width: 480px)" href="../public/navbar-small.css">
+<link rel="stylesheet" media="(max-width: 480px)" href="../public/searchbar-small.css">
 
 <!--
 

=== renamed file 'test/visual/config/desktop.js' => 'test/visual/config/large.js'
--- test/visual/config/desktop.js	2014-09-24 18:18:18 +0000
+++ test/visual/config/large.js	2014-10-07 10:53:43 +0000
@@ -1,5 +1,24 @@
-casper.start( 'http://0.0.0.0:8000/' );
-casper.then(function(){
+var phantomcss = require('./../../../node_modules/phantomcss/phantomcss.js');
+
+phantomcss.init({
+  libraryRoot: './node_modules/phantomcss',
+  screenshotRoot: './test/visual/screenshots/large',
+  failedComparisonsRoot: './test/visual/failures/large',
+  comparisonResultRoot: './test/visual/results/large',
+  errorType: 'movement',
+  fileNameGetter: function(root,filename){ 
+    var name = root+'/'+filename.toLowerCase().replace(/ /g,'_');
+    if(fs.isFile(name+'.png')){
+      return name+'.diff.png';
+    } else {
+      return name+'.png';
+    }
+  },
+});
+
+casper.start( './test/index.html' );
+
+casper.viewport(1024, 768, function(){
     // buttons
     phantomcss.screenshot('[data-qa="default-button"]', 'Default Button');
     phantomcss.screenshot('[data-qa="primary-button"]', 'Primary Button');
@@ -31,3 +50,20 @@
     // phantomcss.screenshot('[data-qa="notifications"]', 'notifications');
     //
 });
+
+casper.then( function now_check_the_screenshots(){
+  // compare screenshots
+  phantomcss.compareAll();
+});
+
+casper.then( function end_it(){
+  casper.test.done();
+});
+
+/*
+Casper runs tests
+*/
+casper.run(function(){
+  console.log('\nTHE END.');
+  phantom.exit(phantomcss.getExitStatus());
+});

=== added file 'test/visual/config/small.js'
--- test/visual/config/small.js	1970-01-01 00:00:00 +0000
+++ test/visual/config/small.js	2014-10-07 10:53:43 +0000
@@ -0,0 +1,43 @@
+var phantomcss = require('./../../../node_modules/phantomcss/phantomcss.js');
+
+phantomcss.init({
+  libraryRoot: './node_modules/phantomcss',
+  screenshotRoot: './test/visual/screenshots/small',
+  failedComparisonsRoot: './test/visual/failures/small',
+  comparisonResultRoot: './test/visual/results/small',
+  errorType: 'movement',
+  fileNameGetter: function(root,filename){ 
+    var name = root+'/'+filename.toLowerCase().replace(/ /g,'_');
+    if(fs.isFile(name+'.png')){
+      return name+'.diff.png';
+    } else {
+      return name+'.png';
+    }
+  },
+});
+
+casper.start( './test/index.html' );
+
+casper.viewport(320, 480, function(){
+    // navbars, small screen
+    phantomcss.screenshot('[data-qa="navbar-simple"]', 'Simple Navbar');
+    phantomcss.screenshot('[data-qa="navbar-invert"]', 'Invert Navbar');
+    phantomcss.screenshot('[data-qa="navbar-full"]', 'Full Navbar');
+});
+
+casper.then( function now_check_the_screenshots(){
+  // compare screenshots
+  phantomcss.compareAll();
+});
+
+casper.then( function end_it(){
+  casper.test.done();
+});
+
+/*
+Casper runs tests
+*/
+casper.run(function(){
+  console.log('\nTHE END.');
+  phantom.exit(phantomcss.getExitStatus());
+});

=== removed file 'test/visual/config/smallscreen.js'
--- test/visual/config/smallscreen.js	2014-09-24 10:17:01 +0000
+++ test/visual/config/smallscreen.js	1970-01-01 00:00:00 +0000
@@ -1,9 +0,0 @@
-casper.start( './test/index.html' );
-
-casper.then(function(){
-    // navbars, small screen
-    phantomcss.screenshot('[data-qa="navbar-simple"]', 'Simple Navbar');
-    phantomcss.screenshot('[data-qa="navbar-invert"]', 'Invert Navbar');
-    phantomcss.screenshot('[data-qa="navbar-full"]', 'Full Navbar');
-
-});

=== removed directory 'test/visual/screenshots/desktop'
=== removed file 'test/visual/screenshots/desktop/Button Group_3.png'
Binary files test/visual/screenshots/desktop/Button Group_3.png	2014-09-24 18:18:18 +0000 and test/visual/screenshots/desktop/Button Group_3.png	1970-01-01 00:00:00 +0000 differ
=== removed file 'test/visual/screenshots/desktop/Button Toolbar_4.png'
Binary files test/visual/screenshots/desktop/Button Toolbar_4.png	2014-09-24 18:18:18 +0000 and test/visual/screenshots/desktop/Button Toolbar_4.png	1970-01-01 00:00:00 +0000 differ
=== removed file 'test/visual/screenshots/desktop/Checkboxes and radios_13.png'
Binary files test/visual/screenshots/desktop/Checkboxes and radios_13.png	2014-04-03 15:40:39 +0000 and test/visual/screenshots/desktop/Checkboxes and radios_13.png	1970-01-01 00:00:00 +0000 differ
=== removed file 'test/visual/screenshots/desktop/Default Button_0.png'
Binary files test/visual/screenshots/desktop/Default Button_0.png	2014-09-24 18:18:18 +0000 and test/visual/screenshots/desktop/Default Button_0.png	1970-01-01 00:00:00 +0000 differ
=== removed file 'test/visual/screenshots/desktop/Default form_11.png'
Binary files test/visual/screenshots/desktop/Default form_11.png	2014-09-24 18:18:18 +0000 and test/visual/screenshots/desktop/Default form_11.png	1970-01-01 00:00:00 +0000 differ
=== removed file 'test/visual/screenshots/desktop/Full Navbar_8.png'
Binary files test/visual/screenshots/desktop/Full Navbar_8.png	2014-04-03 15:40:39 +0000 and test/visual/screenshots/desktop/Full Navbar_8.png	1970-01-01 00:00:00 +0000 differ
=== removed file 'test/visual/screenshots/desktop/Headlines_5.png'
Binary files test/visual/screenshots/desktop/Headlines_5.png	2014-04-03 15:40:39 +0000 and test/visual/screenshots/desktop/Headlines_5.png	1970-01-01 00:00:00 +0000 differ
=== removed file 'test/visual/screenshots/desktop/Inline form_12.png'
Binary files test/visual/screenshots/desktop/Inline form_12.png	2014-09-24 18:18:18 +0000 and test/visual/screenshots/desktop/Inline form_12.png	1970-01-01 00:00:00 +0000 differ
=== removed file 'test/visual/screenshots/desktop/Invert Navbar_7.png'
Binary files test/visual/screenshots/desktop/Invert Navbar_7.png	2014-04-03 15:40:39 +0000 and test/visual/screenshots/desktop/Invert Navbar_7.png	1970-01-01 00:00:00 +0000 differ
=== removed file 'test/visual/screenshots/desktop/Navbar with button_9.png'
Binary files test/visual/screenshots/desktop/Navbar with button_9.png	2014-09-24 18:18:18 +0000 and test/visual/screenshots/desktop/Navbar with button_9.png	1970-01-01 00:00:00 +0000 differ
=== removed file 'test/visual/screenshots/desktop/Navbar with secondary text_10.png'
Binary files test/visual/screenshots/desktop/Navbar with secondary text_10.png	2014-04-03 15:40:39 +0000 and test/visual/screenshots/desktop/Navbar with secondary text_10.png	1970-01-01 00:00:00 +0000 differ
=== removed file 'test/visual/screenshots/desktop/Primary Button_1.png'
Binary files test/visual/screenshots/desktop/Primary Button_1.png	2014-09-24 18:18:18 +0000 and test/visual/screenshots/desktop/Primary Button_1.png	1970-01-01 00:00:00 +0000 differ
=== removed file 'test/visual/screenshots/desktop/Simple Navbar_6.png'
Binary files test/visual/screenshots/desktop/Simple Navbar_6.png	2014-04-03 15:40:39 +0000 and test/visual/screenshots/desktop/Simple Navbar_6.png	1970-01-01 00:00:00 +0000 differ
=== removed file 'test/visual/screenshots/desktop/Tertiary Button_2.png'
Binary files test/visual/screenshots/desktop/Tertiary Button_2.png	2014-09-24 18:18:18 +0000 and test/visual/screenshots/desktop/Tertiary Button_2.png	1970-01-01 00:00:00 +0000 differ
=== removed file 'test/visual/screenshots/desktop/grids_14.png'
Binary files test/visual/screenshots/desktop/grids_14.png	2014-04-03 15:40:39 +0000 and test/visual/screenshots/desktop/grids_14.png	1970-01-01 00:00:00 +0000 differ
=== added directory 'test/visual/screenshots/large'
=== added file 'test/visual/screenshots/large/button_group.png'
Binary files test/visual/screenshots/large/button_group.png	1970-01-01 00:00:00 +0000 and test/visual/screenshots/large/button_group.png	2014-10-07 10:53:43 +0000 differ
=== added file 'test/visual/screenshots/large/button_toolbar.png'
Binary files test/visual/screenshots/large/button_toolbar.png	1970-01-01 00:00:00 +0000 and test/visual/screenshots/large/button_toolbar.png	2014-10-07 10:53:43 +0000 differ
=== added file 'test/visual/screenshots/large/checkboxes_and_radios.png'
Binary files test/visual/screenshots/large/checkboxes_and_radios.png	1970-01-01 00:00:00 +0000 and test/visual/screenshots/large/checkboxes_and_radios.png	2014-10-07 10:53:43 +0000 differ
=== added file 'test/visual/screenshots/large/default_button.png'
Binary files test/visual/screenshots/large/default_button.png	1970-01-01 00:00:00 +0000 and test/visual/screenshots/large/default_button.png	2014-10-07 10:53:43 +0000 differ
=== added file 'test/visual/screenshots/large/default_form.png'
Binary files test/visual/screenshots/large/default_form.png	1970-01-01 00:00:00 +0000 and test/visual/screenshots/large/default_form.png	2014-10-07 10:53:43 +0000 differ
=== added file 'test/visual/screenshots/large/full_navbar.png'
Binary files test/visual/screenshots/large/full_navbar.png	1970-01-01 00:00:00 +0000 and test/visual/screenshots/large/full_navbar.png	2014-10-07 10:53:43 +0000 differ
=== added file 'test/visual/screenshots/large/grids.png'
Binary files test/visual/screenshots/large/grids.png	1970-01-01 00:00:00 +0000 and test/visual/screenshots/large/grids.png	2014-10-07 10:53:43 +0000 differ
=== added file 'test/visual/screenshots/large/headlines.png'
Binary files test/visual/screenshots/large/headlines.png	1970-01-01 00:00:00 +0000 and test/visual/screenshots/large/headlines.png	2014-10-07 10:53:43 +0000 differ
=== added file 'test/visual/screenshots/large/inline_form.png'
Binary files test/visual/screenshots/large/inline_form.png	1970-01-01 00:00:00 +0000 and test/visual/screenshots/large/inline_form.png	2014-10-07 10:53:43 +0000 differ
=== added file 'test/visual/screenshots/large/invert_navbar.png'
Binary files test/visual/screenshots/large/invert_navbar.png	1970-01-01 00:00:00 +0000 and test/visual/screenshots/large/invert_navbar.png	2014-10-07 10:53:43 +0000 differ
=== added file 'test/visual/screenshots/large/navbar_with_button.png'
Binary files test/visual/screenshots/large/navbar_with_button.png	1970-01-01 00:00:00 +0000 and test/visual/screenshots/large/navbar_with_button.png	2014-10-07 10:53:43 +0000 differ
=== added file 'test/visual/screenshots/large/navbar_with_secondary_text.png'
Binary files test/visual/screenshots/large/navbar_with_secondary_text.png	1970-01-01 00:00:00 +0000 and test/visual/screenshots/large/navbar_with_secondary_text.png	2014-10-07 10:53:43 +0000 differ
=== added file 'test/visual/screenshots/large/primary_button.png'
Binary files test/visual/screenshots/large/primary_button.png	1970-01-01 00:00:00 +0000 and test/visual/screenshots/large/primary_button.png	2014-10-07 10:53:43 +0000 differ
=== added file 'test/visual/screenshots/large/simple_navbar.png'
Binary files test/visual/screenshots/large/simple_navbar.png	1970-01-01 00:00:00 +0000 and test/visual/screenshots/large/simple_navbar.png	2014-10-07 10:53:43 +0000 differ
=== added file 'test/visual/screenshots/large/tertiary_button.png'
Binary files test/visual/screenshots/large/tertiary_button.png	1970-01-01 00:00:00 +0000 and test/visual/screenshots/large/tertiary_button.png	2014-10-07 10:53:43 +0000 differ
=== added directory 'test/visual/screenshots/small'
=== added file 'test/visual/screenshots/small/full_navbar.png'
Binary files test/visual/screenshots/small/full_navbar.png	1970-01-01 00:00:00 +0000 and test/visual/screenshots/small/full_navbar.png	2014-10-07 10:53:43 +0000 differ
=== added file 'test/visual/screenshots/small/invert_navbar.png'
Binary files test/visual/screenshots/small/invert_navbar.png	1970-01-01 00:00:00 +0000 and test/visual/screenshots/small/invert_navbar.png	2014-10-07 10:53:43 +0000 differ
=== added file 'test/visual/screenshots/small/simple_navbar.png'
Binary files test/visual/screenshots/small/simple_navbar.png	1970-01-01 00:00:00 +0000 and test/visual/screenshots/small/simple_navbar.png	2014-10-07 10:53:43 +0000 differ
=== removed directory 'test/visual/screenshots/smallscreen'
=== removed file 'test/visual/screenshots/smallscreen/Full Navbar_2.png'
Binary files test/visual/screenshots/smallscreen/Full Navbar_2.png	2014-05-12 08:57:40 +0000 and test/visual/screenshots/smallscreen/Full Navbar_2.png	1970-01-01 00:00:00 +0000 differ
=== removed file 'test/visual/screenshots/smallscreen/Invert Navbar_1.png'
Binary files test/visual/screenshots/smallscreen/Invert Navbar_1.png	2014-05-12 08:57:40 +0000 and test/visual/screenshots/smallscreen/Invert Navbar_1.png	1970-01-01 00:00:00 +0000 differ
=== removed file 'test/visual/screenshots/smallscreen/Simple Navbar_0.png'
Binary files test/visual/screenshots/smallscreen/Simple Navbar_0.png	2014-05-12 08:57:40 +0000 and test/visual/screenshots/smallscreen/Simple Navbar_0.png	1970-01-01 00:00:00 +0000 differ