start switching to nightwatch

.gitignore

@@ -6,3 +6,5 @@ TODOs.md
 dist/*.gz
 dist/*.map
 dist/vue.common.min.js
+selenium-debug.log
+test/e2e/reports

build/nightwatch.config.js

@@ -0,0 +1,40 @@
+// http://nightwatchjs.org/guide#settings-file
+module.exports = {
+  "src_folders": ["test/e2e/specs"],
+  "output_folder": "test/e2e/reports",
+  "custom_assertions_path": ["test/e2e/custom-assertions"],
+
+  "selenium": {
+    "start_process": true,
+    "server_path": "node_modules/selenium-server/lib/runner/selenium-server-standalone-2.53.0.jar",
+    "host": "127.0.0.1",
+    "port": 4444,
+    "cli_args": {
+      "webdriver.chrome.driver": require('chromedriver').path
+    }
+  },
+
+  "test_settings": {
+    "default": {
+      "selenium_port": 4444,
+      "selenium_host": "localhost",
+      "silent": true
+    },
+
+    "chrome": {
+      "desiredCapabilities": {
+        "browserName": "chrome",
+        "javascriptEnabled": true,
+        "acceptSslCerts": true
+      }
+    },
+
+    "firefox": {
+      "desiredCapabilities": {
+        "browserName": "firefox",
+        "javascriptEnabled": true,
+        "acceptSslCerts": true
+      }
+    }
+  }
+}

package.json

@@ -14,7 +14,7 @@
     "test": "npm run e2e",
     "build": "NODE_ENV=production node build/build.js",
     "lint": "eslint src",
-    "e2e": "casperjs test --concise ./test/e2e"
+    "e2e": "node test/e2e/runner.js"
   },
   "repository": {
     "type": "git",
@@ -35,15 +35,20 @@
     "babel-preset-es2015": "^6.0.0",
     "babel-preset-es2015-rollup-vue": "^1.0.0",
     "casperjs": "^1.1.0",
+    "chromedriver": "^2.21.2",
+    "cross-spawn": "^2.1.5",
     "eslint": "^2.7.0",
     "eslint-config-standard": "^5.1.0",
     "eslint-loader": "^1.3.0",
     "eslint-plugin-promise": "^1.1.0",
     "eslint-plugin-standard": "^1.3.2",
+    "http-server": "^0.9.0",
+    "nightwatch": "^0.8.18",
     "rollup": "^0.25.8",
     "rollup-plugin-alias": "^1.0.2",
     "rollup-plugin-babel": "^2.4.0",
     "rollup-plugin-replace": "^1.1.0",
+    "selenium-server": "2.53.0",
     "uglify-js": "^2.6.2",
     "webpack": "^1.12.14"
   }

test/e2e/runner.js

@@ -0,0 +1,29 @@
+var path = require('path')
+var httpServer = require('http-server')
+var server = httpServer.createServer({
+  root: path.resolve(__dirname, '../../')
+})
+
+server.listen(8080)
+
+var spawn = require('cross-spawn')
+var runner = spawn(
+  './node_modules/.bin/nightwatch',
+  [
+    '--config', 'build/nightwatch.config.js',
+    '--env', 'chrome,firefox'
+  ],
+  {
+    stdio: 'inherit'
+  }
+)
+
+runner.on('exit', function (code) {
+  server.close()
+  process.exit(code)
+})
+
+runner.on('error', function (err) {
+  server.close()
+  throw err
+})

test/e2e/specs/markdown.js

@@ -0,0 +1,9 @@
+module.exports = {
+  'markdown': function (browser) {
+    browser
+    .url('http://localhost:8080/examples/markdown/')
+      .waitForElementVisible('#editor', 1000)
+      .assert.elementPresent('#editor')
+      .end()
+  }
+}

test/e2e/todomvc.js

@@ -3,6 +3,10 @@ casper.on("page.error", function(msg, trace) {
   console.log(JSON.stringify(trace, null, 2))
 })
 
+casper.on("remote.message", function(msg) {
+  console.log(msg)
+})
+
 casper.test.begin('todomvc', 63, function (test) {
   casper
   .start('examples/todomvc/index.html')
@@ -16,12 +20,7 @@ casper.test.begin('todomvc', 63, function (test) {
   // let's add a new item -----------------------------------------------
 
   .then(function () {
-    casper.sendKeys('.new-todo', 'test')
-  })
-  .then(function () {
-    // wait before hitting enter
-    // so v-model unlocks
-    createNewItem()
+    enter('.new-todo', 'test')
   })
   .then(function () {
     test.assertElementCount('.todo', 1, 'new item should be created')
@@ -251,9 +250,9 @@ casper.test.begin('todomvc', 63, function (test) {
 
   function createNewItem (text) {
     if (text) {
-      casper.sendKeys('.new-todo', text)
+      casper.sendKeys('.new-todo', text, { keepFocus: true })
     }
-    casper.evaluate(function () {
+    casper.thenEvaluate(function () {
       // casper.mouseEvent can't set keyCode
       var field = document.querySelector('.new-todo')
       var e = document.createEvent('HTMLEvents')
@@ -263,6 +262,11 @@ casper.test.begin('todomvc', 63, function (test) {
     })
   }
 
+  function enter (sel, text) {
+    casper.sendKeys(sel, text, { keepFocus: true })
+    casper.sendKeys(sel, casper.page.event.key.Enter)
+  }
+
   function doubleClick (selector) {
     casper.evaluate(function (selector) {
       var el = document.querySelector(selector)
@@ -273,7 +277,7 @@ casper.test.begin('todomvc', 63, function (test) {
   }
 
   function keyUp (code) {
-    casper.evaluate(function (code) {
+    casper.thenEvaluate(function (code) {
       var input = document.querySelector('.todo:nth-child(1) .edit')
       var e = document.createEvent('HTMLEvents')
       e.initEvent('keyup', true, true)