create some basic test cases

.gitignore

@@ -20,3 +20,5 @@ dev/*css
 /release
 .env
 yarn-error.log
+/test/cypress/screenshots
+/test/cypress/videos

cypress.json

-{}
+{
+  "baseUrl": "http://localhost:8090/e2e",
+  "testFiles": "**/*.spec.js",
+  "fixturesFolder": "test/cypress/fixtures",
+  "integrationFolder": "test/cypress/integration",
+  "pluginsFile": "test/cypress/plugins/index.js",
+  "screenshotsFolder": "test/cypress/screenshots",
+  "supportFile": "test/cypress/support/index.js",
+  "videosFolder": "test/cypress/videos"
+}

dev/App.vue

-<template>
-  <playground></playground>
-</template>
-
-<script>
-  import Playground from './Playground'
-
-  export default {
-    components: {
-      Playground
-    }
-  }
-</script>

dev/e2e/Main.vue

+<template>
+  <v-app>
+    <router-view/>
+  </v-app>
+</template>

dev/e2e/cases/VTextField.vue

+<template>
+  <v-container>
+    <v-layout wrap>
+      <v-flex xs12 v-for="field in fields" :key="field">
+        <v-text-field :label="field"/>
+      </v-flex>
+    </v-layout>
+  </v-container>
+</template>
+
+<script>
+  export default {
+    data: () => ({
+      fields: ['One', 'two', 'three', 'four', 'five', 'six']
+    })
+  }
+</script>

dev/index.js

@@ -13,6 +13,6 @@ Vue.use(VueRouter)
 Vue.component(Boilerplate.name, Boilerplate)
 
 new Vue({
-  render: h => h(App),
+  render: h => h('router-view'),
   router
 }).$mount('#app')

dev/router.js

 import VueRouter from 'vue-router'
 
-const component1 = {
-  template: `<div class="title">Page 1</div>`
-}
-const component2 = {
-  template: `<div class="title">Page 2</div>`
+const testCases = require.context('./e2e/cases', false, /\.vue$/)
+  .keys()
+  .map(k => k.substring(2))
+  .map(k => [k.slice(0, -4), import(`./e2e/cases/${k}`)])
+
+function component (text) {
+  return {
+    render: h => h('div', { staticClass: 'title' }, [text])
+  }
 }
 
 const router = new VueRouter({
+  mode: 'history',
   routes: [
     {
-      path: '/page1',
-      name: 'Page 1',
-      component: component1
-    },
+      path: '/',
+      component: () => import('./Playground.vue'),
+      children: [
+        {
+          path: 'page1',
+          name: 'Page 1',
+          component: component('Page 1')
+        },
+        {
+          path: 'page2',
+          name: 'Page 2',
+          component: component('Page 2')
+        },
+      ]
+    }
     {
-      path: '/page2',
-      name: 'Page 2',
-      component: component2
+      path: '/e2e',
+      component: () => import('./e2e/Main.vue')
+      children: testCases.map(c => ({
+        path: c[0],
+        component: () => c[1]
+      }))
     },
     { path: '*', redirect: '/page1' }
   ]

package.json

@@ -14,7 +14,7 @@
   "types": "types/index.d.ts",
   "scripts": {
     "watch": "cross-env TARGET=development webpack --config build/config.js --progress --hide-modules --watch",
-    "dev": "cross-env NODE_ENV=development webpack-dev-server --config build/webpack.dev.config.js --open --hot",
+    "dev": "cross-env NODE_ENV=development webpack-dev-server --config build/webpack.dev.config.js --hot --history-api-fallback",
     "build": "yarn build:dist && yarn build:es5",
     "build:dev": "cross-env NODE_ENV=production node build/webpack.dev.config.js",
     "build:dist": "rimraf dist && cross-env NODE_ENV=production webpack --config build/config.js --progress --hide-modules",

test/cypress/integration/VTextField.spec.js

+describe('VTextField', () => {
+  beforeEach(() => {
+    cy.visit('/VtextField')
+    cy.wait(100)
+  })
+
+  it('should work', () => {
+    cy.get('.v-text-field').each(f => (
+      cy.wrap(f).click().get(':focus').type('Hello world')
+    ))
+
+    cy.contains('two').click()
+    cy.get(':focus').type('{selectall}second input')
+  })
+})