Merge branch 'fix-code-block-input-rule' into 'master'

Fix: Code block input rule doesn’t save the code block language

See merge request gitlab-org/gitlab!67980

app/assets/javascripts/content_editor/extensions/code_block_highlight.js

@@ -14,18 +14,6 @@ export default CodeBlockLowlight.extend({
           };
         },
       },
-      /* `params` is the name of the attribute that
-        prosemirror-markdown uses to extract the language
-        of a codeblock.
-        https://github.com/ProseMirror/prosemirror-markdown/blob/master/src/to_markdown.js#L62
-      */
-      params: {
-        parseHTML: (element) => {
-          return {
-            params: extractLanguage(element),
-          };
-        },
-      },
       class: {
         default: 'code highlight js-syntax-highlight',
       },

app/assets/javascripts/content_editor/services/markdown_serializer.js

@@ -51,7 +51,13 @@ const defaultSerializerConfig = {
   nodes: {
     [Blockquote.name]: defaultMarkdownSerializer.nodes.blockquote,
     [BulletList.name]: defaultMarkdownSerializer.nodes.bullet_list,
-    [CodeBlockHighlight.name]: defaultMarkdownSerializer.nodes.code_block,
+    [CodeBlockHighlight.name]: (state, node) => {
+      state.write(`\`\`\`${node.attrs.language || ''}\n`);
+      state.text(node.textContent, false);
+      state.ensureNewLine();
+      state.write('```');
+      state.closeBlock(node);
+    },
     [Emoji.name]: (state, node) => {
       const { name } = node.attrs;
 

spec/frontend/content_editor/extensions/code_block_highlight_spec.js

@@ -25,7 +25,6 @@ describe('content_editor/extensions/code_block_highlight', () => {
 
     expect(tiptapEditor.getJSON().content[0].attrs).toMatchObject({
       language,
-      params: language,
     });
   });