From 73b8d7acf0d0d5878d10112280d77ff746fcf3d8 Mon Sep 17 00:00:00 2001
From: Joel Wenzel <50124194+joel-wenzel@users.noreply.github.com>
Date: Thu, 3 Oct 2024 13:02:06 -0500
Subject: [PATCH] fix(runtime-utils): pass global `directives` to
 `mountSuspended` (#960)

---
 examples/app-vitest-full/components/DirectiveComponent.vue | 3 +++
 examples/app-vitest-full/plugins/directive.ts              | 7 +++++++
 .../app-vitest-full/tests/nuxt/mount-suspended.spec.ts     | 6 ++++++
 src/runtime-utils/mount.ts                                 | 1 +
 4 files changed, 17 insertions(+)
 create mode 100644 examples/app-vitest-full/components/DirectiveComponent.vue
 create mode 100644 examples/app-vitest-full/plugins/directive.ts

diff --git a/examples/app-vitest-full/components/DirectiveComponent.vue b/examples/app-vitest-full/components/DirectiveComponent.vue
new file mode 100644
index 000000000..2291bf566
--- /dev/null
+++ b/examples/app-vitest-full/components/DirectiveComponent.vue
@@ -0,0 +1,3 @@
+<template>
+  <div v-sample-directive />
+</template>
diff --git a/examples/app-vitest-full/plugins/directive.ts b/examples/app-vitest-full/plugins/directive.ts
new file mode 100644
index 000000000..e876fb5cf
--- /dev/null
+++ b/examples/app-vitest-full/plugins/directive.ts
@@ -0,0 +1,7 @@
+export default defineNuxtPlugin((nuxtApp) => {
+  nuxtApp.vueApp.directive('sample-directive', {
+    created(el: Element) {
+      el.setAttribute('data-directive', 'true')
+    },
+  })
+})
diff --git a/examples/app-vitest-full/tests/nuxt/mount-suspended.spec.ts b/examples/app-vitest-full/tests/nuxt/mount-suspended.spec.ts
index 28538d439..ffb1df758 100644
--- a/examples/app-vitest-full/tests/nuxt/mount-suspended.spec.ts
+++ b/examples/app-vitest-full/tests/nuxt/mount-suspended.spec.ts
@@ -15,6 +15,7 @@ import ExportDefaultWithRenderComponent from '~/components/ExportDefaultWithRend
 import ExportDefaultReturnsRenderComponent from '~/components/ExportDefaultReturnsRenderComponent.vue'
 
 import { BoundAttrs } from '#components'
+import DirectiveComponent from '~/components/DirectiveComponent.vue'
 
 const formats = {
   ExportDefaultComponent,
@@ -117,6 +118,11 @@ describe('mountSuspended', () => {
     // @ts-expect-error FIXME: someRef is typed as unwrapped
     expect(component.vm.someRef.value).toBe('thing')
   })
+
+  it('respects directives registered in nuxt plugins', async () => {
+    const component = await mountSuspended(DirectiveComponent)
+    expect(component.html()).toMatchInlineSnapshot(`"<div data-directive="true"></div>"`)
+  })
 })
 
 describe.each(Object.entries(formats))(`%s`, (name, component) => {
diff --git a/src/runtime-utils/mount.ts b/src/runtime-utils/mount.ts
index 5c78235c5..a1c528b8c 100644
--- a/src/runtime-utils/mount.ts
+++ b/src/runtime-utils/mount.ts
@@ -145,6 +145,7 @@ export async function mountSuspended<T>(
               config: {
                 globalProperties: vueApp.config.globalProperties,
               },
+              directives: vueApp._context.directives,
               provide: vueApp._context.provides,
               stubs: {
                 Suspense: false,