test: Code snippet & highlighted code snippets

Author: znck

lib/markdown/snippet.js

@@ -1,8 +1,8 @@
 const fs = require('fs')
 
-module.exports = function codeFrame(md, options = {}) {
+module.exports = function snippet (md, options = {}) {
   const root = options.root || process.cwd()
-  function parser(state, startLine, endLine, silent) {
+  function parser (state, startLine, endLine, silent) {
     const CH = '<'.charCodeAt(0)
     const pos = state.bMarks[startLine] + state.tShift[startLine]
     const max = state.eMarks[startLine]
@@ -28,9 +28,9 @@ module.exports = function codeFrame(md, options = {}) {
     const content = fs.existsSync(filename) ? fs.readFileSync(filename).toString() : 'Not found: ' + filename
     const meta = rawPath.replace(filename, '')
 
-    state.line = startLine + 1;
+    state.line = startLine + 1
 
-    token = state.push('fence', 'code', 0)
+    const token = state.push('fence', 'code', 0)
     token.info = filename.split('.').pop() + meta
     token.content = content
     token.markup = '```'
@@ -39,5 +39,5 @@ module.exports = function codeFrame(md, options = {}) {
     return true
   }
 
-  md.block.ruler.before('fence', 'code-frame', parser)
+  md.block.ruler.before('fence', 'snippet', parser)
 }

test/markdown/__snapshots__/snippet.spec.js.snap

@@ -0,0 +1,23 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`snippet import snippet 1`] = `
+<pre><code class="language-js">export default function () {
+  // ..
+}</code></pre>
+`;
+
+exports[`snippet import snippet with highlight multiple lines 1`] = `
+<div class="highlight-lines">
+  <div class="highlighted">&nbsp;</div>
+  <div class="highlighted">&nbsp;</div>
+  <div class="highlighted">&nbsp;</div>
+</div>export default function () { // .. }
+`;
+
+exports[`snippet import snippet with highlight single line 1`] = `
+<div class="highlight-lines">
+  <div class="highlighted">&nbsp;</div>
+  <br>
+  <div class="highlighted">&nbsp;</div>
+</div>export default function () { // .. }
+`;

test/markdown/fragments/code-snippet-highlightLines-multiple.md

@@ -0,0 +1 @@
+<<< @/test/markdown/fragments/snippet.js{1-3}

test/markdown/fragments/code-snippet-highlightLines-single.md

@@ -0,0 +1 @@
+<<< @/test/markdown/fragments/snippet.js{1,3}

test/markdown/fragments/code-snippet.md

@@ -0,0 +1 @@
+<<< @/test/markdown/fragments/snippet.js

test/markdown/fragments/snippet.js

@@ -0,0 +1,3 @@
+export default function () {
+  // ..
+}

test/markdown/snippet.spec.js

@@ -0,0 +1,26 @@
+import { Md, getFragment } from './util'
+import snippet from '@/markdown/snippet.js'
+import highlightLines from '@/markdown/highlightLines.js'
+
+const md = Md().use(snippet)
+const mdH = Md().use(snippet).use(highlightLines)
+
+describe('snippet', () => {
+  test('import snippet', async () => {
+    const input = await getFragment('code-snippet')
+    const output = md.render(input)
+    expect(output).toMatchSnapshot()
+  })
+
+  test('import snippet with highlight single line', async () => {
+    const input = await getFragment('code-snippet-highlightLines-single')
+    const output = mdH.render(input)
+    expect(output).toMatchSnapshot()
+  })
+
+  test('import snippet with highlight multiple lines', async () => {
+    const input = await getFragment('code-snippet-highlightLines-multiple')
+    const output = mdH.render(input)
+    expect(output).toMatchSnapshot()
+  })
+})