Update deps

README.md

@@ -126,7 +126,7 @@ I set up Pinia in this project to save you time (and because it's amazing). If y
 
 ## Updating Vue-DevTools
 
-At time of writing, Vue-DevTools v6 has just been released. It is a major re-write and there are many reports of it being buggy. So for now I've changed the repo to use a pinned version of the last V5 release. If you are reading this in the future, you can try changing `nw-vue-devtools-5` with `nw-vue-devtools-prebuilt`. That dependency will download the latest Vue-DevTools from the Chromium Web Store and then patch it to work in NW.js. Make sure to update all references from `nw-vue-devtools-5` to `nw-vue-devtools-prebuilt` in the `package.json`. There is also a `npm run update:vue-devtools` script that will delete it and re-download latest from the web store if you are using the prebuilt version.
+At time of writing, Vue-DevTools v6 has just been released. It is a major re-write and there are many reports of it being buggy. So for now I've changed the repo to use a pinned version of the last V5 release. If you are reading this in the future, you can try changing `nw-vue-devtools-5` to `nw-vue-devtools-prebuilt`. The "prebuilt" dependency will download the latest Vue-DevTools from the Chromium Web Store and then patch it to work in NW.js. Make sure to update all references from `nw-vue-devtools-5` to `nw-vue-devtools-prebuilt` in the `package.json`. There is also a `npm run update:vue-devtools` script that will delete it and re-download latest from the web store if you are using the prebuilt version.
 
 
 ## Alternatives
@@ -135,12 +135,10 @@ At time of writing, Vue-DevTools v6 has just been released. It is a major re-wri
 * [nw-vue-cli-example](https://github.com/nwutils/nw-vue-cli-example) - Uses Vue-CLI (WebPack), has Vue 2 and Vue 3 branches.
 * [nwjs-vue](https://github.com/elegantweb/nwjs-vue) - Uses Vue-CLI 2
 * [vue-desktop-basic](https://github.com/TheJaredWilcurt/vue-desktop-basic) - Does not use a build system at all, all `.vue` files run directly in the browser context
-* [nw-vue3-typescript-pinia](https://github.com/codeh2o/nw-vue3-typescript-pinia) - Fork of this repo but with TS added
+* [nw-vue3-typescript-pinia](https://github.com/codeh2o/nw-vue3-typescript-pinia) - Old fork of this repo but with TS added
 
 
-## Boilerplate maintainer notes
-
-This is not for those *using* this repo, but for those *maintaining* it.
+## Updating to newer NW.js versions
 
 1. When updating the version of NW.js devDependency, also update these:
    * `package.json` version, devDeps, build nwVersion, volta

package.json

@@ -3,7 +3,8 @@
     "Only add dependencies that you want shipped to the end user, for everything else, use devDependencies, including things that will be bundled by Vite.",
     "NW.js requires a name and a main, everything else is optional.",
     "The build section is used by nwjs-builder-phoenix, see its documentation for more info",
-    "To turn spell checking off, remove it from the chromium-args in this file"
+    "To turn spell checking off, remove it from the chromium-args in this file",
+    "Pinned @vitejs/plugin-vue to 4.5.2 because a bug effecting coverage. vitejs/vite-plugin-vue #368"
   ],
   "name": "your-app-name",
   "version": "1.0.4",
@@ -40,37 +41,37 @@
     "update:vue-devtools": "rimraf ./node_modules/your-app-name-devtools-5 && npm install"
   },
   "dependencies": {
-    "express": "^4.18.2"
+    "express": "^4.18.3"
   },
   "devDependencies": {
-    "@babel/eslint-parser": "^7.23.3",
+    "@babel/eslint-parser": "^7.23.10",
     "@pinia/testing": "^0.1.3",
-    "@vitejs/plugin-vue": "^4.5.0",
-    "@vitest/coverage-v8": "^0.34.6",
-    "@vue/test-utils": "^2.4.2",
+    "@vitejs/plugin-vue": "4.5.2",
+    "@vitest/coverage-v8": "^1.3.1",
+    "@vue/test-utils": "^2.4.5",
     "concurrently": "^8.2.2",
-    "eslint": "^8.54.0",
+    "eslint": "^8.57.0",
     "eslint-config-tjw-base": "^2.0.0",
     "eslint-config-tjw-import": "^1.0.0",
     "eslint-config-tjw-jest": "^2.0.0",
     "eslint-config-tjw-vue": "^3.0.0",
     "eslint-import-resolver-webpack": "^0.13.8",
-    "eslint-plugin-import": "^2.29.0",
-    "eslint-plugin-jest": "^27.6.0",
-    "eslint-plugin-vue": "^9.18.1",
-    "eslint-plugin-vuejs-accessibility": "^2.2.0",
-    "happy-dom": "^12.10.3",
+    "eslint-plugin-import": "^2.29.1",
+    "eslint-plugin-jest": "^27.9.0",
+    "eslint-plugin-vue": "^9.23.0",
+    "eslint-plugin-vuejs-accessibility": "^2.2.1",
+    "happy-dom": "^13.8.5",
     "jest-serializer-vue-tjw": "^3.20.0",
     "nw": "0.82.0-sdk",
     "nw-vue-devtools-5": "^5.0.0",
     "nwjs-builder-phoenix": "^1.15.0",
-    "pinia": "^2.1.6",
+    "pinia": "^2.1.7",
     "rimraf": "^5.0.5",
-    "vite": "^5.0.2",
-    "vitest": "^0.34.6",
-    "vue": "^3.3.9",
+    "vite": "^5.1.6",
+    "vitest": "^1.3.1",
+    "vue": "^3.4.21",
     "vue-options-api-constants-plugin": "^1.0.1",
-    "vue-router": "^4.2.5",
+    "vue-router": "^4.3.0",
     "wait-on": "^7.2.0"
   },
   "chromium-args": "--enable-spell-checking --load-extension='./node_modules/nw-vue-devtools-5/extension' --disable-features=ProcessPerSiteUpToMainFrameThreshold",

server.cjs

@@ -1,5 +1,7 @@
+/* c8 ignore start */
 const express = require('express');
 
 const app = express();
 app.use(express.static('./dist-vue'));
 app.listen(4185);
+/* c8 ignore stop */

src/main.js

@@ -10,7 +10,7 @@ import App from '@/App.vue';
 
 import '@/assets/main.css';
 
-const app = createApp(App);
+export const app = createApp(App);
 applyPrototypes(app.config.globalProperties);
 app.use(createPinia());
 app.use(router);

tests/unit/main.test.js

@@ -0,0 +1,8 @@
+import { app } from '@/main.js';
+
+describe('main.js', () => {
+  test('Creates Vue app', () => {
+    expect(app?._component?.name)
+      .toEqual('App');
+  });
+});

tests/unit/setup.js

@@ -2,6 +2,8 @@ import vueSnapshotSerializer from './serializer.js';
 
 expect.addSnapshotSerializer(vueSnapshotSerializer);
 
+global.document = global.window.document;
+document.body.innerHTML = '<div id="app"></div>';
 const { getComputedStyle } = window;
 
 // Prevents console log message to install Vue DevTools

vite.config.js

@@ -1,8 +1,9 @@
-/* eslint-disable import/no-unused-modules */
+/* eslint-disable import/no-unused-modules,import/no-extraneous-dependencies */
 import { fileURLToPath, URL } from 'node:url';
 
 import vue from '@vitejs/plugin-vue';
 import { defineConfig } from 'vite';
+import { configDefaults } from 'vitest/dist/config.js';
 
 // https://vitejs.dev/config/
 export default defineConfig({
@@ -22,6 +23,10 @@ export default defineConfig({
     globals: true,
     environment: 'happy-dom',
     coverage: {
+      exclude: [
+        ...(configDefaults?.coverage?.exclude || []),
+        '**/dist-vue/**'
+      ],
       reportsDirectory: './tests/unit/coverage'
     },
     root: '.',