From d0f2e42c3458202e87ace0ff80902e443ffd0f7f Mon Sep 17 00:00:00 2001 From: Diogo Correia Date: Tue, 30 Jun 2020 16:52:55 +0100 Subject: [PATCH] fix($markdown): line highlighting not working correctly when importing code snippets (#2441) --- .../__snapshots__/snippet.spec.js.snap | 82 +++++++++++-------- ...ppet-highlightLines-single-and-multiple.md | 1 + .../markdown/__tests__/snippet.spec.js | 6 ++ packages/@vuepress/markdown/lib/snippet.js | 2 +- 4 files changed, 54 insertions(+), 37 deletions(-) create mode 100644 packages/@vuepress/markdown/__tests__/fragments/code-snippet-highlightLines-single-and-multiple.md diff --git a/packages/@vuepress/markdown/__tests__/__snapshots__/snippet.spec.js.snap b/packages/@vuepress/markdown/__tests__/__snapshots__/snippet.spec.js.snap index bae5b09699..29aa2ee8cb 100644 --- a/packages/@vuepress/markdown/__tests__/__snapshots__/snippet.spec.js.snap +++ b/packages/@vuepress/markdown/__tests__/__snapshots__/snippet.spec.js.snap @@ -1,6 +1,13 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`snippet import snippets when the file has a space in the file path 1`] = ` +exports[`snippet import snippet 1`] = ` +
export default function () {
+  // ..
+}
+
+`; + +exports[`snippet import snippet with highlight multiple lines 1`] = `
 
 
@@ -10,15 +17,34 @@ exports[`snippet import snippets when the file has a space in the file path 1`] } `; -exports[`snippet import snippet 1`] = ` -
export default function () {
-  // ..
+exports[`snippet import snippet with highlight single and multiple lines 1`] = `
+

+  
 

+  
 

+  
 


+
export default function () {
+// ..
 }
-
`; -exports[`snippet import snippet with region and highlight 1`] = ` -
function foo () {
+exports[`snippet import snippet with highlight single line 1`] = `
+

+  
 


+  
 


+
export default function () {
+// ..
+}
+`;
+
+exports[`snippet import snippet with indented region 1`] = `
+
<section>
+  <h1>Hello World</h1>
+</section>
+<div>Lorem Ipsum</div>

+`;
+
+exports[`snippet import snippet with region 1`] = `
+
function foo () {
   return ({
     dest: '../../vuepress',
     locales: {
@@ -48,34 +74,8 @@ exports[`snippet import snippet with region and highlight 1`] = `
 }

 `;
 
-exports[`snippet import snippet with highlight multiple lines 1`] = `
-

-  
 

-  
 

-  
 


-
export default function () {
-// ..
-}
-`;
-
-exports[`snippet import snippet with highlight single line 1`] = `
-

-  
 


-  
 


-
export default function () {
-// ..
-}
-`;
-
-exports[`snippet import snippet with indented region 1`] = `
-
<section>
-  <h1>Hello World</h1>
-</section>
-<div>Lorem Ipsum</div>

-`;
-
-exports[`snippet import snippet with region 1`] = `
-
function foo () {
+exports[`snippet import snippet with region and highlight 1`] = `
+
function foo () {
   return ({
     dest: '../../vuepress',
     locales: {
@@ -105,7 +105,7 @@ exports[`snippet import snippet with region 1`] = `
 }

 `;
 
-exports[`snippet import snippet with region and single line highlight > 10 1`]  = `
+exports[`snippet import snippet with region and single line highlight > 10 1`] = `
 
function foo () {
   return ({
     dest: '../../vuepress',
@@ -135,3 +135,13 @@ exports[`snippet import snippet with region and single line highlight > 10 1`]
   })
 }

 `;
+
+exports[`snippet import snippets when the file has a space in the file path 1`] = `
+

+  
 

+  
 

+  
 


+
export default function () {
+// ..
+}
+`;
diff --git a/packages/@vuepress/markdown/__tests__/fragments/code-snippet-highlightLines-single-and-multiple.md b/packages/@vuepress/markdown/__tests__/fragments/code-snippet-highlightLines-single-and-multiple.md
new file mode 100644
index 0000000000..9dc58e2c7e
--- /dev/null
+++ b/packages/@vuepress/markdown/__tests__/fragments/code-snippet-highlightLines-single-and-multiple.md
@@ -0,0 +1 @@
+<<< @/packages/@vuepress/markdown/__tests__/fragments/snippet.js{1-2,3}
diff --git a/packages/@vuepress/markdown/__tests__/snippet.spec.js b/packages/@vuepress/markdown/__tests__/snippet.spec.js
index af018be673..df04e10449 100644
--- a/packages/@vuepress/markdown/__tests__/snippet.spec.js
+++ b/packages/@vuepress/markdown/__tests__/snippet.spec.js
@@ -25,6 +25,12 @@ describe('snippet', () => {
     expect(output).toMatchSnapshot()
   })
 
+  test('import snippet with highlight single and multiple lines', () => {
+    const input = getFragment(__dirname, 'code-snippet-highlightLines-single-and-multiple.md')
+    const output = mdH.render(input)
+    expect(output).toMatchSnapshot()
+  })
+
   test('import snippets when the file has a space in the file path', () => {
     const input = getFragment(__dirname, 'code-snippet-with-space-in-path.md')
     const output = mdH.render(input)
diff --git a/packages/@vuepress/markdown/lib/snippet.js b/packages/@vuepress/markdown/lib/snippet.js
index 037498d336..cc0366242f 100644
--- a/packages/@vuepress/markdown/lib/snippet.js
+++ b/packages/@vuepress/markdown/lib/snippet.js
@@ -137,7 +137,7 @@ module.exports = function snippet (md, options = {}) {
      *
      * captures: ['/path/to/file.extension', 'extension', '#region', '{meta}']
      */
-    const rawPathRegexp = /^(.+(?:\.([a-z]+)))(?:(#[\w-]+))?(?: ?({\d+(?:[,-]\d+)?}))?$/
+    const rawPathRegexp = /^(.+(?:\.([a-z]+)))(?:(#[\w-]+))?(?: ?({\d+(?:[,-]\d+)*}))?$/
 
     const rawPath = state.src.slice(start, end).trim().replace(/^@/, root).trim()
     const [filename = '', extension = '', region = '', meta = ''] = (rawPathRegexp.exec(rawPath) || []).slice(1)