fix: markdown-it-attrs behaviour in pre wrapper plugin

src/node/markdown/plugins/highlightLines.ts

@@ -14,11 +14,22 @@ export const highlightLinePlugin = (md: MarkdownIt) => {
 
     // due to use of markdown-it-attrs, the {0} syntax would have been
     // converted to attrs on the token
-    const attr = token.attrs && token.attrs[0]
+    let highlightLineAttr
+    if (token.attrs) {
+      token.attrs = token.attrs.filter((x) => {
+        const isHighlightLineAttr = /^[\d,-]+$/.test(x[0])
+
+        if (isHighlightLineAttr) {
+          highlightLineAttr = x
+        }
+
+        return !isHighlightLineAttr
+      })
+    }
 
     let lines = null
 
-    if (!attr) {
+    if (!highlightLineAttr) {
       // markdown-it-attrs maybe disabled
       const rawInfo = token.info
 
@@ -35,7 +46,7 @@ export const highlightLinePlugin = (md: MarkdownIt) => {
     }
 
     if (!lines) {
-      lines = attr![0]
+      lines = highlightLineAttr![0]
 
       if (!lines || !/[\d,-]+/.test(lines)) {
         return fence(...args)

src/node/markdown/plugins/preWrapper.ts

@@ -18,13 +18,22 @@ export function preWrapperPlugin(md: MarkdownIt, options: Options) {
     token.info = token.info.replace(/ active$/, '').replace(/ active /, ' ')
 
     const lang = extractLang(token.info)
-
+    const classes = `language-${lang}${getAdaptiveThemeMarker(
+      options
+    )}${active}`
+    const classAttr = token.attrs && token.attrs.find((x) => x[0] === 'class')
+
+    if (classAttr != null) {
+      classAttr[1] = `${classes}  ${classAttr[1]}`
+    } else {
+      token.attrJoin('class', classes)
+    }
+
+    const rawCode = fence(...args)
     return (
-      `<div class="language-${lang}${getAdaptiveThemeMarker(options)}${active}">` +
+      `<div ${md.renderer.renderAttrs(token)}>` +
       `<button title="${options.codeCopyButtonTitle}" class="copy"></button>` +
-      `<span class="lang">${lang}</span>` +
-      fence(...args) +
-      '</div>'
+      `<span class="lang">${lang}</span>${rawCode}</div>`
     )
   }
 }