Merge pull request #1463 from resessh/update-unit-tests

Update unit tests
ymmooot · Nov 28, 2024 · 8f996a0 · 8f996a0
2 parents d63c17c + 05db301
commit 8f996a0
Show file tree

Hide file tree

Showing 9 changed files with 264 additions and 234 deletions.
diff --git a/packages/nuxt-jsonld/package.json b/packages/nuxt-jsonld/package.json
@@ -35,6 +35,8 @@
     "@babel/preset-env": "^7.24.7",
     "@nuxtjs/eslint-config-typescript": "^12.1.0",
     "@vitest/coverage-istanbul": "^2.1.6",
+    "@vue/test-utils": "^2.4.6",
+    "happy-dom": "^15.11.7",
     "nuxt": "^3.11.2",
     "prettier": "^3.3.2",
     "shipjs": "0.26.3",

diff --git a/packages/nuxt-jsonld/src/runtime/plugin-impl.ts b/packages/nuxt-jsonld/src/runtime/plugin-impl.ts
@@ -1,27 +1,25 @@
-import { computed } from 'vue';
+import { computed, type Plugin } from 'vue';
 import { useHead } from '@unhead/vue';
 
-export default (nuxtApp) => {
-  const mixin = {
-    created() {
-      if (typeof this.$options?.jsonld !== 'function') {
-        return;
-      }
-      const jsonComputed = computed(() => this.$options.jsonld.call(this));
-      useHead(() => ({
-        script: [
-          {
-            type: 'application/ld+json',
-            children: jsonComputed.value ? JSON.stringify(jsonComputed.value, null, '') : undefined,
-          },
-        ],
-      }));
-    },
-  };
-  const plugin = {
-    install(Vue) {
-      Vue.mixin(mixin);
-    },
-  };
-  nuxtApp.vueApp.use(plugin);
+export const vuePlugin: Plugin = {
+  install(Vue) {
+    Vue.mixin({
+      created() {
+        if (typeof this.$options?.jsonld !== 'function') {
+          return;
+        }
+        const jsonComputed = computed(() => this.$options.jsonld.call(this));
+        useHead(() => ({
+          script: [
+            {
+              type: 'application/ld+json',
+              children: jsonComputed.value
+                ? JSON.stringify(jsonComputed.value, null, '')
+                : undefined,
+            },
+          ],
+        }));
+      },
+    });
+  },
 };
diff --git a/packages/nuxt-jsonld/src/runtime/plugin.ts b/packages/nuxt-jsonld/src/runtime/plugin.ts
@@ -1,4 +1,6 @@
 import { defineNuxtPlugin } from 'nuxt/app';
-import plugin from './plugin-impl';
+import { vuePlugin } from './plugin-impl';
 
-export default defineNuxtPlugin(plugin);
+export default defineNuxtPlugin((nuxtApp) => {
+  nuxtApp.vueApp.use(vuePlugin);
+});
diff --git a/packages/nuxt-jsonld/test/composable.spec.js → packages/nuxt-jsonld/test/composable.spec.ts b/packages/nuxt-jsonld/test/composable.spec.js → packages/nuxt-jsonld/test/composable.spec.ts
@@ -1,18 +1,21 @@
+import { describe, beforeEach, it, test, expect, vi, type Mock } from 'vitest';
+import { ref, toValue } from 'vue';
 import { useJsonld } from '../src/runtime/composable';
-import { ref } from 'vue';
-import { useHead } from '@unhead/vue';
 
-let useHeadArg = undefined;
+const { useHead } = vi.hoisted(() => {
+  return {
+    useHead: vi.fn(),
+  };
+});
 vi.mock('@unhead/vue', () => ({
-  useHead: vi.fn().mockImplementation((arg) => {
-    useHeadArg = arg;
-  }),
+  useHead,
 }));
 
+const getLastCalledParams = (mock: Mock<any>) => mock.mock.calls[mock.mock.calls.length - 1];
+
 describe('useJsonld', () => {
   beforeEach(() => {
     vi.clearAllMocks();
-    useHeadArg = undefined;
   });
 
   it('calls useHead with a function which returns object including script tag', () => {
@@ -22,7 +25,7 @@ describe('useJsonld', () => {
       name: 'foo',
     });
     expect(useHead).toBeCalledTimes(1);
-    expect(useHeadArg()).toEqual({
+    expect(toValue(getLastCalledParams(useHead)[0])).toEqual({
       script: [
         {
           type: 'application/ld+json',
@@ -41,7 +44,7 @@ describe('useJsonld', () => {
     }));
 
     expect(useHead).toBeCalledTimes(1);
-    expect(useHeadArg()).toEqual({
+    expect(toValue(getLastCalledParams(useHead)[0])).toEqual({
       script: [
         {
           type: 'application/ld+json',
@@ -54,7 +57,7 @@ describe('useJsonld', () => {
   test('passing a function returning null', () => {
     useJsonld(() => null);
     expect(useHead).toBeCalledTimes(1);
-    expect(useHeadArg()).toEqual({});
+    expect(toValue(getLastCalledParams(useHead)[0])).toEqual({});
   });
 
   test('passing null', () => {

diff --git a/packages/nuxt-jsonld/test/plugin-impl.spec.ts b/packages/nuxt-jsonld/test/plugin-impl.spec.ts
@@ -0,0 +1,98 @@
+import { describe, beforeEach, it, expect, vi, type Mock } from 'vitest';
+import { toValue } from 'vue';
+import { mount } from '@vue/test-utils';
+
+import { vuePlugin } from '../src/runtime/plugin-impl';
+
+const { useHead } = vi.hoisted(() => {
+  return {
+    useHead: vi.fn(),
+  };
+});
+vi.mock('@unhead/vue', () => ({
+  useHead,
+}));
+
+const getLastCalledParams = (mock: Mock<any>) => mock.mock.calls[mock.mock.calls.length - 1];
+
+describe('plugin-impl', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it('does not call useHead when $jsonld is not set', () => {
+    mount(
+      {
+        template: '<div />',
+      },
+      {
+        global: {
+          plugins: [vuePlugin],
+        },
+      }
+    );
+
+    expect(useHead).not.toBeCalled();
+  });
+
+  it('calls useHead', () => {
+    mount(
+      {
+        template: '<div />',
+        data() {
+          return {
+            count: 0,
+          };
+        },
+        jsonld() {
+          return {
+            '@context': 'https://schema.org',
+            '@type': 'Thing',
+            name: this.count,
+          };
+        },
+      },
+      {
+        global: {
+          plugins: [vuePlugin],
+        },
+      }
+    );
+
+    expect(useHead).toBeCalledTimes(1);
+    expect(toValue(getLastCalledParams(useHead)[0])).toEqual({
+      script: [
+        {
+          type: 'application/ld+json',
+          children: '{"@context":"https://schema.org","@type":"Thing","name":0}',
+        },
+      ],
+    });
+  });
+
+  it('calls useHead with enpty when $jsonld response is undefined', () => {
+    mount(
+      {
+        template: '<div />',
+        jsonld() {
+          return undefined;
+        },
+      },
+      {
+        global: {
+          plugins: [vuePlugin],
+        },
+      }
+    );
+
+    expect(useHead).toBeCalled();
+    expect(toValue(getLastCalledParams(useHead)[0])).toEqual({
+      script: [
+        {
+          type: 'application/ld+json',
+          children: undefined,
+        },
+      ],
+    });
+  });
+});
diff --git a/packages/nuxt-jsonld/test/plugin.spec.js b/packages/nuxt-jsonld/test/plugin.spec.js
diff --git a/packages/nuxt-jsonld/test/plugin.spec.ts b/packages/nuxt-jsonld/test/plugin.spec.ts
@@ -0,0 +1,27 @@
+import { describe, beforeEach, it, expect, vi, type Mock } from 'vitest';
+
+import plugin from '../src/runtime/plugin';
+
+const { vuePlugin, vueAppUse } = vi.hoisted(() => {
+  return {
+    vuePlugin: vi.fn(),
+    vueAppUse: vi.fn(),
+  };
+});
+vi.mock('../src/runtime/plugin-impl.ts', () => ({
+  vuePlugin,
+}));
+vi.mock('nuxt/app', () => ({
+  defineNuxtPlugin: vi.fn().mockImplementation((fn) => fn),
+}));
+
+describe('plugin', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it('calles vuePlugin', () => {
+    plugin({ vueApp: { use: vueAppUse } } as any);
+    expect(vueAppUse).toBeCalledWith(vuePlugin);
+  });
+});
diff --git a/packages/nuxt-jsonld/vitest.config.ts b/packages/nuxt-jsonld/vitest.config.ts
@@ -1,10 +1,10 @@
-/// <reference types="vitest" />
+/// <reference types="vitest/config" />
 
-import { defineConfig } from 'vite';
+import { defineConfig } from 'vitest/config';
 
 export default defineConfig({
   test: {
-    globals: true,
+    environment: 'happy-dom',
     coverage: {
       provider: 'istanbul',
     },