refactor(e2e-test): wrap the test registration

packages/core/scripts/e2e-test-runner.js

@@ -1,9 +1,9 @@
+'use strict';
+
 const glob = require('glob');
 const Mocha = require('mocha');
 const path = require('path');
 
-const mocha = new Mocha();
-
 function startDevServer() {
   const server = require('@stencil/dev-server/dist'); // TODO: fix after stencil-dev-server PR #16 is merged
   const cmdArgs = ['--config', path.join(__dirname, '../stencil.config.js'), '--no-open'];
@@ -25,11 +25,16 @@ function getTestFiles() {
 }
 
 (async () => {
+  const mocha = new Mocha({
+    timeout: 5000,
+    slow: 2000
+  });
+
   const devServer = await startDevServer();
+  // process.env.takeScreenshots = true;
 
   const files = await getTestFiles();
   files.forEach(f => mocha.addFile(f));
-
   mocha.run(function(failures) {
     process.on('exit', function() {
       process.exit(failures); // exit with non-zero status if there were failures

packages/core/scripts/register-e2e-test.js

@@ -0,0 +1,35 @@
+'use strict';
+
+const fs = require('fs');
+const webdriver = require('selenium-webdriver');
+
+function takeScreenshot(driver, name) {
+  return driver.takeScreenshot().then(function(data) {
+    var base64Data = data.replace(/^data:image\/png;base64,/, '');
+    fs.writeFile(`${name}.png`, base64Data, 'base64', function(err) {
+      if (err) console.log(err);
+    });
+  });
+}
+
+function allowForAnnimation() {
+  return new Promise((resolve, reject) => {
+    setTimeout(function() {
+      resolve();
+    }, 300);
+  });
+}
+
+function registerE2ETest(desc, tst) {
+  it(desc, async () => {
+    const driver = new webdriver.Builder().forBrowser('chrome').build();
+    await tst(driver);
+    if (process.env.takeScreenshots) {
+      await allowForAnnimation();
+      takeScreenshot(driver, desc);
+    }
+    return driver.quit();
+  });
+}
+
+module.exports = registerE2ETest;

packages/core/src/components/action-sheet/test/basic.e2e-spec.js

@@ -4,76 +4,64 @@ const webdriver = require('selenium-webdriver');
 const By = webdriver.By;
 const until = webdriver.until;
 
+const register = require('../../../../scripts/register-e2e-test');
+
 const url = 'http://localhost:3333/src/components/action-sheet/test/basic.html';
 
 describe('action-sheet: basic', () => {
-  it('navigates', () => {
+  register('navigates', (driver) => {
-    const driver = new webdriver.Builder().forBrowser('chrome').build();
     driver.navigate().to(url);
     driver.wait(until.elementLocated(By.id('cancelOnly')));
-    driver.wait(until.elementIsVisible(driver.findElement(By.id('cancelOnly'))));
+    return driver.wait(until.elementIsVisible(driver.findElement(By.id('cancelOnly'))));
-    return driver.quit();
   });
 
   describe('present', () => {
-    it('shows basic', () => {
+    register('shows basic', (driver) => {
-      const driver = new webdriver.Builder().forBrowser('chrome').build();
       driver.navigate().to(url);
       driver.wait(until.elementIsEnabled(driver.findElement(By.id('basic'))));
       driver.findElement(By.id('basic')).click();
       driver.wait(until.elementLocated(By.css('.action-sheet-container')));
-      driver.wait(until.elementIsVisible(driver.findElement(By.css('.action-sheet-container'))));
+      return driver.wait(until.elementIsVisible(driver.findElement(By.css('.action-sheet-container'))));
-      return driver.quit();
     });
 
-    it('shows noBackdropDismiss', () => {
+    register('shows noBackdropDismiss', (driver) => {
-      const driver = new webdriver.Builder().forBrowser('chrome').build();
       driver.navigate().to(url);
       driver.wait(until.elementIsEnabled(driver.findElement(By.id('noBackdropDismiss'))));
       driver.findElement(By.id('noBackdropDismiss')).click();
       driver.wait(until.elementLocated(By.css('.action-sheet-container')));
-      driver.wait(until.elementIsVisible(driver.findElement(By.css('.action-sheet-container'))));
+      return driver.wait(until.elementIsVisible(driver.findElement(By.css('.action-sheet-container'))));
-      return driver.quit();
     });
 
-    it('shows alertFromActionSheet', () => {
+    register('shows alertFromActionSheet', (driver) => {
-      const driver = new webdriver.Builder().forBrowser('chrome').build();
       driver.navigate().to(url);
       driver.wait(until.elementIsEnabled(driver.findElement(By.id('alertFromActionSheet'))));
       driver.findElement(By.id('alertFromActionSheet')).click();
       driver.wait(until.elementLocated(By.css('.action-sheet-container')));
-      driver.wait(until.elementIsVisible(driver.findElement(By.css('.action-sheet-container'))));
+      return driver.wait(until.elementIsVisible(driver.findElement(By.css('.action-sheet-container'))));
-      return driver.quit();
     });
 
-    it('shows scrollableOptions', () => {
+    register('shows scrollableOptions', (driver) => {
-      const driver = new webdriver.Builder().forBrowser('chrome').build();
       driver.navigate().to(url);
       driver.wait(until.elementIsEnabled(driver.findElement(By.id('scrollableOptions'))));
       driver.findElement(By.id('scrollableOptions')).click();
       driver.wait(until.elementLocated(By.css('.action-sheet-container')));
-      driver.wait(until.elementIsVisible(driver.findElement(By.css('.action-sheet-container'))));
+      return driver.wait(until.elementIsVisible(driver.findElement(By.css('.action-sheet-container'))));
-      return driver.quit();
     });
 
-    it('shows scrollWithoutCancel', () => {
+    register('shows scrollWithoutCancel', (driver) => {
-      const driver = new webdriver.Builder().forBrowser('chrome').build();
       driver.navigate().to(url);
       driver.wait(until.elementIsEnabled(driver.findElement(By.id('scrollWithoutCancel'))));
       driver.findElement(By.id('scrollWithoutCancel')).click();
       driver.wait(until.elementLocated(By.css('.action-sheet-container')));
-      driver.wait(until.elementIsVisible(driver.findElement(By.css('.action-sheet-container'))));
+      return driver.wait(until.elementIsVisible(driver.findElement(By.css('.action-sheet-container'))));
-      return driver.quit();
     });
 
-    it('shows cancelOnly', () => {
+    register('shows cancelOnly', (driver) => {
-      const driver = new webdriver.Builder().forBrowser('chrome').build();
       driver.navigate().to(url);
       driver.wait(until.elementIsEnabled(driver.findElement(By.id('cancelOnly'))));
       driver.findElement(By.id('cancelOnly')).click();
       driver.wait(until.elementLocated(By.css('.action-sheet-container')));
-      driver.wait(until.elementIsVisible(driver.findElement(By.css('.action-sheet-container'))));
+      return driver.wait(until.elementIsVisible(driver.findElement(By.css('.action-sheet-container'))));
-      return driver.quit();
     });
   });
 });

packages/core/src/components/button/test/basic.e2e-spec.js

@@ -1,12 +1,11 @@
 const webdriver = require('selenium-webdriver');
-const driver = new webdriver.Builder().forBrowser('chrome').build();
+const By = webdriver.By;
+const until = webdriver.until;
+
+const register = require('../../../../scripts/register-e2e-test');
 
 describe('button: basic', () => {
-  after(() => {
+  register('navigates', (driver) => {
-    return driver.quit();
-  });
-
-  it('navigates', () => {
     return driver.navigate().to('http://localhost:3333/src/components/button/test/basic.html');
   });
 });

packages/core/src/components/button/test/toolbar.e2e-spec.js

@@ -1,12 +1,11 @@
 const webdriver = require('selenium-webdriver');
-const driver = new webdriver.Builder().forBrowser('chrome').build();
+const By = webdriver.By;
+const until = webdriver.until;
+
+const register = require('../../../../scripts/register-e2e-test');
 
 describe('button: toolbar', () => {
-  after(() => {
+  register('navigates', (driver) => {
-    return driver.quit();
-  });
-
-  it('navigates', () => {
     return driver.navigate().to('http://localhost:3333/src/components/button/test/toolbar.html');
   });
 });