Merge pull request #14 from CaptainAchilles/test-update

Test update

Author: r-portas

template/.eslintignore

@@ -0,0 +1,2 @@
+**/*/coverage
+**/*/report

template/build/webpack.base.conf.js

@@ -34,7 +34,7 @@ module.exports = {
     module: {
         rules: [{
                 enforce: "pre",
-                test: /.vue$/,
+                test: /(.vue|.ts)$/,
                 loader: "eslint-loader",
                 exclude: "/node_modules/"
             }, {

template/src/App.vue

@@ -10,8 +10,8 @@
 
 <script lang="ts">
 import Vue, { ComponentOptions } from "vue";
-import SideNav from "./components/SideNav";
-import WinnerIsYou from "./components/WinnerIsYou";
+import SideNav from "./components/SideNav.vue";
+import WinnerIsYou from "./components/WinnerIsYou.vue";
 
 interface IApp extends Vue {
 

template/src/components/WinnerIsYou.vue

@@ -1,5 +1,5 @@
 <template>
-    <h1 class="winner" @click="doStuff" v-if="text">{{ text }}</h1>
+    <h1 class="winner" @click="doStuff" v-if="text">\{{ text }}</h1>
 </template>
 
 <style scoped>

template/src/index.d.ts

@@ -0,0 +1,4 @@
+declare module "*.vue" {
+    import Vue from "vue";
+    export default Vue;
+}

template/src/main.ts

@@ -10,5 +10,5 @@ document.body.appendChild(appContainer);
 /* eslint-disable no-new */
 new Vue({
     el: "#app",
-    render: h => h(App)
+    render: (h) => h(App)
 });

template/test/e2e/nightwatch.conf.js

@@ -1,27 +1,27 @@
-var config = require('../../config')
+const config = require("../../config");
 
 // http://nightwatchjs.org/gettingstarted#settings-file
 module.exports = {
-    src_folders: ['test/e2e/spec'],
-    output_folder: 'test/e2e/report',
+    src_folders: ["test/e2e/spec"],
+    output_folder: "test/e2e/report",
 
     selenium: {
         start_process: true,
-        server_path: require('selenium-server').path,
-        host: '127.0.0.1',
+        server_path: require("selenium-server").path,
+        host: "127.0.0.1",
         port: 4444,
         cli_args: {
-            'webdriver.chrome.driver': require('chromedriver').path
+            "webdriver.chrome.driver": require("chromedriver").path
         }
     },
 
     test_settings: {
         default: {
             selenium_port: 4444,
-            selenium_host: 'localhost',
+            selenium_host: "localhost",
             silent: true,
             globals: {
-                devServerURL: 'http://localhost:' + (process.env.PORT || config.dev.port)
+                devServerURL: "http://localhost:" + (process.env.PORT || config.dev.port)
             }
         },
 
@@ -30,23 +30,23 @@ module.exports = {
                 "browserName": "phantomjs",
                 "javascriptEnabled": true,
                 "acceptSslCerts": true,
-                "phantomjs.binary.path": require('phantomjs-prebuilt').path
+                "phantomjs.binary.path": require("phantomjs-prebuilt").path
             }
         },
         chrome: {
             desiredCapabilities: {
-                browserName: 'chrome',
+                browserName: "chrome",
                 javascriptEnabled: true,
                 acceptSslCerts: true
             }
         },
 
         firefox: {
             desiredCapabilities: {
-                browserName: 'firefox',
+                browserName: "firefox",
                 javascriptEnabled: true,
                 acceptSslCerts: true
             }
         }
     }
-}
+};

template/test/e2e/runner.js

@@ -1,6 +1,6 @@
 // 1. start the dev server using production config
-process.env.NODE_ENV = 'testing'
-var server = require('../../build/dev-server.js')
+process.env.NODE_ENV = "testing";
+const server = require("../../build/dev-server.js");
 
 server.ready.then(() => {
     // 2. run the nightwatch test suite against it
@@ -10,26 +10,26 @@ server.ready.then(() => {
     // or override the environment flag, for example: `npm run e2e -- --env chrome,firefox`
     // For more information on Nightwatch's config file, see
     // http://nightwatchjs.org/guide#settings-file
-    var opts = process.argv.slice(2)
-    if (opts.indexOf('--config') === -1) {
-        opts = opts.concat(['--config', 'test/e2e/nightwatch.conf.js'])
+    let opts = process.argv.slice(2);
+    if (opts.indexOf("--config") === -1) {
+        opts = opts.concat(["--config", "test/e2e/nightwatch.conf.js"]);
     }
-    if (opts.indexOf('--env') === -1) {
-        opts = opts.concat(['--env', 'chrome,phantomjs'])
+    if (opts.indexOf("--env") === -1) {
+        opts = opts.concat(["--env", "chrome,phantomjs"]);
     }
 
-    var spawn = require('cross-spawn')
-    var runner = spawn('./node_modules/.bin/nightwatch', opts, {
-        stdio: 'inherit'
-    })
+    let spawn = require("cross-spawn");
+    let runner = spawn("./node_modules/.bin/nightwatch", opts, {
+        stdio: "inherit"
+    });
 
-    runner.on('exit', function (code) {
-        server.close()
-        process.exit(code)
-    })
+    runner.on("exit", function(code) {
+        server.close();
+        process.exit(code);
+    });
 
-    runner.on('error', function (err) {
-        server.close()
-        throw err
-    })
-})
+    runner.on("error", function(err) {
+        server.close();
+        throw err;
+    });
+});

template/test/e2e/spec/home.spec.js

@@ -1,28 +1,28 @@
 const assert = require("assert");
 
 module.exports = {
-    'default e2e tests': function (browser) {
+    "default e2e tests": function(browser) {
         // automatically uses dev Server port from /config.index.js
         // default: http://localhost:8080
         // see nightwatch.conf.js
         const devServer = browser.globals.devServerURL;
 
         browser
             .url(devServer)
-            .waitForElementVisible('#main', 1000)
-            .assert.elementPresent('.winner')
-            .assert.containsText('.winner', 'THIS PAGE IS INTENTIONALLY STYLED POORLY');
+            .waitForElementVisible("#main", 1000)
+            .assert.elementPresent(".winner")
+            .assert.containsText(".winner", "THIS PAGE IS INTENTIONALLY STYLED POORLY");
 
-        browser.click("ul li:first-of-type", function () {
-            browser.elements("css selector", "ul li", function (elements) {
+        browser.click("ul li:first-of-type", function() {
+            browser.elements("css selector", "ul li", function(elements) {
                 assert.equal(4, elements.value.length);
-                browser.click("ul li:first-of-type", function () {
-                    browser.elements("css selector", "ul li", function (elements) {
+                browser.click("ul li:first-of-type", function() {
+                    browser.elements("css selector", "ul li", function(elements) {
                         assert.equal(1, elements.value.length);
                         browser.end();
                     });
                 });
-            })
+            });
         });
     }
-}
+};

template/test/unit/spec/SideNav.spec.ts

@@ -16,22 +16,25 @@ describe("SideNav.vue", () => {
             main.id = "app";
             document.body.appendChild(main);
         }
+        const mountPoint = document.createElement("div");
+        mountPoint.id = "mountMe";
+        document.getElementById("app").appendChild(mountPoint);
     });
 
     it("Hides Links Intially", () => {
-        let vm = new SideNav().$mount("#app");
-        
+        let vm = new SideNav().$mount("#mountMe");
+
         // The only child is the "Toggle Links" item
         assert.equal(vm.$el.children.length, 1);
-    })
+    });
 
     it("Shows links when clicked", (done) => {
-        let vm = new SideNav().$mount("#app");
-        
+        let vm = new SideNav().$mount("#mountMe");
+
         // The only child is the "Toggle Links" item
         assert.equal(vm.$el.children.length, 1);
         (vm.$el.children[0] as HTMLElement).click();
-        
+
         Vue.nextTick(() => {
             // There are 3 links + 1 toggle link item.
             assert.equal(vm.$el.children.length, 4);
@@ -40,8 +43,8 @@ describe("SideNav.vue", () => {
     });
 
 
-    it("Toggles links properly", done => {
-        let vm = new SideNav().$mount("#app");
+    it("Toggles links properly", (done) => {
+        let vm = new SideNav().$mount("#mountMe");
 
         // The only child is the "Toggle Links" item
         assert.equal(vm.$el.children.length, 1);
@@ -51,7 +54,7 @@ describe("SideNav.vue", () => {
             assert.equal(vm.$el.children.length, 4);
             (vm.$el.children[0] as HTMLElement).click();
 
-            Vue.nextTick(function() {
+            Vue.nextTick(() => {
                 // Clicking it again should hide all links
                 assert.equal(vm.$el.children.length, 1);
                 done();