fix: regression local composer extending

packages/vue-i18n-routing/scripts/vitest.ts

@@ -6,13 +6,14 @@ import type { InjectionKey, Ref } from 'vue-demi'
 
 type InstanceType<V> = V extends { new (...arg: any[]): infer X } ? X : never
 type VM<V> = InstanceType<V> & { unmount(): void }
+type Plugins = [...any]
 
-export function mount<V>(Comp: V, plugins: any[] = []) {
+export function mount<V>(Comp: V, plugins: Plugins[] = []) {
   const el = document.createElement('div')
   const app = createApp(Comp as any)
 
   for (const plugin of plugins) {
-    app.use(plugin)
+    app.use(plugin[0], plugin[1])
   }
 
   // @ts-ignore
@@ -22,7 +23,7 @@ export function mount<V>(Comp: V, plugins: any[] = []) {
   return comp
 }
 
-export function useSetup<V>(setup: () => V, plugins: any[] = []) {
+export function useSetup<V>(setup: () => V, plugins: Plugins[] = []) {
   const Comp = defineComponent({
     setup,
     render() {

packages/vue-i18n-routing/src/__test__/compatibles.test.ts

@@ -30,7 +30,7 @@ describe('getRouteBaseName', () => {
         history: createMemoryHistory()
       })
       await router.push('/en')
-      const vm = useSetup(() => {}, [router, i18n]) as any // FIXME:
+      const vm = useSetup(() => {}, [[router], [i18n]]) as any // FIXME:
       const name = vm.getRouteBaseName()
       assert.equal(name, 'home')
     })
@@ -54,7 +54,7 @@ describe('getRouteBaseName', () => {
         history: createMemoryHistory()
       })
       await router.push('/en')
-      const vm = useSetup(() => {}, [router, i18n]) as any // FIXME:
+      const vm = useSetup(() => {}, [[router], [i18n]]) as any // FIXME:
       const name = vm.getRouteBaseName()
       assert.equal(name, 'home')
     })
@@ -81,7 +81,7 @@ describe('localePath', () => {
             history: createMemoryHistory()
           })
           await router.push('/en')
-          const vm = useSetup(() => {}, [router, i18n]) as any // FIXME:
+          const vm = useSetup(() => {}, [[router], [i18n]]) as any // FIXME:
 
           // path
           assert.equal(vm.localePath('/'), '/en')
@@ -136,7 +136,7 @@ describe('localePath', () => {
           history: createMemoryHistory()
         })
         await router.push('/')
-        const vm = useSetup(() => {}, [router, i18n]) as any // FIXME:
+        const vm = useSetup(() => {}, [[router], [i18n]]) as any // FIXME:
 
         // path
         assert.equal(vm.localePath('/'), '/')
@@ -189,7 +189,7 @@ describe('localeRoute', () => {
         history: createMemoryHistory()
       })
       await router.push('/en')
-      const vm = useSetup(() => {}, [router, i18n]) as any // FIXME:
+      const vm = useSetup(() => {}, [[router], [i18n]]) as any // FIXME:
 
       // path
       assert.include(vm.localeRoute('/'), {
@@ -286,7 +286,7 @@ describe('localeLocation', () => {
         history: createMemoryHistory()
       })
       await router.push('/en')
-      const vm = useSetup(() => {}, [router, i18n]) as any // FIXME:
+      const vm = useSetup(() => {}, [[router], [i18n]]) as any // FIXME:
 
       // path
       assert.include(vm.localeLocation('/'), {
@@ -408,7 +408,7 @@ describe('switchLocalePath', () => {
         history: createMemoryHistory()
       })
       await router.push('/en/about')
-      const vm = useSetup(() => {}, [router, i18n]) as any // FIXME:
+      const vm = useSetup(() => {}, [[router], [i18n]]) as any // FIXME:
       await router.push('/ja')
 
       assert.equal(vm.switchLocalePath('ja'), '/ja')
@@ -482,7 +482,7 @@ describe('localeHead', () => {
         history: createMemoryHistory()
       })
       await router.push('/en/about')
-      const vm = useSetup(() => {}, [router, i18n]) as any // FIXME:
+      const vm = useSetup(() => {}, [[router], [i18n]]) as any // FIXME:
 
       let head = vm.localeHead({ addDirAttribute: true, addSeoAttributes: true })
       expect(head).toMatchSnapshot('en')

packages/vue-i18n-routing/src/composables/__test__/head.test.ts

@@ -44,7 +44,7 @@ describe('useLocaleHead', () => {
           i18n,
           head
         }
-      }, [router, i18n])
+      }, [[router], [i18n]])
 
       await router.push('/ja')
       expect(vm.head).toMatchSnapshot(vm.i18n.locale.value)
@@ -87,7 +87,7 @@ describe('useLocaleHead', () => {
           i18n,
           head
         }
-      }, [router, i18n])
+      }, [[router], [i18n]])
 
       await router.push('/ja')
       for (const m of vm.head.meta || []) {

packages/vue-i18n-routing/src/composables/__test__/routing.test.ts

@@ -33,7 +33,7 @@ describe('useRouteBaseName', () => {
         const getRouteBaseName = useRouteBaseName()
         const name = getRouteBaseName(route)
         assert.equal(name, 'home')
-      }, [router, i18n])
+      }, [[router], [i18n]])
     })
   })
 
