Merge branch '209995-snippet-description-md-render' into 'master'

Resolve "code Snippets Description: Markdown is not rendered (it's just plain text)"

Closes #209995

See merge request gitlab-org/gitlab!27038

app/assets/javascripts/snippets/components/snippet_title.vue

@@ -21,7 +21,7 @@ export default {
       {{ snippet.title }}
     </h2>
     <div v-if="snippet.description" class="description" data-qa-selector="snippet_description">
-      <div class="md">{{ snippet.description }}</div>
+      <div class="md js-snippet-description" v-html="snippet.descriptionHtml"></div>
     </div>
 
     <small v-if="snippet.updatedAt !== snippet.createdAt" class="edited-text">

app/assets/javascripts/snippets/fragments/snippetBase.fragment.graphql

@@ -2,6 +2,7 @@ fragment SnippetBase on Snippet {
   id
   title
   description
+  descriptionHtml
   createdAt
   updatedAt
   visibilityLevel

spec/frontend/snippets/components/snippet_title_spec.js

@@ -6,10 +6,12 @@ describe('Snippet header component', () => {
   let wrapper;
   const title = 'The property of Thor';
   const description = 'Do not touch this hammer';
+  const descriptionHtml = `<h2>${description}</h2>`;
   const snippet = {
     snippet: {
       title,
       description,
+      descriptionHtml,
     },
   };
 
@@ -35,7 +37,7 @@ describe('Snippet header component', () => {
   it('renders snippets title and description', () => {
     createComponent();
     expect(wrapper.text().trim()).toContain(title);
-    expect(wrapper.text().trim()).toContain(description);
+    expect(wrapper.find('.js-snippet-description').element.innerHTML).toBe(descriptionHtml);
   });
 
   it('does not render recent changes time stamp if there were no updates', () => {