From 17e6c1f7fb4f8dc3cc9d494bedcbaca929bf8a9c Mon Sep 17 00:00:00 2001
From: Arsen Goian <arsengoian@gmail.com>
Date: Thu, 28 Sep 2023 10:36:13 +0300
Subject: [PATCH] fix(nuxt): apply scoped styles to islands (#23386)

---
 packages/nuxt/src/app/components/nuxt-island.ts          | 3 ++-
 packages/nuxt/src/components/runtime/server-component.ts | 3 +--
 test/nuxt/nuxt-island.test.ts                            | 2 +-
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/nuxt/src/app/components/nuxt-island.ts b/packages/nuxt/src/app/components/nuxt-island.ts
index 434634defa..0de8298589 100644
--- a/packages/nuxt/src/app/components/nuxt-island.ts
+++ b/packages/nuxt/src/app/components/nuxt-island.ts
@@ -50,7 +50,8 @@ export default defineComponent({
     const error = ref<unknown>(null)
     const config = useRuntimeConfig()
     const nuxtApp = useNuxtApp()
-    const hashId = computed(() => hash([props.name, props.props, props.context, props.source]))
+    const filteredProps = computed(() => props.props ? Object.fromEntries(Object.entries(props.props).filter(([key]) => !key.startsWith('data-v-'))) : {})
+    const hashId = computed(() => hash([props.name, filteredProps.value, props.context, props.source]))
     const instance = getCurrentInstance()!
     const event = useRequestEvent()
     // TODO: remove use of `$fetch.raw` when nitro 503 issues on windows dev server are resolved
diff --git a/packages/nuxt/src/components/runtime/server-component.ts b/packages/nuxt/src/components/runtime/server-component.ts
index 4a308c1b56..b8d7e216a3 100644
--- a/packages/nuxt/src/components/runtime/server-component.ts
+++ b/packages/nuxt/src/components/runtime/server-component.ts
@@ -11,8 +11,7 @@ export const createServerComponent = (name: string) => {
         return h(NuxtIsland, {
           name,
           lazy: props.lazy,
-          // #23051 - remove data-v attributes
-          props: Object.fromEntries(Object.entries(attrs).filter(([key]) => !key.startsWith('data-v-')))
+          props: attrs
         }, slots)
       }
     }
diff --git a/test/nuxt/nuxt-island.test.ts b/test/nuxt/nuxt-island.test.ts
index 90e3a2922b..898508a7c8 100644
--- a/test/nuxt/nuxt-island.test.ts
+++ b/test/nuxt/nuxt-island.test.ts
@@ -31,9 +31,9 @@ describe('runtime server component', () => {
     expect(h).toHaveBeenCalledOnce()
     if (!vi.mocked(h).mock.lastCall) { throw new Error('no last call') }
     expect(vi.mocked(h).mock.lastCall![1]?.props).toBeTypeOf('object')
-    expect(Object.keys(vi.mocked(h).mock.lastCall![1]?.props)).not.toContain('data-v-123')
     expect(vi.mocked(h).mock.lastCall![1]?.props).toMatchInlineSnapshot(`
       {
+        "data-v-123": "",
         "test": 1,
       }
     `)