Merge branch 'feature/spectron' into dev

circle.yml

@@ -31,9 +31,6 @@ dependencies:
     - cp release/*.deb $CIRCLE_ARTIFACTS/
 
 test:
-  override:
-    - node_modules/.bin/mocha --reporter mocha-circleci-reporter
-    - node_modules/.bin/gulp prettify:verify
   post:
     - mv test-results.xml $CIRCLE_TEST_REPORTS/
 

package.json

@@ -19,7 +19,7 @@
     "start": "electron dist",
     "watch": "gulp watch",
     "serve": "gulp watch",
-    "test": "gulp build && mocha --recursive test/specs && gulp prettify:verify",
+    "test": "gulp build && mocha --reporter mocha-circleci-reporter --recursive test/specs && gulp prettify:verify",
     "package": "gulp package",
     "package:windows": "gulp package:windows",
     "package:osx": "gulp package:osx",
@@ -31,7 +31,8 @@
     "babel-core": "^6.7.5",
     "babel-loader": "^6.2.4",
     "babel-preset-react": "^6.5.0",
-    "chromedriver": "^2.20.0",
+    "chai": "^3.5.0",
+    "chai-as-promised": "^5.3.0",
     "del": "^2.2.0",
     "electron-builder": "^3.11.0",
     "electron-connect": "^0.3.7",
@@ -47,11 +48,10 @@
     "json-loader": "^0.5.4",
     "mocha": "^2.3.4",
     "mocha-circleci-reporter": "0.0.1",
-    "should": "^8.0.1",
+    "spectron": "~3.0.0",
     "style-loader": "^0.13.0",
     "through2": "^2.0.1",
     "vinyl-named": "^1.1.0",
-    "webdriverio": "^3.3.0",
     "webpack": "^1.12.15",
     "webpack-stream": "^3.1.0"
   },

test/modules/environment.js

@@ -1,7 +1,14 @@
 'use strict';
 
+const chai = require('chai');
+const chaiAsPromised = require('chai-as-promised');
+
+chai.should();
+chai.use(chaiAsPromised);
+
+
 const path = require('path');
-const webdriverio = require('webdriverio');
+const Application = require('spectron').Application;
 
 const source_root_dir = path.join(__dirname, '../..');
 const electron_binary_path = (function() {
@@ -16,26 +23,24 @@ const electron_binary_path = (function() {
 const config_file_path = path.join(source_root_dir, 'test/test_config.json');
 const mattermost_url = 'http://example.com/team';
 
-var options = {
-  host: 'localhost', // Use localhost as chrome driver server
-  port: 9515, // "9515" is the port opened by chrome driver.
-  desiredCapabilities: {
-    browserName: 'chrome',
-    chromeOptions: {
-      binary: electron_binary_path, // Path to your Electron binary.
-      args: ['app=' + path.join(source_root_dir, 'dist'), '--config-file=' + config_file_path] // Optional, perhaps 'app=' + /path/to/your/app/
-    }
-  }
-};
-
 module.exports = {
   sourceRootDir: source_root_dir,
   configFilePath: config_file_path,
   mattermostURL: mattermost_url,
-  spawnChromeDriver: function() {
+  getSpectronApp: function() {
-    return require('child_process').spawn('node_modules/chromedriver/lib/chromedriver/chromedriver', ['--url-base=wd/hub', '--port=9515']);
+    const app = new Application({
+      path: electron_binary_path,
+      args: [`${path.join(source_root_dir, 'dist')}`, '--config-file=' + config_file_path]
+    });
+    chaiAsPromised.transferPromiseness = app.transferPromiseness
+    return app;
   },
-  getWebDriverIoClient: function() {
+  shouldTestForPlatforms: function(testCase, platforms) {
-    return webdriverio.remote(options);
+    if (platforms.indexOf(process.platform) !== -1) {
+      return;
+    }
+    else {
+      testCase.skip();
+    }
   }
 }

test/specs/app_test.js

@@ -1,6 +1,5 @@
 'use strict';
 
-const should = require('should');
 const path = require('path');
 const fs = require('fs');
 
@@ -9,49 +8,43 @@ const env = require('../modules/environment');
 describe('application', function() {
   this.timeout(10000);
 
-  var chromedriver;
+  beforeEach(function(done) {
-  var client;
+    this.app = env.getSpectronApp();
-  before(function(done) {
+    fs.unlink(env.configFilePath, () => {
-    chromedriver = env.spawnChromeDriver();
+      done();
-    client = env.getWebDriverIoClient();
-
-    fs.unlink(env.configFilePath, function(err) {
-      // waiting for chromedriver
-      setTimeout(done, 1000);
     });
   });
 
   afterEach(function() {
-    return client.end();
+    if (this.app && this.app.isRunning()) {
+      return this.app.stop()
+    }
   });
 
-  after(function() {
+  it('should show a window', function() {
-    chromedriver.kill();
+    return this.app.start().then(() => {
+      return this.app.client.waitUntilWindowLoaded()
+        .getWindowCount().should.eventually.equal(1)
+        .browserWindow.isDevToolsOpened().should.eventually.be.false
+        .browserWindow.isVisible().should.eventually.be.true
+    });
   });
 
   it('should show settings.html when there is no config file', function() {
-    return client
+    return this.app.start().then(() => {
-      .init()
+      return this.app.client.waitUntilWindowLoaded()
-      .pause(1000)
+        .getUrl().should.eventually.match(/\/settings.html$/)
-      .getUrl().then(function(url) {
+    });
-        var p = path.parse(url);
-        p.base.should.equal('settings.html');
-      })
-      .end();
   });
 
   it('should show index.html when there is config file', function() {
     fs.writeFileSync(env.configFilePath, JSON.stringify({
       url: env.mattermostURL
     }));
-    return client
+    return this.app.start().then(() => {
-      .init()
+      return this.app.client.waitUntilWindowLoaded()
-      .pause(1000)
+        .getUrl().should.eventually.match(/\/index.html$/)
-      .getUrl().then(function(url) {
+    });
-        var p = path.parse(url);
-        p.base.should.equal('index.html');
-      })
-      .end();
   });
 
   it('should upgrade v0 config file', function() {
@@ -59,17 +52,13 @@ describe('application', function() {
     fs.writeFileSync(env.configFilePath, JSON.stringify({
       url: env.mattermostURL
     }));
-    return client
+    return this.app.start().then(() => {
-      .init()
+      return this.app.client.waitUntilWindowLoaded()
-      .pause(1000)
+        .getUrl().should.eventually.match(/\/index.html$/)
-      .getUrl().then(function(url) {
+    }).then(function() {
-        var p = path.parse(url);
+      var str = fs.readFileSync(env.configFilePath, 'utf8');
-        p.base.should.equal('index.html');
+      var config = JSON.parse(str);
-      })
+      config.version.should.equal(settings.version);
-      .end().then(function() {
+    });
-        var str = fs.readFileSync(env.configFilePath, 'utf8');
-        var config = JSON.parse(str);
-        config.version.should.equal(settings.version);
-      });
   });
 });

test/specs/browser/index_test.js

@@ -1,6 +1,5 @@
 'use strict';
 
-const should = require('should');
 const path = require('path');
 const fs = require('fs');
 
@@ -20,87 +19,49 @@ describe('browser/index.html', function() {
     }]
   };
 
-  var chromedriver;
-  var client;
-  before(function(done) {
-    chromedriver = env.spawnChromeDriver();
-    client = env.getWebDriverIoClient();
-
-    fs.unlink(env.configFilePath, function(err) {
-      // waiting for chromedriver
-      setTimeout(done, 1000);
-    });
-  });
-
   beforeEach(function() {
     fs.writeFileSync(env.configFilePath, JSON.stringify(config));
+    this.app = env.getSpectronApp();
+    return this.app.start();
   });
 
   afterEach(function() {
-    return client.end();
+    if (this.app && this.app.isRunning()) {
-  });
+      return this.app.stop()
-
+    }
-  after(function() {
-    chromedriver.kill();
   });
 
   it('should NOT show tabs when there is one team', function() {
     fs.writeFileSync(env.configFilePath, JSON.stringify({
       url: env.mattermostURL
     }));
-    return client
+    return this.app.restart().then(() => {
-      .init()
+      return this.app.client.waitUntilWindowLoaded()
-      .isExisting('#tabBar').then(function(isExisting) {
+        .isExisting('#tabBar').should.eventually.be.false
-        isExisting.should.be.false();
+    });
-      })
-      .end();
   });
 
   it('should set src of webview from config file', function() {
-    return client
+    return this.app.client.waitUntilWindowLoaded()
-      .init()
+      .getAttribute('#mattermostView0', 'src').should.eventually.equal(config.teams[0].url)
-      .getAttribute('#mattermostView0', 'src').then(function(attribute) {
+      .getAttribute('#mattermostView1', 'src').should.eventually.equal(config.teams[1].url)
-        attribute.should.equal(config.teams[0].url);
+      .isExisting('#mattermostView2').should.eventually.be.false
-      })
-      .getAttribute('#mattermostView1', 'src').then(function(attribute) {
-        attribute.should.equal(config.teams[1].url);
-      })
-      .isExisting('#mattermostView2').then(function(isExisting) {
-        isExisting.should.be.false();
-      })
-      .end();
   });
 
   it('should set name of tab from config file', function() {
-    return client
+    return this.app.client.waitUntilWindowLoaded()
-      .init()
+      .getText('#teamTabItem0').should.eventually.equal(config.teams[0].name)
-      .getText('#teamTabItem0').then(function(text) {
+      .getText('#teamTabItem1').should.eventually.equal(config.teams[1].name)
-        text.should.equal(config.teams[0].name);
-      })
-      .getText('#teamTabItem1').then(function(text) {
-        text.should.equal(config.teams[1].name);
-      })
-      .isExisting('#teamTabItem2').then(function(isExisting) {
-        isExisting.should.be.false();
-      })
-      .end();
   });
 
   it('should show only the selected team', function() {
-    return client
+    return this.app.client.waitUntilWindowLoaded()
-      .init()
+      .isVisible('#mattermostView0').should.eventually.be.true
-      .pause(1000)
+      .isVisible('#mattermostView1').should.eventually.be.false
-      .waitForVisible('#mattermostView0', 1000)
-      .isVisible('#mattermostView1').then(function(visility) {
-        visility.should.be.false();
-      })
       .click('#teamTabItem1')
       .pause(1000)
-      .waitForVisible('#mattermostView1', 1000)
+      .isVisible('#mattermostView1').should.eventually.be.true
-      .isVisible('#mattermostView0').then(function(visility) {
+      .isVisible('#mattermostView0').should.eventually.be.false
-        visility.should.be.false();
-      })
-      .end();
   });
 
   it('should show error when using incorrect URL', function() {
@@ -112,9 +73,9 @@ describe('browser/index.html', function() {
         url: 'http://false'
       }]
     }));
-    return client
+    return this.app.restart().then(() => {
-      .init()
+      return this.app.client.waitUntilWindowLoaded()
-      .waitForVisible('#mattermostView0-fail', 20000)
+        .waitForVisible('#mattermostView0-fail', 20000)
-      .end();
+    });
   });
 });

test/specs/browser/settings_test.js

@@ -1,6 +1,5 @@
 'use strict';
 
-const should = require('should');
 const path = require('path');
 const fs = require('fs');
 
@@ -8,8 +7,8 @@ const env = require('../../modules/environment');
 
 function initClient(client) {
   return client
-    .init()
+    .url('file://' + path.join(env.sourceRootDir, 'dist/browser/settings.html'))
-    .url('file://' + path.join(env.sourceRootDir, 'dist/browser/settings.html'));
+    .waitUntilWindowLoaded();
 }
 
 describe('browser/settings.html', function() {
@@ -26,96 +25,68 @@ describe('browser/settings.html', function() {
     }]
   };
 
-  var chromedriver;
-  var client;
-  before(function(done) {
-    chromedriver = env.spawnChromeDriver();
-    client = env.getWebDriverIoClient();
-
-    fs.unlink(env.configFilePath, function(err) {
-      // waiting for chromedriver
-      setTimeout(done, 1000);
-    });
-  });
-
   beforeEach(function() {
     fs.writeFileSync(env.configFilePath, JSON.stringify(config));
+    this.app = env.getSpectronApp();
+    return this.app.start();
   });
 
   afterEach(function() {
-    return client.end();
+    if (this.app && this.app.isRunning()) {
-  });
+      return this.app.stop()
-
+    }
-  after(function() {
-    chromedriver.kill();
   });
 
   it('should show index.thml when Cancel button is clicked', function() {
-    return initClient(client)
+    return initClient(this.app.client)
-      .waitForExist('#btnCancel')
       .click('#btnCancel')
       .pause(1000)
-      .getUrl().then(function(url) {
+      .getUrl().should.eventually.match(/\/index.html$/)
-        var url_split = url.split('/');
-        url_split[url_split.length - 1].should.equal('index.html');
-      })
-      .end();
   });
 
   it('should show index.thml when Save button is clicked', function() {
-    return initClient(client)
+    return initClient(this.app.client)
-      .waitForExist('#btnSave')
       .click('#btnSave')
       .pause(1000)
-      .getUrl().then(function(url) {
+      .getUrl().should.eventually.match(/\/index.html$/)
-        var url_split = url.split('/');
-        url_split[url_split.length - 1].should.equal('index.html');
-      })
-      .end();
   });
 
   describe('Options', function() {
     describe('Hide Menu Bar', function() {
       it('should appear on win32 or linux', function() {
-        return initClient(client)
+        const expected = (process.platform === 'win32' || process.platform === 'linux');
-          .isExisting('#inputHideMenuBar').then(function(isExisting) {
+        return initClient(this.app.client)
-            if (process.platform === 'win32' || process.platform === 'linux') {
+          .isExisting('#inputHideMenuBar').should.eventually.equal(expected)
-              isExisting.should.be.true();
-            }
-            else {
-              isExisting.should.be.false();
-            }
-          })
-          .end();
       });
 
-      if (process.platform === 'win32' || process.platform === 'linux') {
+      [true, false].forEach(function(v) {
-        [true, false].forEach(function(v) {
+        it(`should be loaded from config: ${v}`, function() {
-          it(`should be loaded from config: ${v}`, function() {
+          env.shouldTestForPlatforms(this, ['win32', 'linux']);
-            var new_config = {};
+          var new_config = {};
-            Object.assign(new_config, config);
+          Object.assign(new_config, config);
-            new_config.hideMenuBar = v;
+          new_config.hideMenuBar = v;
-            fs.writeFileSync(env.configFilePath, JSON.stringify(new_config));
+          fs.writeFileSync(env.configFilePath, JSON.stringify(new_config));
-            return initClient(client)
+          return this.app.restart().then(() => {
-              .isSelected('#inputHideMenuBar input').then(function(value) {
+            return initClient(this.app.client)
-                value.should.equal(v);
+              .isSelected('#inputHideMenuBar input').should.eventually.equal(v)
-              })
+              .browserWindow.isMenuBarAutoHide().should.eventually.equal(v);
-              .end();
           });
         });
+      });
 
-        it('should be saved as config.json', function() {
+      it('should be saved as config.json', function() {
-          return initClient(client)
+        env.shouldTestForPlatforms(this, ['win32', 'linux']);
-            .click('#inputHideMenuBar input')
+        return this.app.restart().then(() => {
-            .click('#btnSave')
+            return initClient(this.app.client)
-            .pause(1000)
+              .click('#inputHideMenuBar input')
-            .then(function() {
+              .click('#btnSave')
-              const saved_config = JSON.parse(fs.readFileSync(env.configFilePath, 'utf8'));
+              .pause(1000)
-              saved_config.hideMenuBar.should.be.true();
+          })
-            })
+          .then(() => {
-            .end();
+            const saved_config = JSON.parse(fs.readFileSync(env.configFilePath, 'utf8'));
-        });
+            saved_config.hideMenuBar.should.be.true;
-      }
+          });
+      });
     });
   });
 });

test/specs/settings_test.js

@@ -1,4 +1,3 @@
-const should = require('should');
 const fs = require('fs');
 const settings = require('../../src/common/settings');