fix(markdown): mdx-code-block should support intentation (#10240)

facebook · Jun 20, 2024 · 3a0a2a7 · 3a0a2a7
1 parent 97630b4
commit 3a0a2a7
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 2 deletions.
diff --git a/packages/docusaurus-utils/src/__tests__/markdownUtils.test.ts b/packages/docusaurus-utils/src/__tests__/markdownUtils.test.ts
@@ -1229,6 +1229,36 @@ text\r
     `);
   });
 
+  it('can unwrap indented mdx code block', () => {
+    expect(
+      unwrapMdxCodeBlocks(dedent`
+        # Title
+
+        <div>
+            \`\`\`mdx-code-block
+            content
+            \`\`\`
+        </div>
+
+          \`\`\`\`mdx-code-block
+          content2
+          \`\`\`\`
+
+        text
+    `),
+    ).toEqual(dedent`
+      # Title
+
+      <div>
+          content
+      </div>
+
+        content2
+
+      text
+    `);
+  });
+
   it('works for realistic example', () => {
     expect(
       unwrapMdxCodeBlocks(dedent`

diff --git a/packages/docusaurus-utils/src/markdownUtils.ts b/packages/docusaurus-utils/src/markdownUtils.ts
@@ -70,9 +70,9 @@ export function escapeMarkdownHeadingIds(content: string): string {
 export function unwrapMdxCodeBlocks(content: string): string {
   // We only support 3/4 backticks on purpose, should be good enough
   const regexp3 =
-    /(?<begin>^|\r?\n)```(?<spaces>\x20*)mdx-code-block\r?\n(?<children>.*?)\r?\n```(?<end>\r?\n|$)/gs;
+    /(?<begin>^|\r?\n)(?<indentStart>\x20*)```(?<spaces>\x20*)mdx-code-block\r?\n(?<children>.*?)\r?\n(?<indentEnd>\x20*)```(?<end>\r?\n|$)/gs;
   const regexp4 =
-    /(?<begin>^|\r?\n)````(?<spaces>\x20*)mdx-code-block\r?\n(?<children>.*?)\r?\n````(?<end>\r?\n|$)/gs;
+    /(?<begin>^|\r?\n)(?<indentStart>\x20*)````(?<spaces>\x20*)mdx-code-block\r?\n(?<children>.*?)\r?\n(?<indentEnd>\x20*)````(?<end>\r?\n|$)/gs;
 
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const replacer = (substring: string, ...args: any[]) => {