diff --git a/.gitignore b/.gitignore index ecaea719..7c59d708 100644 --- a/.gitignore +++ b/.gitignore @@ -10,4 +10,5 @@ FontAwesome-Vectors.pdf index.html *.sw* npm-debug.log +src/__tests__/casperjs/screenshots/*.png diff --git a/src/__tests__/casperjs/casperUtils.js b/src/__tests__/casperjs/casperUtils.js index 77b59bd6..ff3c83d2 100644 --- a/src/__tests__/casperjs/casperUtils.js +++ b/src/__tests__/casperjs/casperUtils.js @@ -1,3 +1,6 @@ + +var screenshotCounter = 0; + var CasperUtils = { getRoot: function() { @@ -47,10 +50,44 @@ var CasperUtils = { visibleSelectors: function(selectors) { return function then() { selectors.forEach(function(selector) { + this.test.assertVisible(selector); + }.bind(this)); + }; + }, + + existingIDs: function(existingIDs) { + return function then() { + existingIDs.forEach(function(id) { + this.test.assertExists('#' + id); + }.bind(this)); + }; + }, + + existingSelectors: function(existingSelectors) { + return function then() { + existingSelectors.forEach(function(selector) { this.test.assertExists(selector); }.bind(this)); }; }, + + }, + + screenshot: { + entirePage: function () { + screenshotCounter++; + + var documentBounds = this.evaluate(function() { + return __utils__.getElementBounds('body'); + }); + casper.capture('screenshots/entirePage' + screenshotCounter + '.png', { + top: 0, + left: 0, + height: documentBounds.height, + width: documentBounds.width + }); + casper.echo('<<< Took screenshot ' + screenshotCounter + ' >>>', 'COMMENT'); + } }, waits: { @@ -64,12 +101,47 @@ var CasperUtils = { }); }, - allCommandsFinished: function () { + allCommandsFinished: function() { return this.evaluate(function() { return document.querySelectorAll('p.commandLine').length === document.querySelectorAll('p.finished').length; }); }, + + selectorVisible: function(selector) { + return function waitFor() { + return this.evaluate(function() { + return document.querySelectorAll(selector).length > 0; + }); + }; + }, + + idsVisible: function(ids) { + return function waitFor() { + return this.evaluate(function() { + var allVisible = true; + for (var i = 0; i < ids.length; i++) { + allVisible = allVisible && __utils__.exists('#' + ids[i]); + allVisible = allVisible && __utils__.visible('#' + ids[i]); + } + return allVisible; + }); + }; + }, + + idVisible: function(id) { + return function waitFor() { + return this.evaluate(function() { + return __utils__.visible(id); + }); + }; + }, + + commandVisible: function() { + return this.evaluate(function() { + return document.querySelectorAll('p.commandLine').length > 0; + }); + } }, }; diff --git a/src/__tests__/casperjs/levels_test.js b/src/__tests__/casperjs/levels_test.js new file mode 100644 index 00000000..9ca3fc70 --- /dev/null +++ b/src/__tests__/casperjs/levels_test.js @@ -0,0 +1,53 @@ +var CasperUtils = require('./casperUtils').CasperUtils; + +var levels = require('../../levels'); + +var numLevelSequences = Object.keys(levels.levelSequences).length; + +var getLevelIconIDs = function(levelID) { + var level = levels.levelSequences[levelID]; + var numLevels = Object.keys(level).length; + + // We index at 1 for the level icons + var result = []; + for (var i = 1; i <= numLevels; i++) { + result.push('levelIcon-' + levelID + i); + } + return result; +}; +var flattenArray = function(a, b) { return a.concat(b);}; + +var levelIconIDsForPages = function(start, end) { + return Object.keys(levels.levelSequences).slice(start, end) + .map(getLevelIconIDs) + .reduce(flattenArray); +}; + +casper.start( + CasperUtils.getUrlForCommands([ + 'levels', + ]), + function() { + + casper.waitFor(CasperUtils.waits.jsMount) + .waitFor(CasperUtils.waits.commandVisible) + .then( + CasperUtils.multiAssert( + CasperUtils.asserts.visibleSelectors([ + 'div.levelDropdownView' + ]), + CasperUtils.asserts.visibleIDs( + levelIconIDsForPages(0, 5) + ) + ) + ) + .then(CasperUtils.screenshot.entirePage) + .then(function() { + this.mouse.click('div[data-id="remote"]'); + }) + .then(CasperUtils.waits.idVisible('levelIcon-remote1')) + .then(CasperUtils.waits.idsVisible( + levelIconIDsForPages(5, numLevelSequences) + )) + .then(CasperUtils.testDone); +}).run(); diff --git a/src/__tests__/casperjs/pageload_test.js b/src/__tests__/casperjs/pageload_test.js index a6493c76..6a97a56e 100644 --- a/src/__tests__/casperjs/pageload_test.js +++ b/src/__tests__/casperjs/pageload_test.js @@ -1,22 +1,5 @@ var CasperUtils = require('./casperUtils').CasperUtils; -var visibleIDs = [ - 'commandLineHistory', - 'terminal', - 'interfaceWrapper', - 'mainVisSpace', - 'commandLineBar' -]; - -var selectors = [ - 'div.visBackgroundColor', - 'p.commandLine' -]; - -var doneSelectors = [ - 'p.finished' -]; - casper.start( CasperUtils.getUrlForCommands([ 'git commit', @@ -24,19 +7,26 @@ casper.start( function() { this.test.assertTitle('Learn Git Branching'); - casper.waitFor( - CasperUtils.waits.jsMount - ) + casper.waitFor(CasperUtils.waits.jsMount) .then(CasperUtils.multiAssert( - CasperUtils.asserts.visibleIDs(visibleIDs), - CasperUtils.asserts.visibleSelectors(selectors) + CasperUtils.asserts.visibleIDs([ + 'commandLineHistory', + 'terminal', + 'interfaceWrapper', + 'mainVisSpace', + 'commandLineBar' + ]), + CasperUtils.asserts.visibleSelectors([ + 'div.visBackgroundColor', + 'p.commandLine' + ]) )) .waitFor(CasperUtils.waits.allCommandsFinished) .then( - CasperUtils.asserts.visibleSelectors(doneSelectors) + CasperUtils.asserts.visibleSelectors(['p.finished']) ) .then(CasperUtils.testDone);