diff --git a/template/.eslintignore b/template/.eslintignore new file mode 100644 index 0000000..bd37818 --- /dev/null +++ b/template/.eslintignore @@ -0,0 +1,2 @@ +**/*/coverage +**/*/report diff --git a/template/build/webpack.base.conf.js b/template/build/webpack.base.conf.js index fda18ae..f1917c5 100644 --- a/template/build/webpack.base.conf.js +++ b/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/" }, { diff --git a/template/src/main.ts b/template/src/main.ts index e7bd306..6ad5084 100644 --- a/template/src/main.ts +++ b/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) }); diff --git a/template/test/e2e/nightwatch.conf.js b/template/test/e2e/nightwatch.conf.js index 0007e58..7b772b4 100644 --- a/template/test/e2e/nightwatch.conf.js +++ b/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,12 +30,12 @@ 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 } @@ -43,10 +43,10 @@ module.exports = { firefox: { desiredCapabilities: { - browserName: 'firefox', + browserName: "firefox", javascriptEnabled: true, acceptSslCerts: true } } } -} \ No newline at end of file +}; diff --git a/template/test/e2e/runner.js b/template/test/e2e/runner.js index 65385e7..1ce12e9 100644 --- a/template/test/e2e/runner.js +++ b/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 - }) -}) \ No newline at end of file + runner.on("error", function(err) { + server.close(); + throw err; + }); +}); diff --git a/template/test/e2e/spec/home.spec.js b/template/test/e2e/spec/home.spec.js index 030482a..7df3f6e 100644 --- a/template/test/e2e/spec/home.spec.js +++ b/template/test/e2e/spec/home.spec.js @@ -1,7 +1,7 @@ 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 @@ -9,20 +9,20 @@ module.exports = { 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(); }); }); - }) + }); }); } -} +}; diff --git a/template/test/unit/spec/SideNav.spec.ts b/template/test/unit/spec/SideNav.spec.ts index fdaaf00..3b3be6d 100644 --- a/template/test/unit/spec/SideNav.spec.ts +++ b/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(); diff --git a/template/test/unit/spec/WinnerIsYou.spec.ts b/template/test/unit/spec/WinnerIsYou.spec.ts index 18bcdb0..d772446 100644 --- a/template/test/unit/spec/WinnerIsYou.spec.ts +++ b/template/test/unit/spec/WinnerIsYou.spec.ts @@ -1,12 +1,12 @@ import Vue from "vue"; -import WinnerIsYouComponent, { IWinnerIsYou } from "../../../src/components/WinnerIsYou.vue"; +import WinnerIsYouComponent, { IWinnerIsYou } from "../../../src/components/WinnerIsYou.vue"; import "chai"; const assert = chai.assert; const WinnerIsYou = Vue.extend(WinnerIsYouComponent); -describe("WinnerIsYou.vue", () => { +describe("WinnerIsYou.vue", () => { beforeEach(() => { let main = document.getElementById("app"); if (main) { @@ -16,17 +16,21 @@ describe("WinnerIsYou.vue", () => { main.id = "app"; document.body.appendChild(main); } + + const mountPoint = document.createElement("div"); + mountPoint.id = "mountMe"; + document.getElementById("app").appendChild(mountPoint); }); it("Renders nothing when showText undefined", () => { - let vm = new WinnerIsYou().$mount("#app") as IWinnerIsYou; - + let vm = new WinnerIsYou().$mount("#mountMe") as IWinnerIsYou; + assert.equal(vm.text, ""); assert.equal(vm.$el.textContent, ""); }); - - it("Updates correctly", done => { - let vm = new WinnerIsYou().$mount("#app") as IWinnerIsYou; + + it("Updates correctly", (done) => { + let vm = new WinnerIsYou().$mount("#mountMe") as IWinnerIsYou; assert.equal(vm.text, ""); assert.equal(vm.$el.textContent, ""); vm.showText = "This page is intentionally styled poorly"; @@ -39,9 +43,9 @@ describe("WinnerIsYou.vue", () => { done(); }); }); - - it("Captializes correctly", done => { - let vm = new WinnerIsYou().$mount("#app") as IWinnerIsYou; + + it("Captializes correctly", (done) => { + let vm = new WinnerIsYou().$mount("#mountMe") as IWinnerIsYou; assert.equal(vm.text, ""); assert.equal(vm.$el.textContent, ""); vm.showText = "This page is intentionally styled poorly"; @@ -54,7 +58,7 @@ describe("WinnerIsYou.vue", () => { assert.equal(vm.$el.textContent, "ALTERNATIVE TEXT".toUpperCase()); vm.doStuff(); - + Vue.nextTick(() => { assert.equal(vm.showAlternate, false); assert.equal(vm.text, "This page is intentionally styled poorly".toUpperCase());