Write tests for the new URL form

test/functional/helper/navigate.js

@@ -21,7 +21,8 @@ function createNavigator (baseUrl, store) {
 			method: opts.method || 'GET',
 			body: opts.body,
 			json: true,
-			qs: opts.query
+			qs: opts.query,
+			followAllRedirects: true
 		}, function (err, res, body) {
 
 			store.body = body;

test/functional/route/index.js

@@ -36,12 +36,18 @@ describe('GET /', function () {
 
 		it('should have links to each task', function () {
 			var tasks = this.last.dom.querySelectorAll('[data-test=task]');
-			assert.strictEqual(tasks.length, 3);
 			assert.strictEqual(tasks[0].querySelectorAll('[href="/abc000000000000000000001"]').length, 1);
 			assert.strictEqual(tasks[1].querySelectorAll('[href="/abc000000000000000000002"]').length, 1);
 			assert.strictEqual(tasks[2].querySelectorAll('[href="/abc000000000000000000003"]').length, 1);
 		});
 
+		it('should display a delete button for each task', function () {
+			var tasks = this.last.dom.querySelectorAll('[data-test=task]');
+			assert.strictEqual(tasks[0].querySelectorAll('[href="/abc000000000000000000001/delete"]').length, 1);
+			assert.strictEqual(tasks[1].querySelectorAll('[href="/abc000000000000000000002/delete"]').length, 1);
+			assert.strictEqual(tasks[2].querySelectorAll('[href="/abc000000000000000000003/delete"]').length, 1);
+		});
+
 		it('should display the task result counts if the task has been run', function () {
 			var tasks = this.last.dom.querySelectorAll('[data-test=task]');
 			assert.match(tasks[0].textContent, /1\s*errors/i);
@@ -54,6 +60,10 @@ describe('GET /', function () {
 			assert.match(tasks[2].textContent, /no results/i);
 		});
 
+		it('should not display an alert message', function () {
+			assert.strictEqual(this.last.dom.querySelectorAll('[data-test=alert]').length, 0);
+		});
+
 	});
 
 });

test/functional/route/new.js

@@ -0,0 +1,136 @@
+/* global beforeEach, describe, it */
+/* jshint maxlen: false, maxstatements: false */
+'use strict';
+
+var assert = require('proclaim');
+
+describe('GET /new', function () {
+
+	describe('with no query', function () {
+
+		beforeEach(function (done) {
+			var req = {
+				method: 'GET',
+				endpoint: '/new'
+			};
+			this.navigate(req, done);
+		});
+
+		it('should send a 200 status', function () {
+			assert.strictEqual(this.last.status, 200);
+		});
+
+		it('should not display an error message', function () {
+			assert.strictEqual(this.last.dom.querySelectorAll('[data-test=error]').length, 0);
+		});
+
+		it('should have an "Add new URL" form', function () {
+			var form = this.last.dom.querySelectorAll('[data-test=new-url-form]')[0];
+			assert.isDefined(form);
+			assert.strictEqual(form.getAttribute('action'), '/new');
+			assert.strictEqual(form.getAttribute('method'), 'post');
+		});
+
+		describe('"Add New URL" form', function () {
+
+			beforeEach(function () {
+				this.form = this.last.dom.querySelectorAll('[data-test=new-url-form]')[0];
+			});
+
+			it('should have a "name" field', function () {
+				var field = this.form.querySelectorAll('input[name=name]')[0];
+				assert.isDefined(field);
+				assert.strictEqual(field.getAttribute('type'), 'text');
+				assert.strictEqual(field.getAttribute('value'), '');
+			});
+
+			it('should have a "url" field', function () {
+				var field = this.form.querySelectorAll('input[name=url]')[0];
+				assert.isDefined(field);
+				assert.strictEqual(field.getAttribute('type'), 'url');
+				assert.strictEqual(field.getAttribute('value'), '');
+			});
+
+			it('should have a "standard" field', function () {
+				var field = this.form.querySelectorAll('select[name=standard]')[0];
+				assert.isDefined(field);
+				assert.strictEqual(field.querySelectorAll('option').length, 4);
+			});
+
+			it('should have "ignore" fields', function () {
+				var fields = this.form.querySelectorAll('input[name="ignore[]"]');
+				assert.isDefined(fields);
+				assert.notStrictEqual(fields.length, 0);
+			});
+
+		});
+
+	});
+
+});
+
+describe('POST /new', function () {
+
+	describe('with invalid query', function () {
+
+		beforeEach(function (done) {
+			var req = {
+				method: 'POST',
+				endpoint: '/new',
+				body: {
+					name: '',
+					url: ''
+				}
+			};
+			this.navigate(req, done);
+		});
+
+		it('should send a 200 status', function () {
+			assert.strictEqual(this.last.status, 200);
+		});
+
+		it('should display an error message', function () {
+			assert.strictEqual(this.last.dom.querySelectorAll('[data-test=error]').length, 1);
+		});
+
+	});
+
+	describe('with valid query', function () {
+
+		beforeEach(function (done) {
+			var req = {
+				method: 'POST',
+				endpoint: '/new',
+				body: {
+					name: 'Example',
+					url: 'http://example.com/',
+					standard: 'WCAG2AA'
+				}
+			};
+			this.navigate(req, done);
+		});
+
+		it('should send a 200 status', function () {
+			assert.strictEqual(this.last.status, 200);
+		});
+
+		it('should redirect me to the new URL page', function () {
+			var title = this.last.dom.querySelectorAll('title')[0];
+			assert.isDefined(title);
+			assert.match(title.textContent, /example.com/i);
+			assert.match(title.textContent, /wcag2aa/i);
+		});
+
+		it('should not display an error message', function () {
+			assert.strictEqual(this.last.dom.querySelectorAll('[data-test=error]').length, 0);
+		});
+
+		it('should display a success message', function () {
+			var alert = this.last.dom.querySelectorAll('[data-test=alert]')[0];
+			assert.isDefined(alert);
+			assert.match(alert.textContent, /url has been added/i);
+		});
+
+	});
+
+});

view/index.html

@@ -1,7 +1,7 @@
 {{#content "title"}}pa11y-dashboard{{/content}}
 
 {{#if siteMessage}}
-    <div class="col-md-12 clearfix">
+    <div class="col-md-12 clearfix" data-test="alert">
         <div class="alert alert-info site-message">
             <h3 class="crunch-top"><span class="pull-left glyphicon glyphicon-exclamation-sign"></span> Important</h3>
             <p class="h5">{{siteMessage}}</p>
@@ -10,7 +10,7 @@
 {{/if}}
 
 {{#deleted}}
-    <div class="col-md-12 clearfix">
+    <div class="col-md-12 clearfix" data-test="alert">
         <div class="alert alert-info">
             <button aria-hidden="true" data-dismiss="alert" class="close" type="button">×</button>
             <strong>Bye Bye URL</strong>

view/new.html

@@ -3,14 +3,14 @@
 	Add a new URL
 {{/content}}
 
-<form role="form" class="col-md-12" action="/new" method="post">
+<form role="form" class="col-md-12" action="/new" method="post" data-test="new-url-form">
 
 	<div class="legend">
 		<h1 class="h2 crunch-top">Add a new URL</h1>
 	</div>
 
 	{{#error}}
-		<div class="col-md-12 clearfix">
+		<div class="col-md-12 clearfix" data-test="error">
 			<div class="alert alert-danger">
 				<strong>Oh my gosh!</strong>
 				<p>{{.}}</p>

view/task/index.html

@@ -4,7 +4,7 @@
 {{/content}}
 
 {{#added}}
-	<div class="col-md-12 clearfix">
+	<div class="col-md-12 clearfix" data-test="alert">
 		<div class="alert alert-success">
 			<button aria-hidden="true" data-dismiss="alert" class="close" type="button">×</button>
 			<strong>Whoop whoop!</strong>
@@ -14,7 +14,7 @@
 {{/added}}
 
 {{#running}}
-	<div class="col-md-12 clearfix">
+	<div class="col-md-12 clearfix" data-test="alert">
 		<div class="alert alert-success">
 			<button aria-hidden="true" data-dismiss="alert" class="close" type="button">×</button>
 			<strong>New results incoming!</strong>