@@ -59,7 +59,7 @@ describe('useRouteBaseName', () => {
         const getRouteBaseName = useRouteBaseName()
         const name = getRouteBaseName({} as Route)
         assert.equal(name, null)
-      }, [router, i18n])
+      }, [[router], [i18n]])
     })
   })
 
@@ -87,7 +87,7 @@ describe('useRouteBaseName', () => {
         const getRouteBaseName = useRouteBaseName({ route, routesNameSeparator: '---' })
         const name = getRouteBaseName()
         assert.equal(name, 'home')
-      }, [router, i18n])
+      }, [[router], [i18n]])
     })
   })
 })
@@ -122,7 +122,7 @@ describe('useLocalePath', () => {
           assert.equal(localePath('not-found'), '/en')
           // object
           assert.equal(localePath({ name: 'about' }, 'ja'), '/ja/about')
-        }, [router, i18n])
+        }, [[router], [i18n]])
       })
     })
   })
@@ -155,7 +155,7 @@ describe('useLocalePath', () => {
         assert.equal(localePath('not-found'), '/')
         // object
         assert.equal(localePath({ name: 'about' }, 'ja'), '/about')
-      }, [router, i18n])
+      }, [[router], [i18n]])
     })
   })
 })
@@ -229,7 +229,7 @@ describe('useLocaleRoute', () => {
         name: 'about___ja',
         href: '/ja/about'
       })
-    }, [router, i18n])
+    }, [[router], [i18n]])
   })
 })
 
@@ -302,7 +302,7 @@ describe('useLocaleLocation', () => {
         name: 'about___ja',
         href: '/ja/about'
       })
-    }, [router, i18n])
+    }, [[router], [i18n]])
   })
 })
 
@@ -333,7 +333,7 @@ describe('useSwitchLocalePath', () => {
       return {
         switchLocalePath: change
       }
-    }, [router, i18n])
+    }, [[router], [i18n]])
 
     await router.push('/ja')
     assert.equal(vm.switchLocalePath('ja'), '/ja')

packages/vue-i18n-routing/src/extends/__test__/i18n.test.ts

@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 
-import { createI18n } from '@intlify/vue-i18n-bridge'
+import { createI18n, useI18n } from '@intlify/vue-i18n-bridge'
 import { vi, describe, it, assert, expect } from 'vitest'
 import { ref, nextTick } from 'vue-demi'
 
