From 5af92b91ea5eb29635b5a64f74be5082eac3bb01 Mon Sep 17 00:00:00 2001 From: sebastien Date: Thu, 15 Feb 2024 16:52:45 +0100 Subject: [PATCH 1/2] Ensure core error boundary is able to render layout --- .../src/client/theme-fallback/Error/index.tsx | 38 +++++++++++++------ 1 file changed, 26 insertions(+), 12 deletions(-) diff --git a/packages/docusaurus/src/client/theme-fallback/Error/index.tsx b/packages/docusaurus/src/client/theme-fallback/Error/index.tsx index 79ace57d7627..4e143065b79b 100644 --- a/packages/docusaurus/src/client/theme-fallback/Error/index.tsx +++ b/packages/docusaurus/src/client/theme-fallback/Error/index.tsx @@ -8,12 +8,13 @@ // Should we translate theme-fallback? /* eslint-disable @docusaurus/no-untranslated-text */ -import React from 'react'; +import React, {type ReactNode} from 'react'; import Head from '@docusaurus/Head'; import ErrorBoundary from '@docusaurus/ErrorBoundary'; import {getErrorCausalChain} from '@docusaurus/utils-common'; import Layout from '@theme/Layout'; import type {Props} from '@theme/Error'; +import {RouteContextProvider} from '../../routeContext'; function ErrorDisplay({error, tryAgain}: Props): JSX.Element { return ( @@ -54,21 +55,34 @@ function ErrorBoundaryError({error}: {error: Error}): JSX.Element { return

{fullMessage}

; } +function ErrorRouteContextProvider({children}: {children: ReactNode}) { + return ( + + {children} + + ); +} + export default function Error({error, tryAgain}: Props): JSX.Element { // We wrap the error in its own error boundary because the layout can actually // throw too... Only the ErrorDisplay component is simple enough to be // considered safe to never throw return ( - }> - - Page Error - - - - - + + }> + + Page Error + + + + + + ); } From 428684f5e83902b3099ba1367983969794616aa8 Mon Sep 17 00:00:00 2001 From: sebastien Date: Thu, 15 Feb 2024 17:04:05 +0100 Subject: [PATCH 2/2] add useful comment --- packages/docusaurus/src/client/theme-fallback/Error/index.tsx | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/packages/docusaurus/src/client/theme-fallback/Error/index.tsx b/packages/docusaurus/src/client/theme-fallback/Error/index.tsx index 4e143065b79b..2ad45b7339df 100644 --- a/packages/docusaurus/src/client/theme-fallback/Error/index.tsx +++ b/packages/docusaurus/src/client/theme-fallback/Error/index.tsx @@ -55,6 +55,10 @@ function ErrorBoundaryError({error}: {error: Error}): JSX.Element { return

{fullMessage}

; } +// A bit hacky: we need to add an artificial RouteContextProvider here +// The goal is to be able to render the error inside the theme layout +// Without this, our theme classic would crash due to lack of route context +// See also https://github.com/facebook/docusaurus/pull/9852 function ErrorRouteContextProvider({children}: {children: ReactNode}) { return (