diff --git a/packages/docusaurus-theme-classic/src/theme/MDXComponents/Details.tsx b/packages/docusaurus-theme-classic/src/theme/MDXComponents/Details.tsx
index d09f2d923f634..8ae874a7a23e3 100644
--- a/packages/docusaurus-theme-classic/src/theme/MDXComponents/Details.tsx
+++ b/packages/docusaurus-theme-classic/src/theme/MDXComponents/Details.tsx
@@ -13,9 +13,8 @@ export default function MDXDetails(props: Props): JSX.Element {
   const items = React.Children.toArray(props.children) as ReactElement[];
   // Split summary item from the rest to pass it as a separate prop to the
   // Details theme component
-  const summary: ReactElement<ComponentProps<'summary'>> = items.find(
-    (item) => item?.props?.mdxType === 'summary',
-  )!;
+  const summary: ReactElement<ComponentProps<'summary'>> | undefined =
+    items.find((item) => item?.props?.mdxType === 'summary');
   const children = <>{items.filter((item) => item !== summary)}</>;
 
   return (
diff --git a/packages/docusaurus-theme-common/src/components/Details/index.tsx b/packages/docusaurus-theme-common/src/components/Details/index.tsx
index 1f330edec9a79..5288622062017 100644
--- a/packages/docusaurus-theme-common/src/components/Details/index.tsx
+++ b/packages/docusaurus-theme-common/src/components/Details/index.tsx
@@ -91,7 +91,7 @@ export function Details({
           // setOpen(false);
         }
       }}>
-      {summary}
+      {summary || <summary>Details</summary>}
 
       <Collapsible
         lazy={false} // Content might matter for SEO in this case