From 3a971d0b36bed037b3258b0f1f0626cae2361d91 Mon Sep 17 00:00:00 2001
From: Mehdi HosseinZade <arshen@outlook.com>
Date: Tue, 21 Mar 2023 01:16:12 +0330
Subject: [PATCH] fix(nuxt): observe slot element in custom nuxt-link (#19802)

---
 packages/nuxt/src/app/components/nuxt-link.ts | 6 ++++--
 test/bundle.test.ts                           | 2 +-
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/packages/nuxt/src/app/components/nuxt-link.ts b/packages/nuxt/src/app/components/nuxt-link.ts
index 1d384499af..4103a0d74e 100644
--- a/packages/nuxt/src/app/components/nuxt-link.ts
+++ b/packages/nuxt/src/app/components/nuxt-link.ts
@@ -198,13 +198,15 @@ export function defineNuxtLink (options: NuxtLinkOptions) {
       // Prefetching
       const prefetched = ref(false)
       const el = process.server ? undefined : ref<HTMLElement | null>(null)
+      const elRef = process.server ? undefined : (ref: any) => { el!.value = props.custom ? ref?.$el?.nextElementSibling : ref?.$el }
+
       if (process.client) {
         checkPropConflicts(props, 'prefetch', 'noPrefetch')
         const shouldPrefetch = props.prefetch !== false && props.noPrefetch !== true && props.target !== '_blank' && !isSlowConnection()
         if (shouldPrefetch) {
           const nuxtApp = useNuxtApp()
           let idleId: number
-          let unobserve: (() => void)| null = null
+          let unobserve: (() => void) | null = null
           onMounted(() => {
             const observer = useObserver()
             onNuxtReady(() => {
@@ -236,7 +238,7 @@ export function defineNuxtLink (options: NuxtLinkOptions) {
       return () => {
         if (!isExternal.value) {
           const routerLinkProps: Record<string, any> = {
-            ref: process.server ? undefined : (ref: any) => { el!.value = ref?.$el },
+            ref: elRef,
             to: to.value,
             activeClass: props.activeClass || options.activeClass,
             exactActiveClass: props.exactActiveClass || options.exactActiveClass,
diff --git a/test/bundle.test.ts b/test/bundle.test.ts
index 2520fcd29d..36a129e68a 100644
--- a/test/bundle.test.ts
+++ b/test/bundle.test.ts
@@ -26,7 +26,7 @@ describe.skipIf(isWindows)('minimal nuxt application', () => {
 
   it('default client bundle size', async () => {
     stats.client = await analyzeSizes('**/*.js', publicDir)
-    expect(stats.client.totalBytes).toBeLessThan(106600)
+    expect(stats.client.totalBytes).toBeLessThan(106650)
     expect(stats.client.files.map(f => f.replace(/\..*\.js/, '.js'))).toMatchInlineSnapshot(`
       [
         "_nuxt/_plugin-vue_export-helper.js",