From cef64e642fb26076d42ca1342c0cf23a1b3384b7 Mon Sep 17 00:00:00 2001
From: spencerHT <spencerHT@users.noreply.github.com>
Date: Mon, 14 Aug 2023 08:20:39 +0800
Subject: [PATCH] fix(markdown): replace double quotation marks in
 classname(fix #3152) (#3154)

Co-authored-by: xuze <xuze@bytedance.com>
---
 .../__tests__/__snapshots__/preWrapper.spec.js.snap    | 10 ++++++++++
 .../code-prewrapper-with-double-quotation-marks.md     |  3 +++
 .../@vuepress/markdown/__tests__/preWrapper.spec.js    |  6 ++++++
 packages/@vuepress/markdown/lib/preWrapper.js          |  3 ++-
 4 files changed, 21 insertions(+), 1 deletion(-)
 create mode 100644 packages/@vuepress/markdown/__tests__/fragments/code-prewrapper-with-double-quotation-marks.md

diff --git a/packages/@vuepress/markdown/__tests__/__snapshots__/preWrapper.spec.js.snap b/packages/@vuepress/markdown/__tests__/__snapshots__/preWrapper.spec.js.snap
index 562cc6c467..9c8d44c49d 100644
--- a/packages/@vuepress/markdown/__tests__/__snapshots__/preWrapper.spec.js.snap
+++ b/packages/@vuepress/markdown/__tests__/__snapshots__/preWrapper.spec.js.snap
@@ -1,5 +1,15 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`preWrapper should wrap code with double quotation marks 1`] = `
+<!--beforebegin-->
+<div class="language-js name='marks' extra-class">
+  <!--afterbegin--><pre><code class="language-js">new Vue()
+</code></pre>
+  <!--beforeend-->
+</div>
+<!--afterend-->
+`;
+
 exports[`preWrapper should wrap code with quadruple space 1`] = `
 <!--beforebegin-->
 <div class="language- extra-class">
diff --git a/packages/@vuepress/markdown/__tests__/fragments/code-prewrapper-with-double-quotation-marks.md b/packages/@vuepress/markdown/__tests__/fragments/code-prewrapper-with-double-quotation-marks.md
new file mode 100644
index 0000000000..212a8d56a0
--- /dev/null
+++ b/packages/@vuepress/markdown/__tests__/fragments/code-prewrapper-with-double-quotation-marks.md
@@ -0,0 +1,3 @@
+``` js name="marks"
+new Vue()
+```
diff --git a/packages/@vuepress/markdown/__tests__/preWrapper.spec.js b/packages/@vuepress/markdown/__tests__/preWrapper.spec.js
index 9ba0c482a4..37c0f9364c 100644
--- a/packages/@vuepress/markdown/__tests__/preWrapper.spec.js
+++ b/packages/@vuepress/markdown/__tests__/preWrapper.spec.js
@@ -21,4 +21,10 @@ describe('preWrapper', () => {
     expect(output1 === output2).toBe(false)
     expect(output2).toMatchSnapshot()
   })
+
+  test('should wrap code with double quotation marks', () => {
+    const input = getFragment(__dirname, 'code-prewrapper-with-double-quotation-marks.md')
+    const output2 = mdP.render(input)
+    expect(output2).toMatchSnapshot()
+  })
 })
diff --git a/packages/@vuepress/markdown/lib/preWrapper.js b/packages/@vuepress/markdown/lib/preWrapper.js
index 4190fe11a1..7e5af312c3 100644
--- a/packages/@vuepress/markdown/lib/preWrapper.js
+++ b/packages/@vuepress/markdown/lib/preWrapper.js
@@ -12,7 +12,8 @@ module.exports = md => {
     const [tokens, idx] = args
     const token = tokens[idx]
     const rawCode = wrapped(...args)
-    return `<!--beforebegin--><div class="language-${token.info.trim()} extra-class">`
+    const tokenInfo = token.info.trim().replace(/\"/g, '\'')
+    return `<!--beforebegin--><div class="language-${tokenInfo} extra-class">`
     + `<!--afterbegin-->${rawCode}<!--beforeend--></div><!--afterend-->`
   }
   const { fence, code_block: codeBlock } = md.renderer.rules