Add latest changes from gitlab-org/gitlab@master

2 files changed, 9 insertions, 2 deletions

diff --git a/app/assets/javascripts/content_editor/components/wrappers/frontmatter.vue b/app/assets/javascripts/content_editor/components/wrappers/frontmatter.vue
index 97b69afd12e..e8829d00986 100644
--- a/app/assets/javascripts/content_editor/components/wrappers/frontmatter.vue
+++ b/app/assets/javascripts/content_editor/components/wrappers/frontmatter.vue
@@ -20,7 +20,7 @@ export default {
 };
 </script>
 <template>
-  <node-view-wrapper class="gl-relative code highlight" as="pre">
+  <node-view-wrapper class="content-editor-code-block gl-relative code highlight" as="pre">
     <span
       data-testid="frontmatter-label"
       class="gl-absolute gl-top-0 gl-right-3"
diff --git a/app/assets/javascripts/content_editor/extensions/code_block_highlight.js b/app/assets/javascripts/content_editor/extensions/code_block_highlight.js
index ea51bee3ba9..9dc17fcd570 100644
--- a/app/assets/javascripts/content_editor/extensions/code_block_highlight.js
+++ b/app/assets/javascripts/content_editor/extensions/code_block_highlight.js
@@ -19,7 +19,14 @@ export default CodeBlockLowlight.extend({
     };
   },
   renderHTML({ HTMLAttributes }) {
-    return ['div', ['pre', HTMLAttributes, ['code', {}, 0]]];
+    return [
+      'pre',
+      {
+        ...HTMLAttributes,
+        class: `content-editor-code-block ${HTMLAttributes.class}`,
+      },
+      ['code', {}, 0],
+    ];
   },
 }).configure({
   lowlight,