diff --git a/packages/vue-app/template/App.js b/packages/vue-app/template/App.js index f3ca316ad3..9b6a300f1d 100644 --- a/packages/vue-app/template/App.js +++ b/packages/vue-app/template/App.js @@ -6,6 +6,7 @@ import { globalHandleError } from './utils' <% } %> +<% if (features.layouts && components.ErrorPage) { %>import NuxtError from '<%= components.ErrorPage %>'<% } %> <% if (loading) { %>import NuxtLoading from '<%= (typeof loading === "string" ? loading : "./components/nuxt-loading.vue") %>'<% } %> <% if (buildIndicator) { %>import NuxtBuildIndicator from './components/nuxt-build-indicator'<% } %> <% css.forEach((c) => { %> @@ -35,6 +36,15 @@ export default { render (h, props) { <% if (loading) { %>const loadingEl = h('NuxtLoading', { ref: 'loading' })<% } %> <% if (features.layouts) { %> + <% if (components.ErrorPage) { %> + if (this.nuxt.err && NuxtError.layout) { + this.setLayout( + typeof NuxtError.layout === 'function' + ? NuxtError.layout(this.context) + : NuxtError.layout + ) + } + <% } %> const layoutEl = h(this.layout || 'nuxt') const templateEl = h('div', { domProps: { diff --git a/test/e2e/error.test.js b/test/e2e/error.test.js index d997398c57..e9f31c6ea5 100644 --- a/test/e2e/error.test.js +++ b/test/e2e/error.test.js @@ -32,6 +32,7 @@ describe('basic browser', () => { test('/squared doesnt loop due to error on error page', async () => { await page.nuxt.navigate('/squared') + expect(await page.$text('header')).toBe('Error layout') expect(await page.$text('h2')).toBe('An error occured while showing the error page') }) diff --git a/test/fixtures/error/layouts/error-layout.vue b/test/fixtures/error/layouts/error-layout.vue new file mode 100644 index 0000000000..91cee17bd5 --- /dev/null +++ b/test/fixtures/error/layouts/error-layout.vue @@ -0,0 +1,12 @@ + + + diff --git a/test/fixtures/error/layouts/error.vue b/test/fixtures/error/layouts/error.vue index f024b262a9..b9441b040e 100644 --- a/test/fixtures/error/layouts/error.vue +++ b/test/fixtures/error/layouts/error.vue @@ -11,6 +11,7 @@