From c8096818cab6cb1244f47f29b4c853264d4ebe94 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Tue, 6 Sep 2022 15:43:17 +0100
Subject: [PATCH] fix(nuxt): don't override payload error if it is present

---
 .../nuxt/src/core/runtime/nitro/renderer.ts   |  3 +-
 test/basic.test.ts                            | 49 ++++++++++---------
 test/fixtures/basic/pages/error.vue           | 15 +++++-
 3 files changed, 40 insertions(+), 27 deletions(-)

diff --git a/packages/nuxt/src/core/runtime/nitro/renderer.ts b/packages/nuxt/src/core/runtime/nitro/renderer.ts
index d26d6f48e3a..ce6c682ff1f 100644
--- a/packages/nuxt/src/core/runtime/nitro/renderer.ts
+++ b/packages/nuxt/src/core/runtime/nitro/renderer.ts
@@ -124,7 +124,8 @@ export default defineRenderHandler(async (event) => {
   const renderer = (process.env.NUXT_NO_SSR || ssrContext.noSSR) ? await getSPARenderer() : await getSSRRenderer()
   const _rendered = await renderer.renderToString(ssrContext).catch((err) => {
     if (!ssrError) {
-      throw err
+      // Use explicitly thrown error in preference to subsequent rendering errors
+      throw ssrContext.payload?.error || err
     }
   })
   await ssrContext.nuxt?.hooks.callHook('app:rendered', { ssrContext })
diff --git a/test/basic.test.ts b/test/basic.test.ts
index d15b0919376..e236183e0b5 100644
--- a/test/basic.test.ts
+++ b/test/basic.test.ts
@@ -202,30 +202,6 @@ describe('navigate external', () => {
   })
 })
 
-describe('errors', () => {
-  it('should render a JSON error page', async () => {
-    const res = await fetch('/error', {
-      headers: {
-        accept: 'application/json'
-      }
-    })
-    expect(res.status).toBe(500)
-    const error = await res.json()
-    delete error.stack
-    expect(error).toMatchObject({
-      message: 'This is a custom error',
-      statusCode: 500,
-      statusMessage: 'Internal Server Error',
-      url: '/error'
-    })
-  })
-
-  it('should render a HTML error page', async () => {
-    const res = await fetch('/error')
-    expect(await res.text()).toContain('This is a custom error')
-  })
-})
-
 describe('middlewares', () => {
   it('should redirect to index with global middleware', async () => {
     const html = await $fetch('/redirect/')
@@ -592,3 +568,28 @@ describe('useAsyncData', () => {
     await expectNoClientErrors('/useAsyncData/promise-all')
   })
 })
+
+// TODO: Move back up after https://github.com/vuejs/core/issues/6110 is resolved
+describe('errors', () => {
+  it('should render a JSON error page', async () => {
+    const res = await fetch('/error', {
+      headers: {
+        accept: 'application/json'
+      }
+    })
+    expect(res.status).toBe(422)
+    const error = await res.json()
+    delete error.stack
+    expect(error).toMatchObject({
+      message: 'This is a custom error',
+      statusCode: 422,
+      statusMessage: 'This is a custom error',
+      url: '/error'
+    })
+  })
+
+  it('should render a HTML error page', async () => {
+    const res = await fetch('/error')
+    expect(await res.text()).toContain('This is a custom error')
+  })
+})
diff --git a/test/fixtures/basic/pages/error.vue b/test/fixtures/basic/pages/error.vue
index 6956f590019..a8fe5801bd5 100644
--- a/test/fixtures/basic/pages/error.vue
+++ b/test/fixtures/basic/pages/error.vue
@@ -1,7 +1,18 @@
 <template>
-  <div />
+  <div>
+    {{ state.attr }}
+    {{ data.something }}
+  </div>
 </template>
 
 <script setup>
-throw new Error('This is a custom error')
+const { data, error } = await useAsyncData(() => {
+  throw new Error('some error')
+}, { server: true })
+
+if (error.value) {
+  throw createError({ statusCode: 422, fatal: true, statusMessage: 'This is a custom error' })
+}
+
+const state = ref({ attr: 'Hello World' })
 </script>