fix(nuxt): throw errors when running legacy asyncData (#20535)

packages/nuxt/src/app/composables/component.ts

@@ -5,6 +5,7 @@ import type { NuxtApp } from '../nuxt'
 import { callWithNuxt, useNuxtApp } from '../nuxt'
 import { useAsyncData } from './asyncData'
 import { useRoute } from './router'
+import { createError } from './error'
 
 export const NuxtComponentIndicator = '__nuxt_component'
 
@@ -14,7 +15,10 @@ async function runLegacyAsyncData (res: Record<string, any> | Promise<Record<str
   const vm = getCurrentInstance()!
   const { fetchKey } = vm.proxy!.$options
   const key = typeof fetchKey === 'function' ? fetchKey(() => '') : fetchKey || route.fullPath
-  const { data } = await useAsyncData(`options:asyncdata:${key}`, () => callWithNuxt(nuxt, fn, [nuxt]))
+  const { data, error } = await useAsyncData(`options:asyncdata:${key}`, () => callWithNuxt(nuxt, fn, [nuxt]))
+  if (error.value) {
+    throw createError(error.value)
+  }
   if (data.value && typeof data.value === 'object') {
     Object.assign(await res, toRefs(reactive(data.value)))
   } else if (process.dev) {

test/basic.test.ts

@@ -353,6 +353,13 @@ describe('pages', () => {
     await page.waitForLoadState('networkidle')
     expect(await page.locator('#async-server-component-count').innerHTML()).toContain(('1'))
     expect(await page.locator('#long-async-component-count').innerHTML()).toContain('1')
+    await page.close()
+  })
+
+  it('/legacy-async-data-fail', async () => {
+    const response = await fetch('/legacy-async-data-fail').then(r => r.text())
+    expect(response).not.toContain('don\'t look at this')
+    expect(response).toContain('OH NNNNNNOOOOOOOOOOO')
   })
 })
 

test/fixtures/basic/pages/legacy-async-data-fail.vue

@@ -0,0 +1,13 @@
+<template>
+  <div>
+    don't look at this
+  </div>
+</template>
+
+<script lang="ts">
+export default defineNuxtComponent({
+  asyncData () {
+    throw new Error('OH NNNNNNOOOOOOOOOOO')
+  }
+})
+</script>