From 576f3e1caa9cc5d4b880b3863463162cc80592f9 Mon Sep 17 00:00:00 2001
From: Hans Pagel <hans.pagel@ueber.io>
Date: Wed, 30 Sep 2020 16:25:32 +0200
Subject: [PATCH] add language support to code blocks

---
 .../demos/Extensions/CodeBlock/index.spec.js  | 10 ++++++++++
 packages/extension-code-block/index.ts        | 20 ++++++++++++++++++-
 2 files changed, 29 insertions(+), 1 deletion(-)

diff --git a/docs/src/demos/Extensions/CodeBlock/index.spec.js b/docs/src/demos/Extensions/CodeBlock/index.spec.js
index 657878a1..746605c0 100644
--- a/docs/src/demos/Extensions/CodeBlock/index.spec.js
+++ b/docs/src/demos/Extensions/CodeBlock/index.spec.js
@@ -69,6 +69,16 @@ context('/api/extensions/code-block', () => {
     })
   })
 
+  it('should parse the language from a HTML code block', () => {
+    cy.get('.ProseMirror').then(([{ editor }]) => {
+      editor.setContent('<pre><code class="language-css">body { display: none; }</code></pre>')
+
+      cy.get('.ProseMirror')
+        .find('pre>code.language-css')
+        .should('have.length', 1)
+    })
+  })
+
   it('should make a code block for js', () => {
     cy.get('.ProseMirror').then(([{ editor }]) => {
       editor.clearContent()
diff --git a/packages/extension-code-block/index.ts b/packages/extension-code-block/index.ts
index ab2bf10a..66a670d1 100644
--- a/packages/extension-code-block/index.ts
+++ b/packages/extension-code-block/index.ts
@@ -26,7 +26,25 @@ export default new Node()
     defining: true,
     draggable: false,
     parseDOM: [
-      { tag: 'pre', preserveWhitespace: 'full' },
+      {
+        tag: 'pre',
+        preserveWhitespace: 'full',
+        getAttrs(dom) {
+          const code = (dom as HTMLElement).firstChild
+
+          if (!code) {
+            return null
+          }
+
+          const classAttribute = ((code as HTMLElement).getAttribute('class') as string)
+
+          if (!classAttribute) {
+            return null
+          }
+
+          return { language: classAttribute.replace(/^(language-)/, '') }
+        },
+      },
     ],
     toDOM: node => ['pre', ['code', { class: node.attrs.language && `language-${node.attrs.language}` }, 0]],
   }))