From 0db3c6373a72e218baddfc3626695173da103a88 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Sat, 14 Jan 2023 01:27:38 +0000
Subject: [PATCH] fix(nuxt): name anonymous components in render tree (#10011)

---
 packages/nuxt/src/app/components/layout.ts | 2 ++
 packages/nuxt/src/app/components/utils.ts  | 1 +
 packages/nuxt/src/pages/runtime/page.ts    | 5 +++--
 3 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/packages/nuxt/src/app/components/layout.ts b/packages/nuxt/src/app/components/layout.ts
index d630a40d3b..8a75c81737 100644
--- a/packages/nuxt/src/app/components/layout.ts
+++ b/packages/nuxt/src/app/components/layout.ts
@@ -12,6 +12,7 @@ import { appLayoutTransition as defaultLayoutTransition } from '#build/nuxt.conf
 
 // TODO: revert back to defineAsyncComponent when https://github.com/vuejs/core/issues/6638 is resolved
 const LayoutLoader = defineComponent({
+  name: 'LayoutLoader',
   inheritAttrs: false,
   props: {
     name: String,
@@ -42,6 +43,7 @@ const LayoutLoader = defineComponent({
   }
 })
 export default defineComponent({
+  name: 'NuxtLayout',
   inheritAttrs: false,
   props: {
     name: {
diff --git a/packages/nuxt/src/app/components/utils.ts b/packages/nuxt/src/app/components/utils.ts
index 94a8a10695..589890b466 100644
--- a/packages/nuxt/src/app/components/utils.ts
+++ b/packages/nuxt/src/app/components/utils.ts
@@ -2,6 +2,7 @@ import { defineComponent, h } from 'vue'
 import type { Component } from 'vue'
 
 const Fragment = defineComponent({
+  name: 'FragmentWrapper',
   setup (_props, { slots }) {
     return () => slots.default?.()
   }
diff --git a/packages/nuxt/src/pages/runtime/page.ts b/packages/nuxt/src/pages/runtime/page.ts
index 4ccebb3d22..4d466bf8ea 100644
--- a/packages/nuxt/src/pages/runtime/page.ts
+++ b/packages/nuxt/src/pages/runtime/page.ts
@@ -56,7 +56,7 @@ export default defineComponent({
             wrapInKeepAlive(props.keepalive ?? routeProps.route.meta.keepalive ?? (defaultKeepaliveConfig as KeepAliveProps), h(Suspense, {
               onPending: () => nuxtApp.callHook('page:start', routeProps.Component),
               onResolve: () => { nextTick(() => nuxtApp.callHook('page:finish', routeProps.Component).finally(done)) }
-            }, { default: () => h(Component, { key, routeProps, pageKey: key, hasTransition } as {}) })
+            }, { default: () => h(RouteProvider, { key, routeProps, pageKey: key, hasTransition } as {}) })
             )).default()
         }
       })
@@ -84,7 +84,8 @@ function _mergeTransitionProps (routeProps: TransitionProps[]): TransitionProps
   return defu(..._props)
 }
 
-const Component = defineComponent({
+const RouteProvider = defineComponent({
+  name: 'RouteProvider',
   // TODO: Type props
   // eslint-disable-next-line vue/require-prop-types
   props: ['routeProps', 'pageKey', 'hasTransition'],