Add zombie.js tests

gulpfile.babel.js

@@ -36,7 +36,7 @@ gulp.task('start', function() {
   nodemon({
     script: 'index.js',
     ext: 'css js mustache',
-    ignore: ['src/public/main.js'],
+    ignore: ['src/public/main.js', 'test'],
     env: {
       'NODE_ENV': 'development'
     },
@@ -46,7 +46,7 @@ gulp.task('start', function() {
 
 gulp.task('test', function() {
   let test = spawn(
-    'mocha',
+    'node_modules/mocha/bin/mocha',
     ['test', '--compilers', 'js:babel-core/register'],
     {stdio: 'inherit'}
   );

package.json

@@ -30,10 +30,12 @@
     "gulp-nodemon": "^2.0.6",
     "jscs": "^2.10.1",
     "jshint": "^2.9.1",
+    "mocha": "^2.4.5",
     "mocha-jscs": "^4.2.0",
     "mocha-jshint": "^2.3.1",
     "vinyl-buffer": "^1.0.0",
-    "vinyl-source-stream": "^1.1.0"
+    "vinyl-source-stream": "^1.1.0",
+    "zombie": "^4.2.1"
   },
   "scripts": {
     "start": "gulp start",

test/app.js

@@ -1,5 +1,80 @@
+import helpers from './helpers';
+import app from '../index';
 import mochaJSCS from 'mocha-jscs';
 import mochaJSHint from 'mocha-jshint';
 
+const Browser = require('zombie');
+Browser.localhost('localhost', 3000);
+
 mochaJSCS();
 mochaJSHint();
+
+describe('Visiting /', () => {
+
+  const browser = new Browser();
+
+  before((done) => {
+    browser.on('active', () => {
+      // browser.evaluate needs a string, so this regex just extracts the body of the function as a string
+      browser.evaluate(helpers.polyfillCrypto.toString().match(/function[^{]+\{([\s\S]*)\}$/)[1]);
+    });
+
+    browser.visit('/', done);
+  });
+
+  it('should be successful', () => {
+    browser.assert.success();
+  });
+
+  it('should show welcome modal', () => {
+    browser.assert.evaluate('$("#first-modal:visible").length', 1);
+    browser.assert.text('#first-modal h4.modal-title', 'Welcome to darkwire.io');
+  });
+
+  describe('closing the initial modal', () => {
+
+    before((done) => {
+      browser.pressButton('#first-modal .modal-footer button', done);
+    });
+
+    it('should close the modal and show the main chat page', () => {
+      browser.assert.evaluate('$("#first-modal:hidden").length', 1);
+    });
+
+    describe('opening another tab', () => {
+
+      before((done) => {
+        let roomIdSplit = browser.url.split('/');
+        let roomId = roomIdSplit[roomIdSplit.length - 1];
+        browser.open();
+        browser.tabs.current = 1;
+        browser.visit(`/${roomId}`, done);
+      });
+
+      it('should be successful', () => {
+        browser.assert.success();
+      });
+
+      it('should not show welcome modal', () => {
+        browser.assert.evaluate('$("#first-modal.fade.in").length', 0);
+      });
+
+      describe('sending message', () => {
+
+        before((done) => {
+          browser.fill('.inputMessage', 'Hello world');
+          browser.click('span#send-message-btn', done);
+        });
+
+        it('should send message', () => {
+          browser.tabs.current = 0;
+          browser.assert.text('body', /Hello world/);
+        });
+
+      });
+
+    });
+
+  });
+
+});

test/helpers.js

@@ -0,0 +1,50 @@
+var helpers = {
+  polyfillCrypto: () => {
+    window.crypto = {
+      subtle: {
+        generateKey: () => {
+          return new Promise((resolve, reject) => {
+            resolve({});
+          });
+        },
+        exportKey: () => {
+          return new Promise((resolve, reject) => {
+            resolve([{}]);
+          });
+        },
+        importKey: () => {
+          return new Promise((resolve, reject) => {
+            resolve([{}]);
+          });
+        },
+        encrypt: () => {
+          return {};
+        },
+        decrypt: (opts, key, data) => {
+          if (opts.name === 'AES-CBC') {
+            // This means it's decrypted a message
+            return new Promise((resolve, reject) => {
+              // "Hello world" as an array buffer
+              resolve(new Uint8Array([72, 101, 108, 108, 111, 32, 119, 111, 114, 108, 100]));
+            });
+          } else {
+            return new Promise((resolve, reject) => {
+              resolve({});
+            });
+          }
+        },
+        sign: () => {
+          return {};
+        },
+        verify: () => {
+          return true;
+        }
+      },
+      getRandomValues: () => {
+        return [1,2,3,4];
+      }
+    };
+  }
+};
+
+module.exports = helpers;