implement e2e tests of login and register

Author: jamesjieye

front-end/.gitignore

@@ -3,6 +3,7 @@ node_modules
 /dist
 
 /tests/e2e/reports/
+/tests/e2e/data/user.js
 selenium-debug.log
 
 # local env files

front-end/nightwatch.config.js

@@ -0,0 +1,16 @@
+module.exports = {
+  test_settings: {
+    default: {
+      launch_url: (process.env.LAUNCH_URL || process.env.VUE_DEV_SERVER_URL)
+    },
+    chrome: {
+      desiredCapabilities: {
+        browserName: "chrome",
+        chromeOptions: {
+          args:  ["headless", "no-sandbox", "disable-gpu"]
+        }
+      }
+    }
+  },
+  page_objects_path: 'tests/e2e/page-objects',
+}

front-end/package-lock.json

@@ -8,6 +8,7 @@
     "lint": "vue-cli-service lint",
     "test:unit": "vue-cli-service test:unit",
     "test:e2e": "vue-cli-service test:e2e",
+    "test:integration": "vue-cli-service test:e2e --url http://localhost:8080/",
     "test": "npm run test:unit && npm run test:e2e"
   },
   "dependencies": {
@@ -30,8 +31,11 @@
     "@vue/test-utils": "^1.0.0-beta.24",
     "babel-core": "7.0.0-bridge.0",
     "babel-jest": "^23.0.1",
+    "chance": "^1.0.16",
+    "del": "^3.0.0",
     "moxios": "^0.4.0",
     "node-sass": "^4.9.0",
+    "rw": "^1.3.3",
     "sass-loader": "^7.0.1",
     "vue-template-compiler": "^2.5.17"
   }

front-end/package.json

@@ -1,5 +1,6 @@
 import Vue from 'vue'
 import Router from 'vue-router'
+import HomePage from '@/views/HomePage'
 import LoginPage from '@/views/LoginPage'
 import RegisterPage from '@/views/RegisterPage'
 
@@ -9,6 +10,10 @@ export default new Router({
   mode: 'history',
   base: process.env.BASE_URL,
   routes: [{
+    path: '/',
+    name: 'HomePage',
+    component: HomePage
+  }, {
     path: '/login',
     name: 'LoginPage',
     component: LoginPage

front-end/src/router.js

@@ -1,5 +1,5 @@
 <template>
-  <div>Home Page</div>
+  <div><h1 class="page-title">Home Page</h1></div>
 </template>
 
 <script>

front-end/src/views/HomePage.vue

@@ -0,0 +1,10 @@
+module.exports = {
+  url: function () {
+    return this.api.launchUrl
+  },
+  elements: {
+    pageTitle: {
+      selector: 'h1.page-title'
+    }
+  }
+}

front-end/tests/e2e/data/.gitkeep

@@ -0,0 +1,21 @@
+module.exports = {
+  url: function () {
+    return this.api.launchUrl + 'login'
+  },
+  elements: {
+    app: '#app',
+    logoImage: 'img.logo',
+    usernameInput: '#username',
+    passwordInput: '#password',
+    submitButton: 'button[type=submit]',
+    formError: '.failed'
+  },
+  commands: [{
+    login: function (username, password) {
+      this
+        .setValue('@usernameInput', username)
+        .setValue('@passwordInput', password)
+        .click('@submitButton')
+    }
+  }]
+}

front-end/tests/e2e/page-objects/HomePage.js

@@ -0,0 +1,37 @@
+module.exports = {
+  url: function () {
+    return this.api.launchUrl + 'register'
+  },
+  elements: {
+    app: {
+      selector: '#app'
+    },
+    logoImage: {
+      selector: 'img.logo'
+    },
+    usernameInput: {
+      selector: '#username'
+    },
+    emailAddressInput: {
+      selector: '#emailAddress'
+    },
+    passwordInput: {
+      selector: '#password'
+    },
+    submitButton: {
+      selector: 'button[type=submit]'
+    },
+    formError: {
+      selector: '.failed'
+    }
+  },
+  commands: [{
+    register: function (username, emailAddress, password) {
+      this
+        .setValue('@usernameInput', username)
+        .setValue('@emailAddressInput', emailAddress)
+        .setValue('@passwordInput', password)
+        .click('@submitButton')
+    }
+  }]
+}