setup e2e tests

Author: yyx990803

.gitignore

@@ -1,3 +1,6 @@
 .DS_Store
 node_modules
 TODOs.md
+test/e2e/reports
+test/e2e/screenshots
+selenium-debug.log

examples/server.js

@@ -25,6 +25,7 @@ fs.readdirSync(__dirname).forEach(file => {
 
 app.use(express.static(__dirname))
 
-app.listen(8080, () => {
-  console.log('Server listening on http://localhost:8080, Ctrl+C to stop')
+const port = process.env.PORT || 8080
+module.exports = app.listen(port, () => {
+  console.log(`Server listening on http://localhost:${port}, Ctrl+C to stop`)
 })

package.json

@@ -20,7 +20,8 @@
     "dev-dist": "rollup -wcm",
     "build": "rollup -c && uglifyjs dist/vue-router.js -c -m -o dist/vue-router.min.js",
     "lint": "eslint src examples",
-    "test": "npm run lint && flow check"
+    "test": "npm run lint && flow check",
+    "test:e2e": "node test/e2e/runner.js"
   },
   "devDependencies": {
     "axios": "^0.13.1",
@@ -30,14 +31,18 @@
     "babel-preset-es2015": "^6.9.0",
     "babel-preset-flow-vue": "^1.0.0",
     "buble": "^0.12.3",
+    "cross-spawn": "^4.0.0",
     "css-loader": "^0.23.1",
     "eslint": "^3.0.1",
     "eslint-config-vue": "^1.0.3",
     "eslint-plugin-flow-vars": "^0.4.0",
     "express": "^4.14.0",
     "express-urlrewrite": "^1.2.0",
     "flow-bin": "^0.29.0",
+    "nightwatch": "^0.9.5",
+    "nightwatch-helpers": "^1.0.0",
     "path-to-regexp": "^1.5.3",
+    "phantomjs-prebuilt": "^2.1.7",
     "rollup": "^0.33.0",
     "rollup-plugin-babel": "^2.6.1",
     "rollup-plugin-buble": "^0.12.1",
@@ -46,6 +51,7 @@
     "rollup-plugin-node-resolve": "^1.7.1",
     "rollup-plugin-replace": "^1.1.1",
     "rollup-watch": "^2.4.0",
+    "selenium-server": "^2.53.1",
     "uglify-js": "^2.7.0",
     "vue": "^2.0.0-beta.3",
     "vue-loader": "^9.2.0",

test/e2e/nightwatch.config.js

@@ -0,0 +1,36 @@
+// http://nightwatchjs.org/guide#settings-file
+module.exports = {
+  'src_folders': ['test/e2e/specs'],
+  'output_folder': 'test/e2e/reports',
+  'custom_commands_path': ['node_modules/nightwatch-helpers/commands'],
+  'custom_assertions_path': ['node_modules/nightwatch-helpers/assertions'],
+
+  'selenium': {
+    'start_process': true,
+    'server_path': 'node_modules/selenium-server/lib/runner/selenium-server-standalone-2.53.1.jar',
+    'host': '127.0.0.1',
+    'port': 4444
+  },
+
+  'test_settings': {
+    'default': {
+      'selenium_port': 4444,
+      'selenium_host': 'localhost',
+      'silent': true,
+      'screenshots': {
+        'enabled': true,
+        'on_failure': true,
+        'on_error': false,
+        'path': 'test/e2e/screenshots'
+      }
+    },
+
+    'phantomjs': {
+      'desiredCapabilities': {
+        'browserName': 'phantomjs',
+        'javascriptEnabled': true,
+        'acceptSslCerts': true
+      }
+    }
+  }
+}

test/e2e/runner.js

@@ -0,0 +1,29 @@
+var path = require('path')
+var spawn = require('cross-spawn')
+// var server = require('../../examples/server')
+
+var args = process.argv.slice(2)
+if (args.indexOf('--config') === -1) {
+  args = args.concat(['--config', 'test/e2e/nightwatch.config.js'])
+}
+if (args.indexOf('--env') === -1) {
+  args = args.concat(['--env', 'phantomjs'])
+}
+var i = args.indexOf('--test')
+if (i > -1) {
+  args[i + 1] = 'test/e2e/specs/' + args[i + 1]
+}
+
+var runner = spawn('./node_modules/.bin/nightwatch', args, {
+  stdio: 'inherit'
+})
+
+runner.on('exit', function (code) {
+  // server.close()
+  process.exit(code)
+})
+
+runner.on('error', function (err) {
+  // server.close()
+  throw err
+})

test/e2e/specs/basic.js

@@ -0,0 +1,23 @@
+module.exports = {
+  'basic': function (browser) {
+    browser
+    .url('http://localhost:8080/basic/')
+      .waitForElementVisible('#app', 1000)
+      .assert.count('li a', 3)
+      // assert correct href with base
+      .assert.attributeContains('li:nth-child(1) a', 'href', '/basic/')
+      .assert.attributeContains('li:nth-child(2) a', 'href', '/basic/foo')
+      .assert.attributeContains('li:nth-child(3) a', 'href', '/basic/bar')
+      .assert.containsText('.view', 'home')
+
+      .click('li:nth-child(2) a')
+      .assert.containsText('.view', 'foo')
+
+      .click('li:nth-child(3) a')
+      .assert.containsText('.view', 'bar')
+
+      .click('li:nth-child(1) a')
+      .assert.containsText('.view', 'home')
+      .end()
+  }
+}