feat: call global vue errorHandler in fetch and asyncData (#3652)

resolve #3335

lib/app/client.js

@@ -13,7 +13,9 @@ import {
   promisify,
   getLocation,
   compile,
-  getQueryDiff
+  getQueryDiff,
+  globalHandleError,
+  empty
 } from './utils'
 
 const noopData = () => { return {} }
@@ -348,6 +350,8 @@ async function render (to, from, next) {
             }
             <% } %>
           })
+          // error will be handled in try catch
+          .catch(empty)
         promises.push(promise)
       }
 
@@ -367,6 +371,8 @@ async function render (to, from, next) {
             }
             <% } %>
           })
+          // error will be handled in try catch
+          .catch(empty)
           promises.push(p)
       }
 
@@ -391,6 +397,8 @@ async function render (to, from, next) {
     const errorResponseStatus = (error.response && error.response.status)
     error.statusCode = error.statusCode || error.status || errorResponseStatus || 500
 
+    globalHandleError(error)
+
     // Load error layout
     let layout = NuxtError.layout
     if (typeof layout === 'function') {

lib/app/utils.js

@@ -11,6 +11,14 @@ if (process.browser) {
   }
 }
 
+export function empty() {}
+
+export function globalHandleError(error) {
+  if (Vue.config.errorHandler) {
+    Vue.config.errorHandler(error)
+  }
+}
+
 export function applyAsyncData(Component, asyncData) {
   const ComponentData = Component.options.data || noopData
   // Prevent calling this method for each request on SSR context

test/fixtures/spa/nuxt.config.js

@@ -5,5 +5,8 @@ export default {
     http2: {
       push: true
     }
-  }
+  },
+  plugins: [
+    '~/plugins/error.js'
+  ]
 }

test/fixtures/spa/pages/error-handler.vue

@@ -0,0 +1,8 @@
+<script>
+
+export default {
+  fetch() {
+    throw Error('spa test error!')
+  }
+}
+</script>

test/fixtures/spa/plugins/error.js

@@ -0,0 +1,5 @@
+import Vue from 'vue'
+
+Vue.config.errorHandler = function () {
+  document.body.appendChild(document.createTextNode('error handler triggered'))
+}

test/unit/spa.test.js

@@ -43,6 +43,12 @@ describe('spa', () => {
     expect(html).toMatch('<h1>Test: updated</h1>')
   })
 
+  test('/error-handler', async () => {
+    await renderRoute('/error-handler')
+    const { html } = await renderRoute('/error-handler')
+    expect(html).toMatch('error handler triggered')
+  })
+
   test('/_nuxt/ (access publicPath in spa mode)', async () => {
     await expect(renderRoute('/_nuxt/')).rejects.toMatchObject({
       response: {