@@ -19,7 +19,7 @@ describe('extendI18n', () => {
         localeCodes: ['en', 'ja']
       })
 
-      const vm = useSetup(() => {}, [i18n])
+      const vm = useSetup(() => {}, [[i18n]])
       const composer = i18n.global as unknown as Composer
       assert.deepEqual(composer.locales.value, [{ code: 'en' }, { code: 'ja' }])
       assert.deepEqual(composer.localeCodes.value, ['en', 'ja'])
@@ -36,7 +36,7 @@ describe('extendI18n', () => {
         localeCodes: ['en', 'ja']
       })
 
-      const vm = useSetup(() => {}, [i18n])
+      const vm = useSetup(() => {}, [[i18n]])
       const vueI18n = i18n.global as unknown as VueI18n
       assert.deepEqual(vueI18n.locales, [{ code: 'en' }, { code: 'ja' }])
       assert.deepEqual(vueI18n.localeCodes, ['en', 'ja'])
@@ -69,7 +69,7 @@ describe('extendI18n', () => {
             }
           }
         })
-        const vm = useSetup(() => {}, [i18n])
+        const vm = useSetup(() => {}, [[i18n]])
         const $i18n = (vm as any).$i18n
         const composer = i18n.global as unknown as Composer
 
@@ -119,7 +119,7 @@ describe('extendI18n', () => {
             }
           }
         })
-        const vm = useSetup(() => {}, [i18n])
+        const vm = useSetup(() => {}, [[i18n]])
         const $i18n = (vm as any).$i18n
         const vueI18n = i18n.global as unknown as VueI18n
 
@@ -134,6 +134,57 @@ describe('extendI18n', () => {
       })
     })
   })
+
+  describe('__composerExtend include in plugin options', () => {
+    test('should be extended', async () => {
+      const extendFn = vi.fn()
+      const disposeFn = vi.fn()
+
+      const i18n = createI18n({ legacy: false, globalInjection: true, locale: 'en' })
+      extendI18n(i18n, {
+        locales: [{ code: 'en' }, { code: 'ja' }],
+        localeCodes: ['en', 'ja'],
+        hooks: {
+          onExtendComposer(composer: Composer) {
+            ;(composer as any).fn = extendFn
+          },
+          onExtendExportedGlobal(g) {
+            return {
+              fn: {
+                get() {
+                  return (g as any).fn
+                }
+              }
+            }
+          }
+        }
+      })
+      const pluginOptions = {
+        __composerExtend: (c: Composer) => {
+          ;(c as any).fn = (i18n.global as any).fn
+          return disposeFn
+        }
+      }
+      const vm = useSetup(() => {
+        const i18n = useI18n({
+          useScope: 'local'
+        })
+        ;(i18n as any).fn()
+        return {}
+      }, [[i18n, pluginOptions]])
+      const $i18n = (vm as any).$i18n
+      const composer = i18n.global as any
+
+      $i18n.fn()
+      composer.fn()
+
+      await nextTick()
+      expect(extendFn).toHaveBeenCalledTimes(3)
+
+      vm.unmount()
+      expect(disposeFn).toBeCalledTimes(1)
+    })
+  })
 })
 
 /* eslint-enable @typescript-eslint/no-explicit-any */

packages/vue-i18n-routing/src/extends/i18n.ts

@@ -110,7 +110,7 @@ export function extendI18n<Context = unknown, TI18n extends I18n = I18n>(
       localComposer.baseUrl = computed(() => globalComposer.baseUrl.value)
       let orgComposerDispose: Disposer | undefined
       if (isFunction(orgComposerExtend)) {
-        orgComposerDispose = Reflect.apply(orgComposerExtend, pluginOptions, [globalComposer])
+        orgComposerDispose = Reflect.apply(orgComposerExtend, pluginOptions, [localComposer])
       }
       return () => {
         orgComposerDispose && orgComposerDispose()