fix: twoslash code block parsing

antfu · antfu · commit 89f05bf59631 · 2026-01-07T20:26:47.000+09:00
diff --git a/packages/slidev/node/syntax/transform/code-wrapper.ts b/packages/slidev/node/syntax/transform/code-wrapper.ts
@@ -2,7 +2,7 @@ import type { MarkdownTransformContext } from '@slidev/types'
 import { normalizeRangeStr } from './utils'
 
 // eslint-disable-next-line regexp/no-super-linear-backtracking
-export const reCodeBlock = /^```([\w'-]+)?[ \t]*(?:\[(.*?)\])?[ \t]*(?:\{([\w*,|-]+)\}[ \t]*(\{[^}]*\})?([^\r\n]*))?\r?\n((?:(?!^```)[\s\S])*?)^```$/gm
+export const reCodeBlock = /^```([\w '-]+)?[ \t]*(?:\[(.*?)\])?[ \t]*(?:\{([\w*,|-]+)\}[ \t]*(\{[^}]*\})?([^\r\n]*))?\r?\n((?:(?!^```)[\s\S])*?)^```$/gm
 
 /**
  * Transform code block with wrapper
diff --git a/test/__snapshots__/transform-all.test.ts.snap b/test/__snapshots__/transform-all.test.ts.snap
@@ -9,7 +9,7 @@ Default Slot
 
 <CodeBlockWrapper v-bind="{lines:true}" :title='""' :ranges='["2","3","4"]'>
 
-\`\`\`ts
+\`\`\`ts 
 function _foo() {
   // ...
 }
@@ -44,7 +44,7 @@ Foo \`{{ code }}\`
 
 <CodeBlockWrapper v-bind="{}" :title='"with-title"' :ranges='[]'>
 
-\`\`\`js [with-title]
+\`\`\`js  [with-title]
 const a = 1
 \`\`\`
 
@@ -55,7 +55,7 @@ const a = 1
 
 <CodeBlockWrapper v-bind="{}" :title='"npm"' :ranges='[]'>
 
-\`\`\`sh [npm]
+\`\`\`sh  [npm]
 npm i slidev
 \`\`\`
 
@@ -64,7 +64,7 @@ npm i slidev
 
 <CodeBlockWrapper v-bind="{}" :title='"yarn"' :ranges='[]'>
 
-\`\`\`sh [yarn]
+\`\`\`sh  [yarn]
 yarn add slidev
 \`\`\`
 
@@ -73,7 +73,7 @@ yarn add slidev
 
 <CodeBlockWrapper v-bind="{}" :title='"pnpm"' :ranges='[]'>
 
-\`\`\`sh [pnpm]
+\`\`\`sh  [pnpm]
 pnpm add slidev
 \`\`\`
 
@@ -88,7 +88,7 @@ pnpm add slidev
 
 <CodeBlockWrapper v-bind="{}" :title='""' :ranges='[]'>
 
-\`\`\`ts
+\`\`\`ts 
 function _foo() {
   // ...
 }
diff --git a/test/__snapshots__/transform.test.ts.snap b/test/__snapshots__/transform.test.ts.snap
@@ -19,7 +19,7 @@ exports[`code-wrapper with title and square brackets in code 1`] = `
 
 <CodeBlockWrapper v-bind="{}" :title='"MyEnum.cs"' :ranges='[]'>
 
-\`\`\`csharp [MyEnum.cs]
+\`\`\`csharp  [MyEnum.cs]
 [Flags]
 enum MyEnum {}
 \`\`\`
@@ -28,6 +28,31 @@ enum MyEnum {}
 "
 `;
 
+exports[`code-wrapper with twoslash 1`] = `
+"
+
+
+
+<CodeBlockWrapper v-bind="{}" :title='"filename.ts"' :ranges='[]'>
+
+\`\`\`ts  [filename.ts]
+const a = 1
+\`\`\`
+
+</CodeBlockWrapper>
+
+
+<CodeBlockWrapper v-bind="{}" :title='"filename.ts"' :ranges='[]'>
+
+\`\`\`ts twoslash  [filename.ts]
+const a = 1
+\`\`\`
+
+</CodeBlockWrapper>
+
+"
+`;
+
 exports[`external snippet 1`] = `
 "
 \`\`\`ts {2|3|4}{lines:true}
diff --git a/test/transform.test.ts b/test/transform.test.ts
@@ -203,3 +203,22 @@ enum MyEnum {}
 
   expect(ctx.s.toString()).toMatchSnapshot()
 })
+
+it('code-wrapper with twoslash', () => {
+  const ctx = createTransformContext(`
+
+
+\`\`\`ts [filename.ts]
+const a = 1
+\`\`\`
+
+\`\`\`ts twoslash [filename.ts]
+const a = 1
+\`\`\`
+
+`)
+
+  transformCodeWrapper(ctx)
+
+  expect(ctx.s.toString()).toMatchSnapshot()
+})
