diff --git a/app-new/take-screenshots.js b/app-new/take-screenshots.js
index 62081af..765c335 100644
--- a/app-new/take-screenshots.js
+++ b/app-new/take-screenshots.js
@@ -6,29 +6,74 @@ var path = '';
var referenceFolder = 'reference/';
var testFolder = 'test/';
-var args = require('system').args;
-var isReference = args[1] === 'Test' ? false : true;
+var pngExtension = '.png';
+var args = require('system').args;
+var isReference = args[1] === 'Reference' ? true : false;
var pageUrl = args[2];
var selectorList = JSON.parse(args[3]);
-
var viewportName = args[4];
var viewports = args[5];
-var currentDirectory = args[6] + '/ocular/screenshots/';
+var currentDirectory = args[6] === '' ? false : args[6] + '/ocular/screenshots/';
+
+var error = {
+ 'error': false,
+ 'message': ''
+};
+
+var errorMessages = {
+ 'pageCannotBeOpened': 'The url cannot be opened',
+ 'noScreenShotpath' : 'The screenshot path cannot be created',
+ 'viewportParametersIncorrect' : 'The viewport perameters are incorrect',
+ 'noSelectorsPassed': 'No selectors have been passed',
+ 'selectorDoesnotExist': 'The selector containerNone does not exist'
+}
+
+function logErrorMessage() {
+ console.log(error.message);
+ phantom.exit();
+}
function openPage () {
page.open(pageUrl, function (status) {
- if(status !== 'success') return;
+ if(status !== 'success') {
+ error.error = true;
+ error.message = errorMessages.pageCannotBeOpened;
+
+ logErrorMessage();
+ return;
+ }
+
+ setScreenShotPath();
+
+ if (error.error) {
+ return logErrorMessage();
+ }
- checkIfIsReference();
setViewPortSize();
+
+ if (error.error) {
+ return logErrorMessage();
+ }
+
loopThroughEachComponent();
+ if (error.error) {
+ return logErrorMessage();
+ }
+
phantom.exit();
});
}
-function checkIfIsReference () {
+function setScreenShotPath() {
+
+ if (currentDirectory === false) {
+ error.error = true;
+ error.message = errorMessages.noScreenShotpath;
+ return;
+ };
+
path = currentDirectory;
path += isReference ? referenceFolder : testFolder;
}
@@ -36,6 +81,12 @@ function checkIfIsReference () {
function setViewPortSize () {
var viewportsArray = viewports.split(',');
+ if (viewportsArray.length < 2) {
+ error.error = true;
+ error.message = errorMessages.viewportParametersIncorrect;
+ return;
+ }
+
page.viewportSize = {
width: viewportsArray[0],
height: viewportsArray[1]
@@ -43,6 +94,12 @@ function setViewPortSize () {
}
function loopThroughEachComponent () {
+ if (Object.keys(selectorList).length === 0) {
+ error.error = true;
+ error.message = errorMessages.noSelectorsPassed;
+ return;
+ }
+
for (var selector in selectorList) {
currentSelector = selector;
handleEachComponent();
@@ -50,9 +107,37 @@ function loopThroughEachComponent () {
}
function handleEachComponent () {
- clipPageToComponent(selectorList[currentSelector]);
- screenshotElement();
- handleBase64();
+ var selector = selectorList[currentSelector];
+
+ var testest = doesSelectorExist(selector);
+
+ // console.log('doesSelectorExist', testest);
+
+ if (testest === false) {
+ error.error = true;
+ error.message = errorMessages.selectorDoesnotExist;
+ logErrorMessage();
+ return;
+ }
+
+ clipPageToComponent(selector);
+ // screenshotElement();
+ logReferenceMessage();
+ // handleBase64();
+}
+
+function doesSelectorExist(selector) {
+ var selectorLength = page.evaluate(function(selector) {
+ return document.querySelectorAll(selector).length;
+ }, selector);
+
+ // console.log('selectorLength', selectorLength);
+
+ if (selectorLength === 0) {
+ return false;
+ }
+
+ return true;
}
function clipPageToComponent (selector) {
@@ -62,9 +147,8 @@ function clipPageToComponent (selector) {
}
function screenshotElement () {
- var imageScreenShotPath = path + screenShotName() + '.png';
+ var imageScreenShotPath = path + screenShotName() + pngExtensions;
page.render(imageScreenShotPath);
- logReferenceMessage();
}
function logReferenceMessage () {
diff --git a/package.json b/package.json
index 1531439..50f0124 100644
--- a/package.json
+++ b/package.json
@@ -10,7 +10,6 @@
"url": "https://github.com/mmacartney10/ocularjs"
},
"scripts": {
- "start": "serve ./test/test-site/",
"app": "node app/main.js",
"test": "./node_modules/.bin/mocha ./test/*.js --timeout 10000"
},
@@ -27,7 +26,6 @@
},
"devDependencies": {
"chai": "^3.5.0",
- "mocha": "^3.2.0",
- "serve": "^3.4.0"
+ "mocha": "^3.2.0"
}
}
diff --git a/test/example-test.js b/test/example-test.js
index 6dd541b..982eed6 100644
--- a/test/example-test.js
+++ b/test/example-test.js
@@ -22,20 +22,20 @@ function callTest() {
});
}
-describe('When creating the hiHello string', function() {
- describe('And the function thisIsTest is called', function() {
- it('should return the value test', function() {
- return thisIsTest().then(function(result) {
- expect(result).to.equal('test');
- });
- });
- });
-
- describe('And the function hiHello is called', function() {
- it('should return the value test nothing', function() {
- return hiHello('test').then(function(result) {
- expect(result).to.equal('test nothing');
- });
- });
- });
-});
+// describe('When creating the hiHello string', function() {
+// describe('And the function thisIsTest is called', function() {
+// it('should return the value test', function() {
+// return thisIsTest().then(function(result) {
+// expect(result).to.equal('test');
+// });
+// });
+// });
+//
+// describe('And the function hiHello is called', function() {
+// it('should return the value test nothing', function() {
+// return hiHello('test').then(function(result) {
+// expect(result).to.equal('test nothing');
+// });
+// });
+// });
+// });
diff --git a/test/take-screenshots-test.js b/test/take-screenshots-test.js
index 6b72574..accf8b2 100644
--- a/test/take-screenshots-test.js
+++ b/test/take-screenshots-test.js
@@ -1,7 +1,8 @@
var expect = require('chai').expect;
var phantomjs = require('phantomjs');
-var spawn = require('child_process').spawn
+var spawn = require('child_process').spawn;
+var exec = require('child_process').exec;
function runChildProcess(childArguments) {
return new Promise(function(resolve, reject) {
@@ -9,45 +10,53 @@ function runChildProcess(childArguments) {
var child = spawn(phantomjs.path, childArguments);
child.stdout.on('data', (data) => {
- console.log('stdout', `${data}`);
+ // console.log('stdout', `${data}`);
resolve(`${data}`);
});
child.stderr.on('data', (error) => {
- console.log('stderr', `${error}`);
+ // console.log('stderr', `${error}`);
reject(`${error}`);
});
child.on('exit', (code) => {
- console.log('exit', `${code}`);
+ // console.log('exit', `${code}`);
resolve(`${code}`);
});
});
}
-var testData = require('./test-site/test-data.json');
-
+var testData = require('./ocular/test-data.json');
var filePath = __dirname + '/../app-new/take-screenshots.js';
-var cliAnswer = 'reference';
-var pageUrl = testData.pageUrl;
-var selectorList = '{"containerOne":"[data-container-one]"}';
+var referenceCliAnswer = 'Reference';
+var testCliAnswer = 'Test';
+
+var cliAnswer = referenceCliAnswer;
+var pageUrl = '';
+
+var selectorList = '{"containerOne":"[data-container-one]"}';
+var noSelectorList = '{"containerNone":"[data-container-none]"}';
+var twoSelectorList = '{"containerOne":"[data-container-one]", "containerTwo":"[data-container-two]"}';
var viewportName = 'smallScreen';
var viewportDimensions = [320, 480];
var currentDirectory = '../' + __dirname;
-var childArgs = [
- filePath,
- cliAnswer,
- pageUrl,
- selectorList,
- viewportName,
- viewportDimensions,
- currentDirectory
-];
+function createChildArgs() {
+ return [
+ filePath,
+ cliAnswer,
+ pageUrl,
+ selectorList,
+ viewportName,
+ viewportDimensions,
+ currentDirectory
+ ]
+};
+
@@ -55,10 +64,101 @@ var childArgs = [
describe('when the take screenshot process is ran', function() {
- describe('And there is one component on one breakpoint', function() {
- it('Should return a screenshot name with the breakpoint name and the component name', function() {
+ describe('And the url cannot be opened', function() {
+ it('Should return an error saying the url cannot be opened', function() {
+ var childArgs = createChildArgs();
+
return runChildProcess(childArgs).then(function(data) {
- expect(data).to.equal('smallScreen--containerOne\n');
+ expect(data).to.equal('The url cannot be opened\n');
+ });
+ });
+ });
+
+ describe('And the test server has been started', function() {
+
+ before(function() {
+ pageUrl = `file://${__dirname}/test-site/index.html`;
+ });
+
+ beforeEach(function() {
+ selectorList = '{"containerOne":"[data-container-one]"}';
+ viewportName = 'smallScreen';
+ viewportDimensions = [320, 480];
+ currentDirectory = '../' + __dirname;
+ });
+
+ describe('And the current directory is empty', function() {
+
+ beforeEach(function() {
+ currentDirectory = '';
+ });
+
+ it('Should return an error saying the screenshot path cannot be created', function() {
+ var childArgs = createChildArgs();
+
+ return runChildProcess(childArgs).then(function(data) {
+ expect(data).to.equal('The screenshot path cannot be created\n');
+ });
+ });
+ });
+
+ describe('And only one viewport perameter has been passed', function() {
+
+ beforeEach(function() {
+ viewportDimensions = [320];
+ });
+
+ it('Should return an error saying the viewport perameters are incorrect', function() {
+ var childArgs = createChildArgs();
+
+ return runChildProcess(childArgs).then(function(data) {
+ expect(data).to.equal('The viewport perameters are incorrect\n');
+ });
+ });
+ });
+
+ describe('And no selectors have been passed', function() {
+
+ beforeEach(function() {
+ selectorList = '{}'
+ });
+
+ it('Should return an error saying no selectors have been passed', function() {
+ var childArgs = createChildArgs();
+
+ return runChildProcess(childArgs).then(function(data) {
+ expect(data).to.equal('No selectors have been passed\n');
+ });
+ });
+ });
+
+ describe('And a selector is passed that does not exist', function() {
+
+ beforeEach(function() {
+ selectorList = '{"containerNone":"[data-container-none]"}';
+ });
+
+ it('Should return an error saying the selector does not exist', function() {
+ var childArgs = createChildArgs();
+
+ return runChildProcess(childArgs).then(function(data) {
+ expect(data).to.equal('The selector containerNone does not exist\n');
+ });
+ });
+ });
+
+ describe('And a selector is passed that exists', function() {
+
+ beforeEach(function() {
+ selectorList = '{"containerOne":"[data-container-one]"}';
+ });
+
+ it('Should return a message with the breakpoint name and the selector name', function() {
+ var childArgs = createChildArgs();
+
+ return runChildProcess(childArgs).then(function(data) {
+ expect(data).to.equal('smallScreen--containerOne\n');
+ });
});
});
});
diff --git a/test/test-site/main.css b/test/test-site/_client/main.css
similarity index 100%
rename from test/test-site/main.css
rename to test/test-site/_client/main.css
diff --git a/test/test-site/index.html b/test/test-site/index.html
index f51551c..77b8a17 100644
--- a/test/test-site/index.html
+++ b/test/test-site/index.html
@@ -1,8 +1,9 @@
-
-
-
-
- This is test
-
+
+
+
+
+
+ This is test
+
diff --git a/test/test-site/test-data.json b/test/test-site/test-data.json
deleted file mode 100644
index cb94e08..0000000
--- a/test/test-site/test-data.json
+++ /dev/null
@@ -1,14 +0,0 @@
-{
- "pageUrl": "http://localhost:3000/",
- "screenShotsPath": "./screenshots/",
- "workingDirectory": "./",
- "viewports": {
- "smallScreen": [320, 480],
- "mediumScreen_landscape": [768, 1024],
- "mediumScreen_portrait": [1024, 768],
- "largeScreen" : [1920, 1080]
- },
- "selectorList": {
- "containerOne": "[data-container-one]"
- }
-}