Fixes emojis not rendering in the Vue file list

Adds the rendered markdown HTML to the GraphQL endpoint.
Also adds the rendered markdown HTML to the logs endpoint.

Closes https://gitlab.com/gitlab-org/gitlab/-/issues/212669

app/assets/javascripts/repository/components/last_commit.vue

@@ -121,9 +121,8 @@ export default {
             :href="commit.webUrl"
             :class="{ 'font-italic': !commit.message }"
             class="commit-row-message item-title"
-          >
-            {{ commit.title }}
-          </gl-link>
+            v-html="commit.titleHtml"
+          />
           <gl-deprecated-button
             v-if="commit.description"
             :class="{ open: showDescription }"

app/assets/javascripts/repository/components/table/row.vue

@@ -167,9 +167,8 @@ export default {
         :href="commit.commitPath"
         :title="commit.message"
         class="str-truncated-100 tree-commit-link"
-      >
-        {{ commit.message }}
-      </gl-link>
+        v-html="commit.titleHtml"
+      />
       <gl-skeleton-loading v-else :lines="1" class="h-auto" />
     </td>
     <td class="tree-time-ago text-right cursor-default">

app/assets/javascripts/repository/queries/commit.fragment.graphql

 fragment TreeEntryCommit on LogTreeCommit {
   sha
   message
+  titleHtml
   committedDate
   commitPath
   fileName

app/assets/javascripts/repository/queries/pathLastCommit.query.graphql

@@ -5,6 +5,7 @@ query pathLastCommit($projectPath: ID!, $path: String, $ref: String!) {
         lastCommit {
           sha
           title
+          titleHtml
           description
           message
           webUrl

app/assets/javascripts/repository/utils/commit.js

@@ -3,6 +3,7 @@ export function normalizeData(data, path, extra = () => {}) {
   return data.map(d => ({
     sha: d.commit.id,
     message: d.commit.message,
+    titleHtml: d.commit_title_html,
     committedDate: d.commit.committed_date,
     commitPath: d.commit_path,
     fileName: d.file_name,

app/graphql/types/commit_type.rb

@@ -14,6 +14,7 @@ module Types
           description: 'SHA1 ID of the commit'
     field :title, type: GraphQL::STRING_TYPE, null: true, calls_gitaly: true,
           description: 'Title of the commit message'
+    markdown_field :title_html, null: true
     field :description, type: GraphQL::STRING_TYPE, null: true,
           description: 'Description of the commit message'
     field :message, type: GraphQL::STRING_TYPE, null: true,

changelogs/unreleased/ph-212669-commitTypeMarkdownHTML.yml

+---
+title: Fixes commit message emojis not rendering in Vue file list
+merge_request:
+author:
+type: fixed

doc/api/graphql/reference/gitlab_schema.graphql

@@ -889,6 +889,11 @@ type Commit {
   """
   title: String
 
+  """
+  The GitLab Flavored Markdown rendering of `title`
+  """
+  titleHtml: String
+
   """
   Web URL of the commit
   """

doc/api/graphql/reference/gitlab_schema.json

@@ -2378,6 +2378,20 @@
               "isDeprecated": false,
               "deprecationReason": null
             },
+            {
+              "name": "titleHtml",
+              "description": "The GitLab Flavored Markdown rendering of `title`",
+              "args": [
+
+              ],
+              "type": {
+                "kind": "SCALAR",
+                "name": "String",
+                "ofType": null
+              },
+              "isDeprecated": false,
+              "deprecationReason": null
+            },
             {
               "name": "webUrl",
               "description": "Web URL of the commit",

doc/api/graphql/reference/index.md

@@ -161,6 +161,7 @@ Autogenerated return type of BoardListUpdateLimitMetrics
 | `sha` | String! | SHA1 ID of the commit |
 | `signatureHtml` | String | Rendered HTML of the commit signature |
 | `title` | String | Title of the commit message |
+| `titleHtml` | String | The GitLab Flavored Markdown rendering of `title` |
 | `webUrl` | String! | Web URL of the commit |
 
 ## CreateBranchPayload

ee/app/assets/javascripts/repository/queries/commit.fragment.graphql

 fragment TreeEntryCommit on LogTreeCommit {
   sha
   message
+  titleHtml
   committedDate
   commitPath
   fileName

ee/spec/frontend/repository/utils/commit_spec.js

@@ -8,6 +8,7 @@ const mockData = [
       committed_date: '2019-01-01',
     },
     commit_path: `https://test.com`,
+    commit_title_html: 'testing message',
     file_name: 'index.js',
     type: 'blob',
     lock_label: 'Locked',
@@ -26,6 +27,7 @@ describe('normalizeData', () => {
         filePath: '/index.js',
         type: 'blob',
         lockLabel: 'Locked',
+        titleHtml: 'testing message',
         __typename: 'LogTreeCommit',
       },
     ]);
@@ -45,6 +47,7 @@ describe('normalizeData', () => {
         filePath: '/index.js',
         type: 'blob',
         lockLabel: false,
+        titleHtml: 'testing message',
         __typename: 'LogTreeCommit',
       },
     ]);

lib/gitlab/tree_summary.rb

@@ -3,6 +3,7 @@
 module Gitlab
   class TreeSummary
     include ::Gitlab::Utils::StrongMemoize
+    include ::MarkupHelper
 
     CACHE_EXPIRE_IN = 1.hour
     MAX_OFFSET = 2**31
@@ -104,6 +105,7 @@ module Gitlab
         if commit
           entry[:commit] = commit
           entry[:commit_path] = commit_path(commit)
+          entry[:commit_title_html] = markdown_field(commit, :title)
         end
       end
     end

spec/features/projects/files/user_browses_files_spec.rb

@@ -171,6 +171,18 @@ describe "User browses files" do
     end
   end
 
+  context 'when commit message has markdown', :js do
+    before do
+      project.repository.create_file(user, 'index', 'test', message: ':star: testing', branch_name: 'master')
+
+      visit(project_tree_path(project, "master"))
+    end
+
+    it 'renders emojis' do
+      expect(page).to have_selector('gl-emoji', count: 2)
+    end
+  end
+
   context "when browsing a `improve/awesome` branch", :js do
     before do
       visit(project_tree_path(project, "improve/awesome"))

spec/frontend/repository/components/__snapshots__/last_commit_spec.js.snap

@@ -26,9 +26,7 @@ exports[`Repository last commit component renders commit widget 1`] = `
         class="commit-row-message item-title"
         href="https://test.com/commit/123"
       >
-        
-          Commit title
-        
+        Commit title
       </gl-link-stub>
        
       <!---->
@@ -128,9 +126,7 @@ exports[`Repository last commit component renders the signature HTML as returned
         class="commit-row-message item-title"
         href="https://test.com/commit/123"
       >
-        
-          Commit title
-        
+        Commit title
       </gl-link-stub>
        
       <!---->

spec/frontend/repository/components/last_commit_spec.js

@@ -9,6 +9,7 @@ function createCommitData(data = {}) {
   const defaultData = {
     sha: '123456789',
     title: 'Commit title',
+    titleHtml: 'Commit title',
     message: 'Commit message',
     webUrl: 'https://test.com/commit/123',
     authoredDate: '2019-01-01',

spec/frontend/repository/utils/commit_spec.js

@@ -8,6 +8,7 @@ const mockData = [
       committed_date: '2019-01-01',
     },
     commit_path: `https://test.com`,
+    commit_title_html: 'testing message',
     file_name: 'index.js',
     type: 'blob',
   },
@@ -24,6 +25,7 @@ describe('normalizeData', () => {
         fileName: 'index.js',
         filePath: '/index.js',
         type: 'blob',
+        titleHtml: 'testing message',
         __typename: 'LogTreeCommit',
       },
     ]);

spec/graphql/types/commit_type_spec.rb

@@ -9,7 +9,7 @@ describe GitlabSchema.types['Commit'] do
 
   it 'contains attributes related to commit' do
     expect(described_class).to have_graphql_fields(
-      :id, :sha, :title, :description, :message, :authored_date,
+      :id, :sha, :title, :description, :message, :title_html, :authored_date,
       :author_name, :author_gravatar, :author, :web_url, :latest_pipeline,
       :pipelines, :signature_html
     )

spec/lib/gitlab/tree_summary_spec.rb

@@ -72,7 +72,8 @@ describe Gitlab::TreeSummary do
       expected_commit_path = Gitlab::Routing.url_helpers.project_commit_path(project, commit)
 
       expect(entry[:commit]).to be_a(::Commit)
-      expect(entry[:commit_path]).to eq expected_commit_path
+      expect(entry[:commit_path]).to eq(expected_commit_path)
+      expect(entry[:commit_title_html]).to eq(commit.message)
     end
 
     context 'in a good subdirectory' do