test: migrate and re-enable test suite (#177)

.nuxtrc

@@ -1,2 +1,3 @@
 typescript.includeWorkspace=true
 imports.autoImport=false
+sourcemap=false

package.json

@@ -28,7 +28,7 @@
     "dev:prepare": "nuxt-module-build --stub && nuxi prepare playground",
     "lint": "eslint --ext .js,.vue,.ts .",
     "release": "yarn test && standard-version && git push --follow-tags && npm publish",
-    "test": "yarn lint"
+    "test": "yarn vitest run --coverage"
   },
   "dependencies": {
     "@nuxt/kit": "^3.0.0",
@@ -40,16 +40,17 @@
     "@commitlint/config-conventional": "^17.0.3",
     "@nuxt/module-builder": "^0.1.7",
     "@nuxt/schema": "^3.0.0",
+    "@nuxt/test-utils": "^3.0.0",
     "@nuxtjs/eslint-config-typescript": "^12.0.0",
     "@types/lodash.template": "^4.5.1",
     "@typescript-eslint/parser": "^5.34.0",
-    "babel-jest": "^29.3.1",
+    "@vitest/coverage-c8": "^0.25.3",
     "eslint": "^8.22.0",
     "husky": "8.0.1",
-    "jest": "^29.3.1",
     "nuxt": "3.0.0",
     "standard-version": "^9.5.0",
-    "typescript": "^4.7.4"
+    "typescript": "^4.7.4",
+    "vitest": "^0.25.3"
   },
   "publishConfig": {
     "access": "public"

test/csr/dev.test.ts

@@ -0,0 +1,18 @@
+import { fileURLToPath } from 'url'
+import { setup, $fetch } from '@nuxt/test-utils'
+import { describe, it, expect } from 'vitest'
+
+const fixture = fileURLToPath(new URL('../../playground', import.meta.url))
+
+describe('ssr: false, dev mode', async () => {
+  await setup({
+    server: true,
+    dev: true,
+    fixture,
+    nuxtConfig: { ssr: false }
+  })
+  it('renders', async () => {
+    const html = await $fetch('/')
+    expect(html).toContain("getItem('nuxt-color-mode')")
+  })
+})

test/csr/generate.test.ts

@@ -0,0 +1,28 @@
+import { join, resolve } from 'path'
+import { fileURLToPath } from 'url'
+import { readFile } from 'fs/promises'
+import { setup, useTestContext } from '@nuxt/test-utils'
+import { describe, it, expect } from 'vitest'
+
+const fixture = fileURLToPath(new URL('../../playground', import.meta.url))
+
+describe('ssr: false, target: static, generated files', async () => {
+  await setup({
+    fixture,
+    server: false,
+    nuxtConfig: {
+      _generate: true,
+      ssr: false
+    }
+  })
+
+  it('generated file', async () => {
+    const ctx = useTestContext()
+    const generateDir = resolve(ctx.nuxt!.options.nitro.output?.dir || '', 'public')
+    const files = ['index.html', '200.html']
+    for (const file of files) {
+      const contents = await readFile(join(generateDir, file), 'utf-8')
+      expect(contents).toContain("getItem('nuxt-color-mode')")
+    }
+  })
+})

test/csr/prod.test.ts

@@ -0,0 +1,19 @@
+import { fileURLToPath } from 'url'
+import { setup, $fetch } from '@nuxt/test-utils'
+import { describe, it, expect } from 'vitest'
+
+const fixture = fileURLToPath(new URL('../../playground', import.meta.url))
+
+describe('ssr: false, target: server, prod mode', async () => {
+  await setup({
+    server: true,
+    build: true,
+    fixture,
+    nuxtConfig: { ssr: false }
+  })
+
+  it('render', async () => {
+    const html = await $fetch('/')
+    expect(html).toContain("getItem('nuxt-color-mode')")
+  })
+})

test/ssr/dev.test.ts

@@ -0,0 +1,18 @@
+import { fileURLToPath } from 'url'
+import { setup, $fetch } from '@nuxt/test-utils'
+import { describe, it, expect } from 'vitest'
+
+const fixture = fileURLToPath(new URL('../../playground', import.meta.url))
+
+describe('ssr: true, dev mode', async () => {
+  await setup({
+    server: true,
+    dev: true,
+    fixture
+  })
+
+  it('render', async () => {
+    const html = await $fetch('/')
+    expect(html).toContain("getItem('nuxt-color-mode')")
+  })
+})

test/ssr/generate.test.ts

@@ -0,0 +1,27 @@
+import { join, resolve } from 'path'
+import { fileURLToPath } from 'url'
+import { readFile } from 'fs/promises'
+import { setup, useTestContext } from '@nuxt/test-utils'
+import { describe, it, expect } from 'vitest'
+
+const fixture = fileURLToPath(new URL('../../playground', import.meta.url))
+
+describe('ssr: true, target: static, generated files', async () => {
+  await setup({
+    server: false,
+    fixture,
+    nuxtConfig: {
+      _generate: true
+    }
+  })
+
+  it('generated file', async () => {
+    const ctx = useTestContext()
+    const generateDir = resolve(ctx.nuxt!.options.nitro.output?.dir || '', 'public')
+    const files = ['index.html', '200.html']
+    for (const file of files) {
+      const contents = await readFile(join(generateDir, file), 'utf-8')
+      expect(contents).toMatch("getItem('nuxt-color-mode')")
+    }
+  })
+})

test/ssr/prod.test.ts

@@ -0,0 +1,36 @@
+import { fileURLToPath } from 'url'
+import { setup, $fetch } from '@nuxt/test-utils'
+import { describe, it, expect } from 'vitest'
+
+const fixture = fileURLToPath(new URL('../../playground', import.meta.url))
+
+describe('ssr: true, target: server, prod mode', async () => {
+  await setup({
+    server: true,
+    build: true,
+    fixture,
+    nuxtConfig: { ssr: true }
+  })
+
+  it('render', async () => {
+    const html = await $fetch('/')
+    expect(html).toContain("getItem('nuxt-color-mode')")
+  })
+})
+
+// describe.skip('ssr: true, csp hash on script', async () => {
+//   await setup({
+//     server: true,
+//     fixture,
+//     nuxtConfig: {
+//       // render: {
+//       //   csp: true
+//       // }
+//     }
+//   })
+
+//   it('csp hash on script', async () => {
+//     const { headers } = await fetch('/')
+//     expect(headers.get('content-security-policy')).toContain('sha256-')
+//   })
+// })

vite.config.js

@@ -0,0 +1,10 @@
+import { defineConfig } from 'vite'
+
+export default defineConfig({
+  test: {
+    coverage: {
+      reporter: ['text'],
+      include: ['src']
+    }
+  }
+})