Update tests with ava

examples/with-ava/package.json

@@ -1,11 +1,16 @@
 {
   "name": "nuxt-with-ava",
   "scripts": {
-    "start": "../../bin/nuxt .",
+    "dev": "nuxt",
+    "build": "nuxt build",
+    "start": "nuxt start",
     "test": "ava"
   },
   "devDependencies": {
     "ava": "^0.16.0",
     "jsdom": "^9.8.3"
+  },
+  "dependencies": {
+    "nuxt": "^0.9.5"
   }
 }

examples/with-ava/pages/index.vue

@@ -1,7 +1,5 @@
 <template>
-  <div>
+  <h1 class="red">Hello {{ name }}!</h1>
-    <p class="red-color">Hello {{ name }}!</p>
-  </div>
 </template>
 
 <script>
@@ -13,7 +11,7 @@ export default {
 </script>
 
 <style>
-.red-color {
+.red {
   color: red;
 }
 </style>

examples/with-ava/test/index.test.js

@@ -1,48 +1,39 @@
-/*
-** Test with Ava can be written in ES6 \o/
-*/
 import test from 'ava'
-import { createServer } from 'http'
+import Nuxt from 'nuxt'
 import { resolve } from 'path'
 
+// We keep the nuxt and server instance
+// So we can close them at the end of the test
 let nuxt = null
 let server = null
 
-// Init nuxt.js and create server listening on localhost:4000
+// Init Nuxt.js and create a server listening on localhost:4000
-test.before('Init Nuxt.js', (t) => {
+test.before('Init Nuxt.js', async t => {
-  const Nuxt = require('../../../')
+  const rootDir = resolve(__dirname, '..')
-  const options = {
+  let config = {}
-    rootDir: resolve(__dirname, '..'),
+  try { config = require(resolve(rootDir, 'nuxt.config.js')) } catch (e) {}
-    dev: false
+  config.rootDir = rootDir // project folder
-  }
+  config.dev = false // production build
-  nuxt = new Nuxt(options)
+  nuxt = new Nuxt(config)
-  return nuxt.build()
+  await nuxt.build()
-  .then(function () {
+  server = new nuxt.Server(nuxt)
-    server = createServer((req, res) => nuxt.render(req, res))
   server.listen(4000, 'localhost')
-  })
 })
 
-/*
+// Example of testing only generated html
-** Example of testing only the html
-*/
 test('Route / exits and render HTML', async t => {
   let context = {}
   const { html } = await nuxt.renderRoute('/', context)
-  t.true(html.includes('<p class="red-color">Hello world!</p>'))
+  t.true(html.includes('<h1 class="red">Hello world!</h1>'))
-  t.is(context.nuxt.error, null)
-  t.is(context.nuxt.data[0].name, 'world')
 })
 
-/*
+// Example of testing via dom checking
-** Example of testing via dom checking
+test('Route / exits and render HTML with CSS applied', async t => {
-*/
-test('Route / exits and render HTML', async t => {
   const window = await nuxt.renderAndGetWindow('http://localhost:4000/')
-  const element = window.document.querySelector('.red-color')
+  const element = window.document.querySelector('.red')
   t.not(element, null)
   t.is(element.textContent, 'Hello world!')
-  t.is(element.className, 'red-color')
+  t.is(element.className, 'red')
   t.is(window.getComputedStyle(element).color, 'red')
 })