From a4d095872783ab54354cd219a5ac4c7864018ccc Mon Sep 17 00:00:00 2001
From: Julien Huang <julien.huang@outlook.fr>
Date: Tue, 7 May 2024 22:55:54 +0200
Subject: [PATCH] fix(nuxt): remove unused prop in
 `NuxtTeleportIslandComponent` (#27093)

---
 .../nuxt-teleport-island-component.ts         |  8 --
 .../nuxt/src/components/islandsTransform.ts   |  9 +-
 packages/nuxt/src/components/module.ts        |  2 -
 packages/nuxt/test/islandTransform.test.ts    | 90 +++++--------------
 4 files changed, 25 insertions(+), 84 deletions(-)

diff --git a/packages/nuxt/src/app/components/nuxt-teleport-island-component.ts b/packages/nuxt/src/app/components/nuxt-teleport-island-component.ts
index 002a2441a0e4..31b2c0718b21 100644
--- a/packages/nuxt/src/app/components/nuxt-teleport-island-component.ts
+++ b/packages/nuxt/src/app/components/nuxt-teleport-island-component.ts
@@ -27,14 +27,6 @@ export default defineComponent({
       type: Boolean,
       default: false,
     },
-    /**
-     * ONLY used in dev mode since we use build:manifest result in production
-     * do not pass any value in production
-     */
-    rootDir: {
-      type: String,
-      default: null,
-    },
   },
   setup (props, { slots }) {
     const nuxtApp = useNuxtApp()
diff --git a/packages/nuxt/src/components/islandsTransform.ts b/packages/nuxt/src/components/islandsTransform.ts
index 46a9f31d3ddd..6e018dc1679c 100644
--- a/packages/nuxt/src/components/islandsTransform.ts
+++ b/packages/nuxt/src/components/islandsTransform.ts
@@ -13,12 +13,6 @@ import { isVue } from '../core/utils'
 
 interface ServerOnlyComponentTransformPluginOptions {
   getComponents: () => Component[]
-  /**
-   * passed down to `NuxtTeleportIslandComponent`
-   * should be done only in dev mode as we use build:manifest result in production
-   */
-  rootDir?: string
-  isDev?: boolean
   /**
    * allow using `nuxt-client` attribute on components
    */
@@ -43,7 +37,6 @@ function wrapWithVForDiv (code: string, vfor: string): string {
 
 export const islandsTransform = createUnplugin((options: ServerOnlyComponentTransformPluginOptions, meta) => {
   const isVite = meta.framework === 'vite'
-  const { isDev, rootDir } = options
   return {
     name: 'server-only-component-transform',
     enforce: 'pre',
@@ -115,7 +108,7 @@ export const islandsTransform = createUnplugin((options: ServerOnlyComponentTran
                 startTag = startTag.replaceAll(EXTRACTED_ATTRS_RE, '')
               }
 
-              s.appendLeft(startingIndex + loc[0].start, `<NuxtTeleportIslandComponent${attributeToString(wrapperAttributes)} to="${node.name}-${uid}" ${rootDir && isDev ? `root-dir="${rootDir}"` : ''} :nuxt-client="${attributeValue}">`)
+              s.appendLeft(startingIndex + loc[0].start, `<NuxtTeleportIslandComponent${attributeToString(wrapperAttributes)} to="${node.name}-${uid}" :nuxt-client="${attributeValue}">`)
               s.overwrite(startingIndex + loc[0].start, startingIndex + loc[0].end, startTag)
               s.appendRight(startingIndex + loc[1].end, '</NuxtTeleportIslandComponent>')
             }
diff --git a/packages/nuxt/src/components/module.ts b/packages/nuxt/src/components/module.ts
index 1a2b52439435..82e227a2ad65 100644
--- a/packages/nuxt/src/components/module.ts
+++ b/packages/nuxt/src/components/module.ts
@@ -260,8 +260,6 @@ export default defineNuxtModule<ComponentsOptions>({
         if (isServer) {
           config.plugins.push(islandsTransform.vite({
             getComponents,
-            rootDir: nuxt.options.rootDir,
-            isDev: nuxt.options.dev,
             selectiveClient,
           }))
         }
diff --git a/packages/nuxt/test/islandTransform.test.ts b/packages/nuxt/test/islandTransform.test.ts
index 519373867a3f..8c814544091f 100644
--- a/packages/nuxt/test/islandTransform.test.ts
+++ b/packages/nuxt/test/islandTransform.test.ts
@@ -23,11 +23,9 @@ const pluginWebpack = islandsTransform.raw({
   selectiveClient: true,
 }, { framework: 'webpack', webpack: { compiler: {} as any } })
 
-const viteTransform = async (source: string, id: string, isDev = false, selectiveClient = false) => {
+const viteTransform = async (source: string, id: string, selectiveClient = false) => {
   const vitePlugin = islandsTransform.raw({
     getComponents,
-    rootDir: '/root',
-    isDev,
     selectiveClient,
   }, { framework: 'vite' }) as Plugin
 
@@ -193,7 +191,7 @@ describe('islandTransform - server and island components', () => {
       <slot v-else-if="test" />
       <slot v-else />
       </template>
-      `, 'WithVif.vue', false, true)
+      `, 'WithVif.vue', true)
 
       expect(normalizeLineEndings(result)).toMatchInlineSnapshot(`
         "<script setup lang="ts">
@@ -214,44 +212,7 @@ describe('islandTransform - server and island components', () => {
 
   describe('nuxt-client', () => {
     describe('vite', () => {
-      it('test transform with vite in dev', async () => {
-        const result = await viteTransform(`<template>
-        <div>
-          <!-- should not be wrapped by NuxtTeleportIslandComponent -->
-          <HelloWorld />
-          <!-- should be wrapped by NuxtTeleportIslandComponent with a rootDir attr -->
-          <HelloWorld nuxt-client />
-        </div>
-      </template>
-
-      <script setup lang="ts">
-      import HelloWorld from './HelloWorld.vue'
-      </script>
-      `, 'hello.server.vue', true, true)
-
-        expect(normalizeLineEndings(result)).toMatchInlineSnapshot(`
-          "<template>
-                  <div>
-                    <!-- should not be wrapped by NuxtTeleportIslandComponent -->
-                    <HelloWorld />
-                    <!-- should be wrapped by NuxtTeleportIslandComponent with a rootDir attr -->
-                    <NuxtTeleportIslandComponent to="HelloWorld-ZsRS8qEyqK" root-dir="/root" :nuxt-client="true"><HelloWorld /></NuxtTeleportIslandComponent>
-                  </div>
-                </template>
-
-                <script setup lang="ts">
-          import { vforToArray as __vforToArray } from '#app/components/utils'
-          import NuxtTeleportIslandComponent from '#app/components/nuxt-teleport-island-component'
-          import NuxtTeleportSsrSlot from '#app/components/nuxt-teleport-island-slot'
-                import HelloWorld from './HelloWorld.vue'
-                </script>
-                "
-        `)
-        // root-dir prop should never be used in production
-        expect(result).toContain('root-dir="/root"')
-      })
-
-      it('test transform with vite in prod', async () => {
+      it('test transform with vite', async () => {
         const result = await viteTransform(`<template>
         <div>
           <HelloWorld />
@@ -262,13 +223,13 @@ describe('islandTransform - server and island components', () => {
       <script setup lang="ts">
       import HelloWorld from './HelloWorld.vue'
       </script>
-      `, 'hello.server.vue', false, true)
+      `, 'hello.server.vue', true)
 
         expect(normalizeLineEndings(result)).toMatchInlineSnapshot(`
           "<template>
                   <div>
                     <HelloWorld />
-                    <NuxtTeleportIslandComponent to="HelloWorld-CyH3UXLuYA"  :nuxt-client="true"><HelloWorld /></NuxtTeleportIslandComponent>
+                    <NuxtTeleportIslandComponent to="HelloWorld-CyH3UXLuYA" :nuxt-client="true"><HelloWorld /></NuxtTeleportIslandComponent>
                   </div>
                 </template>
 
@@ -280,9 +241,6 @@ describe('islandTransform - server and island components', () => {
                 </script>
                 "
         `)
-
-        // root-dir prop should never be used in production
-        expect(result).not.toContain('root-dir="')
       })
 
       it('test dynamic nuxt-client', async () => {
@@ -298,13 +256,13 @@ describe('islandTransform - server and island components', () => {
 
       const nuxtClient = false
       </script>
-      `, 'hello.server.vue', false, true)
+      `, 'hello.server.vue', true)
 
         expect(normalizeLineEndings(result)).toMatchInlineSnapshot(`
           "<template>
                   <div>
                     <HelloWorld />
-                    <NuxtTeleportIslandComponent to="HelloWorld-eo0XycWCUV"  :nuxt-client="nuxtClient"><HelloWorld /></NuxtTeleportIslandComponent>
+                    <NuxtTeleportIslandComponent to="HelloWorld-eo0XycWCUV" :nuxt-client="nuxtClient"><HelloWorld /></NuxtTeleportIslandComponent>
                   </div>
                 </template>
 
@@ -333,7 +291,7 @@ describe('islandTransform - server and island components', () => {
 
       const nuxtClient = false
       </script>
-      `, 'hello.server.vue', false, false)
+      `, 'hello.server.vue', false)
 
         expect(normalizeLineEndings(result)).toMatchInlineSnapshot(`
           "<template>
@@ -363,21 +321,21 @@ describe('islandTransform - server and island components', () => {
         </div>
       </template>
 
-      `, 'hello.server.vue', false, true)
+      `, 'hello.server.vue', true)
 
         expect(result).toMatchInlineSnapshot(`
-        "<script setup>
-        import { vforToArray as __vforToArray } from '#app/components/utils'
-        import NuxtTeleportIslandComponent from '#app/components/nuxt-teleport-island-component'
-        import NuxtTeleportSsrSlot from '#app/components/nuxt-teleport-island-slot'</script><template>
-                <div>
-                  <HelloWorld />
-                  <NuxtTeleportIslandComponent to="HelloWorld-CyH3UXLuYA"  :nuxt-client="true"><HelloWorld /></NuxtTeleportIslandComponent>
-                </div>
-              </template>
+          "<script setup>
+          import { vforToArray as __vforToArray } from '#app/components/utils'
+          import NuxtTeleportIslandComponent from '#app/components/nuxt-teleport-island-component'
+          import NuxtTeleportSsrSlot from '#app/components/nuxt-teleport-island-slot'</script><template>
+                  <div>
+                    <HelloWorld />
+                    <NuxtTeleportIslandComponent to="HelloWorld-CyH3UXLuYA" :nuxt-client="true"><HelloWorld /></NuxtTeleportIslandComponent>
+                  </div>
+                </template>
 
-              "
-      `)
+                "
+        `)
         expect(result).toContain('import NuxtTeleportIslandComponent from \'#app/components/nuxt-teleport-island-component\'')
       })
 
@@ -389,7 +347,7 @@ describe('islandTransform - server and island components', () => {
         <HelloWorld v-else nuxt-client />
         </div>
       </template>
-      `, 'hello.server.vue', false, true)
+      `, 'hello.server.vue', true)
 
         expect(result).toMatchInlineSnapshot(`
           "<script setup>
@@ -397,9 +355,9 @@ describe('islandTransform - server and island components', () => {
           import NuxtTeleportIslandComponent from '#app/components/nuxt-teleport-island-component'
           import NuxtTeleportSsrSlot from '#app/components/nuxt-teleport-island-slot'</script><template>
                   <div>
-                  <NuxtTeleportIslandComponent v-if="false" to="HelloWorld-D9uaHyzL7X"  :nuxt-client="true"><HelloWorld  /></NuxtTeleportIslandComponent>
-                  <NuxtTeleportIslandComponent v-else-if="true" to="HelloWorld-o4RZMtArnE"  :nuxt-client="true"><HelloWorld  /></NuxtTeleportIslandComponent>
-                  <NuxtTeleportIslandComponent v-else to="HelloWorld-m1IbXHdd8O"  :nuxt-client="true"><HelloWorld  /></NuxtTeleportIslandComponent>
+                  <NuxtTeleportIslandComponent v-if="false" to="HelloWorld-D9uaHyzL7X" :nuxt-client="true"><HelloWorld  /></NuxtTeleportIslandComponent>
+                  <NuxtTeleportIslandComponent v-else-if="true" to="HelloWorld-o4RZMtArnE" :nuxt-client="true"><HelloWorld  /></NuxtTeleportIslandComponent>
+                  <NuxtTeleportIslandComponent v-else to="HelloWorld-m1IbXHdd8O" :nuxt-client="true"><HelloWorld  /></NuxtTeleportIslandComponent>
                   </div>
                 </template>
                 "