browser-test: implement test helper module

diff --git a/browser-test/src/puptest.js b/browser-test/src/puptest.js
new file mode 100644 (file)
index 0000000..139c934
--- /dev/null
+++ b/browser-test/src/puptest.js
@@ -0,0 +1,59 @@
+/* puptest - puppeteer with assert */
+// const puppeteer = require('puppeteer');
+const assert = require("assert");
+const chai = require('chai');
+
+class assertPageAction {
+  constructor(page) {
+    this.page = page;
+  };
+
+  _wrapDoesNotReject(method, message, args) {
+    return assert.doesNotReject(method.apply(this.page, args), message);
+  }
+
+  click(selector) {
+    return this._wrapDoesNotReject(this.page.click, `click "${selector}"`, arguments);
+  }
+
+  waitForSelector(selector) {
+    return this._wrapDoesNotReject(this.page.waitForSelector, `wait for "${selector}"`, arguments);
+  }
+
+  type(selector, text) {
+    return this._wrapDoesNotReject(this.page.type, `type "${text}" to "${selector}"`, arguments);
+  }
+
+  clickAndWaitForNavigation(selector, options) {
+    return Promise.all([
+      this.click(selector, options),
+      this.waitForNavigation(options)
+    ]);
+  }
+
+  waitForNavigation() {
+    return this._wrapDoesNotReject(this.page.waitForNavigation, "wait for navigation", arguments);
+  }
+
+  $eval(selector) {
+    return this.page.$eval.apply(this.page, arguments);
+  }
+
+  $evalOk(selector) {
+    return this.page.$eval.apply(this.page, arguments).then(
+      resp => { chai.assert.isOk(resp, `eval result for "${selector}"`); });
+  }
+
+  $evalNotOk(selector) {
+    return this.page.$eval.apply(this.page, arguments).then(
+      resp => { chai.assert.isNotOk(resp, `eval result for "${selector}"`); });
+  }
+
+  $evalMatch(rex, ...args) {
+    const selector = args[0];
+    return this.page.$eval.apply(this.page, args).then(
+      resp => { chai.assert.match(resp, rex, `eval result for "${selector}" matches ${rex}`); });
+  }
+}
+
+exports.assertPageAction = assertPageAction;

diff --git a/browser-test/src/test/basic.js b/browser-test/src/test/basic.js
index b947f8d..e5ef756 100644 (file)
--- a/browser-test/src/test/basic.js
+++ b/browser-test/src/test/basic.js
@@ -1,6 +1,7 @@
 const puppeteer = require('puppeteer');
-const chai = require('chai');
-const assert = chai.assert;
+const expect = require('chai').expect;
+const assert = require('assert');
+const puptest = require("../puptest");
 
 const baseUrl = process.env.TEST_HOST; // "https://newslash-dev:3000";
 const chromiumArgs = ["--no-sandbox"];
@@ -9,55 +10,79 @@ const password = process.env.TEST_PASSWORD;
 const chromiumPath = process.env.CHROMIUM_PATH || null;
 
 describe('Top Page', function () {
+  let browser;
+  let page;
+  
+  before(async () => {
+    expect(username).to.not.have.lengthOf(0);
+    expect(password).to.not.have.lengthOf(0);
+
+    browser = await puppeteer.launch({
+      executablePath: chromiumPath,
+      args: chromiumArgs,
+      ignoreHTTPSErrors: true,
+    });
+    page = await browser.newPage();
+    page.setViewport({width: 1024, height: 800});
+  });
+
+  after(async () => {
+    // done
+    await browser.close();
+  });
+
   describe('login', function () {
-    assert.isAtLeast(username.length, 1, "usename length");
-    assert.isAtLeast(password.length, 1, "password length");
     this.timeout(5000);
 
-    it('succeeds', async () => {
-      const browser = await puppeteer.launch({
-        executablePath: chromiumPath,
-        args: chromiumArgs,
-        ignoreHTTPSErrors: true,
-      });
-      const page = await browser.newPage();
-      page.setViewport({width: 1024, height: 800});
-
+    it('succeeds', async function () {
+      const p = new puptest.assertPageAction(page);
       await page.goto(baseUrl);
 
       // check popup shown
-      await page.click('#account-menu a.toggle-login-modal');
-      await page.waitForSelector('#login-modal', {timeout: 100});
-      assert.isTrue(await page.$eval('#login-modal', el => el.classList.contains("open")),
-             "show login modal");
+      await p.click('#account-menu a.toggle-login-modal');
+      await p.waitForSelector('#login-modal', {timeout: 100});
+      await p.$evalOk('#login-modal', el => el.classList.contains("open"));
 
       // check popup close
-      await page.click('#login-modal form .btn-default');
-      await page.waitForSelector('#login-modal', {hidden: true, timeout: 100});
-      assert.isNotTrue(page.$eval('#login-modal', el => el.classList.contains("open")),
-             "close login modal");
+      await p.click('#login-modal form .btn-default');
+      await p.waitForSelector('#login-modal', {hidden: true, timeout: 100});
+      await p.$evalNotOk('#login-modal', el => el.classList.contains("open"));
 
       // popup open
-      await page.click('#account-menu .toggle-login-modal');
-      await page.waitForSelector('#login-modal', {timeout: 100});
+      await p.click('#account-menu .toggle-login-modal');
+      await p.waitForSelector('#login-modal', {timeout: 100});
 
       // input ID/pass
-      await page.type('#login-nickname', username);
-      await page.type('#login-passwd', password);
-      await page.click('#login-modal .dialog-footer .btn-primary');
+      await p.type('#login-nickname', username);
+      await p.type('#login-passwd', password);
 
-      // wait for load
-      await page.waitForNavigation();
+      // clock login
+      await p.clickAndWaitForNavigation('#login-modal .dialog-footer .btn-primary',
+                                        {timeout: 1000});
 
       // check login succeeded
       const regex = new RegExp(`^\\s*${username}\\s*$`);
-      const uname = await page.$eval('#user-menu a', el => el.innerHTML.trim());
-      assert.match(uname, regex, "login succeed");
+      await p.$evalMatch(regex, '#user-menu a', el => el.innerHTML.trim());
 
-      // done
-      await browser.close();
     });
   });
-});
 
+  describe('logout', function () {
+    this.timeout(5000);
+    it('succeeds', async function () {
+      const p = new puptest.assertPageAction(page);
+      await page.goto(baseUrl);
+
+      // click user menu
+      await p.click('#user-menu a.dropdown-toggle');
+      await p.waitForSelector('#user-menu ul.dropdown-menu', {timeout: 100});
+
+      // clock logout
+      await p.clickAndWaitForNavigation('#user-menu ul.dropdown-menu a[href^="/logout"]',
+                                        {timeout: 1000});
 
+      // check login succeeded
+      await p.waitForSelector('#account-menu .toggle-login-modal', {timeout: 100});
+    });
+  });
+});