Resolve "Show `failure_reason` and upgrade tooltips of jobs"

app/assets/javascripts/pipelines/components/graph/job_component.vue

@@ -17,6 +17,7 @@
    *     "text": "passed",
    *     "label": "passed",
    *     "group": "success",
+   *     "tooltip": "passed",
    *     "details_path": "/root/ci-mock/builds/4256",
    *     "action": {
    *       "icon": "retry",
@@ -69,12 +70,12 @@
           textBuilder.push(this.job.name);
         }
-        if (this.job.name && this.status.label) {
+        if (this.job.name && this.status.tooltip) {
           textBuilder.push('-');
         }
-        if (this.status.label) {
-          textBuilder.push(`${this.job.status.label}`);
+        if (this.status.tooltip) {
+          textBuilder.push(`${this.job.status.tooltip}`);
         }
         return textBuilder.join(' ');
@@ -100,6 +101,7 @@
       :title="tooltipText"
       :class="cssClassJobName"
       data-container="body"
+      data-html="true"
       class="js-pipeline-graph-job-link"
     >
@@ -115,6 +117,7 @@
       class="js-job-component-tooltip"
       :title="tooltipText"
       :class="cssClassJobName"
+      data-html="true"
       data-container="body"
     >

app/assets/stylesheets/pages/builds.scss

@@ -391,7 +391,7 @@
       }
       &:hover {
-        background-color: $row-hover;
+        background-color: $dropdown-item-hover-bg;
       }
       .icon-retry {

app/controllers/projects/jobs_controller.rb

@@ -2,7 +2,6 @@ class Projects::JobsController < Projects::ApplicationController
   include SendFileUpload
   before_action :build, except: [:index, :cancel_all]
-
   before_action :authorize_read_build!,
     only: [:index, :show, :status, :raw, :trace]
   before_action :authorize_update_build!,
@@ -45,8 +44,11 @@ class Projects::JobsController < Projects::ApplicationController
   end
   def show
-    @builds = @project.pipelines.find_by_sha(@build.sha).builds.order('id DESC')
-    @builds = @builds.where("id not in (?)", @build.id)
+    @builds = @project.pipelines
+      .find_by_sha(@build.sha)
+      .builds
+      .order('id DESC')
+      .present(current_user: current_user)
     @pipeline = @build.pipeline
     respond_to do |format|

app/models/concerns/presentable.rb

 module Presentable
+  extend ActiveSupport::Concern
+
+  class_methods do
+    def present(attributes)
+      all.map { |klass_object| klass_object.present(attributes) }
+    end
+  end
+
   def present(**attributes)
     Gitlab::View::Presenter::Factory
       .new(self, attributes)

app/presenters/ci/build_presenter.rb

@@ -15,6 +15,8 @@ module Ci
     def status_title
       if auto_canceled?
         "Job is redundant and is auto-canceled by Pipeline ##{auto_canceled_by_id}"
+      else
+        tooltip_for_badge
       end
     end
@@ -28,5 +30,19 @@ module Ci
           trigger_request.user_variables
         end
     end
+
+    def tooltip_message
+      "#{subject.name} - #{detailed_status.status_tooltip}"
+    end
+
+    private
+
+    def tooltip_for_badge
+      detailed_status.badge_tooltip.capitalize
+    end
+
+    def detailed_status
+      @detailed_status ||= subject.detailed_status(user)
+    end
   end
 end

app/serializers/status_entity.rb

@@ -2,7 +2,7 @@ class StatusEntity < Grape::Entity
   include RequestAwareEntity
   expose :icon, :text, :label, :group
-
+  expose :status_tooltip, as: :tooltip
   expose :has_details?, as: :has_details
   expose :details_path

app/views/ci/status/_badge.html.haml

@@ -4,10 +4,10 @@
 - css_classes = "ci-status ci-#{status.group} #{'has-tooltip' if title.present?}"
 - if link && status.has_details?
-  = link_to status.details_path, class: css_classes, title: title do
+  = link_to status.details_path, class: css_classes, title: title, data: { html: title.present? } do
     = sprite_icon(status.icon)
     = status.text
 - else
-  %span{ class: css_classes, title: title }
+  %span{ class: css_classes, title: title, data: { html: title.present? } }
     = sprite_icon(status.icon)
     = status.text

app/views/ci/status/_dropdown_graph_badge.html.haml

@@ -3,14 +3,15 @@
 - subject = local_assigns.fetch(:subject)
 - status = subject.detailed_status(current_user)
 - klass = "ci-status-icon ci-status-icon-#{status.group}"
-- tooltip = "#{subject.name} - #{status.label}"
+- tooltip = "#{subject.name} - #{status.status_tooltip}"
 - if status.has_details?
-  = link_to status.details_path, class: 'mini-pipeline-graph-dropdown-item', data: { toggle: 'tooltip', title: tooltip, container: 'body' }  do
+  = link_to status.details_path, class: 'mini-pipeline-graph-dropdown-item', data: { toggle: 'tooltip', title: tooltip, html: true, container: 'body' }  do
     %span{ class: klass }= sprite_icon(status.icon)
     %span.ci-build-text= subject.name
+
 - else
-  .menu-item.mini-pipeline-graph-dropdown-item{ data: { toggle: 'tooltip', title: tooltip, container: 'body' } }
+  .menu-item.mini-pipeline-graph-dropdown-item{ data: { toggle: 'tooltip', html: true, title: tooltip, container: 'body' } }
     %span{ class: klass }= sprite_icon(status.icon)
     %span.ci-build-text= subject.name

app/views/projects/jobs/_sidebar.html.haml

-- builds = @build.pipeline.builds.to_a
-
 %aside.right-sidebar.right-sidebar-expanded.build-sidebar.js-build-sidebar.js-right-sidebar{ data: { "offset-top" => "101", "spy" => "affix" } }
   .sidebar-container
     .blocks-container
@@ -91,7 +89,8 @@
       - HasStatus::ORDERED_STATUSES.each do |build_status|
         - builds.select{|build| build.status == build_status}.each do |build|
           .build-job{ class: sidebar_build_class(build, @build), data: { stage: build.stage } }
-            = link_to project_job_path(@project, build) do
+            - tooltip = build.tooltip_message
+            = link_to(project_job_path(@project, build), data: { toggle: 'tooltip', html: true, title: tooltip, container: 'body' }) do
               = sprite_icon('arrow-right', size:16, css_class: 'icon-arrow-right')
               %span{ class: "ci-status-icon-#{build.status}" }
                 = ci_icon_for_status(build.status)
@@ -101,5 +100,4 @@
                 - else
                   = build.id
               - if build.retried?
-                %span.has-tooltip{ data: { container: 'body', placement: 'bottom' }, title: 'Job was retried' }
-                  = sprite_icon('retry', size:16, css_class: 'icon-retry')
+                = sprite_icon('retry', size:16, css_class: 'icon-retry')

app/views/projects/jobs/show.html.haml

@@ -107,7 +107,7 @@
         illustration_size: 'svg-430',
         title: _('This job has not started yet'),
         content: _('This job is in pending state and is waiting to be picked by a runner')
-  = render "sidebar"
+  = render "sidebar", builds: @builds
 .js-build-options{ data: javascript_build_options }

changelogs/unreleased/44269-show-failure-reason-on-upgrade-tooltip-of-jobs.yml

+---
+title: Display error message on job's tooltip if this one fails
+merge_request: 17782
+author:
+type: added

lib/gitlab/ci/status/build/factory.rb

@@ -6,10 +6,12 @@ module Gitlab
           def self.extended_statuses
             [[Status::Build::Cancelable,
               Status::Build::Retryable],
+             [Status::Build::Failed],
              [Status::Build::FailedAllowed,
               Status::Build::Play,
               Status::Build::Stop],
-             [Status::Build::Action]]
+             [Status::Build::Action],
+             [Status::Build::Retried]]
           end
           def self.common_helpers

lib/gitlab/ci/status/build/failed.rb

+module Gitlab
+  module Ci
+    module Status
+      module Build
+        class Failed < Status::Extended
+          REASONS = {
+            'unknown_failure' => 'unknown failure',
+            'script_failure' => 'script failure',
+            'api_failure' => 'API failure',
+            'stuck_or_timeout_failure' => 'stuck or timeout failure',
+            'runner_system_failure' => 'runner system failure',
+            'missing_dependency_failure' => 'missing dependency failure'
+          }.freeze
+
+          def status_tooltip
+            base_message
+          end
+
+          def badge_tooltip
+            base_message
+          end
+
+          def self.matches?(build, user)
+            build.failed?
+          end
+
+          private
+
+          def base_message
+            "#{s_('CiStatusLabel|failed')} #{description}"
+          end
+
+          def description
+            "<br> (#{REASONS[subject.failure_reason]})"
+          end
+        end
+      end
+    end
+  end
+end

lib/gitlab/ci/status/build/failed_allowed.rb

@@ -4,7 +4,7 @@ module Gitlab
       module Build
         class FailedAllowed < Status::Extended
           def label
-            'failed (allowed to fail)'
+            "failed #{allowed_to_fail_title}"
           end
           def icon
@@ -15,9 +15,19 @@ module Gitlab
             'failed_with_warnings'
           end
+          def status_tooltip
+            "#{@status.status_tooltip} #{allowed_to_fail_title}"
+          end
+
           def self.matches?(build, user)
             build.failed? && build.allow_failure?
           end
+
+          private
+
+          def allowed_to_fail_title
+            "(allowed to fail)"
+          end
         end
       end
     end

lib/gitlab/ci/status/build/retried.rb

+module Gitlab
+  module Ci
+    module Status
+      module Build
+        class Retried < Status::Extended
+          def status_tooltip
+            @status.status_tooltip + " (retried)"
+          end
+
+          def self.matches?(build, user)
+            build.retried?
+          end
+        end
+      end
+    end
+  end
+end

lib/gitlab/ci/status/core.rb

@@ -57,6 +57,16 @@ module Gitlab
         def action_title
           raise NotImplementedError
         end
+
+        # Hint that appears on all the pipeline graph tooltips and builds on the right sidebar in Job detail view
+        def status_tooltip
+          label
+        end
+
+        # Hint that appears on the build badges
+        def badge_tooltip
+          subject.status
+        end
       end
     end
   end

spec/factories/ci/builds.rb

@@ -238,5 +238,10 @@ FactoryBot.define do
     trait :protected do
       protected true
     end
+
+    trait :script_failure do
+      failed
+      failure_reason 1
+    end
   end
 end

spec/features/projects/jobs/user_browses_job_spec.rb

@@ -34,4 +34,26 @@ describe 'User browses a job', :js do
     expect(build.project.running_or_pending_build_count).to eq(build.project.builds.running_or_pending.count(:all))
   end
+
+  context 'with a failed job' do
+    let!(:build) { create(:ci_build, :failed, pipeline: pipeline) }
+
+    it 'displays the failure reason' do
+      within('.builds-container') do
+        build_link = first('.build-job > a')
+        expect(build_link['data-title']).to eq('test - failed <br> (unknown failure)')
+      end
+    end
+  end
+
+  context 'when a failed job has been retried' do
+    let!(:build) { create(:ci_build, :failed, :retried, pipeline: pipeline) }
+
+    it 'displays the failure reason and retried label' do
+      within('.builds-container') do
+        build_link = first('.build-job > a')
+        expect(build_link['data-title']).to eq('test - failed <br> (unknown failure) (retried)')
+      end
+    end
+  end
 end

spec/features/projects/jobs/user_browses_jobs_spec.rb

@@ -29,4 +29,15 @@ describe 'User browses jobs' do
       expect(ci_lint_tool_link[:href]).to end_with(ci_lint_path)
     end
   end
+
+  context 'with a failed job' do
+    let!(:build) { create(:ci_build, :coverage, :failed, pipeline: pipeline) }
+
+    it 'displays a tooltip with the failure reason' do
+      page.within('.ci-table') do
+        failed_job_link = page.find('.ci-failed')
+        expect(failed_job_link[:title]).to eq('Failed <br> (unknown failure)')
+      end
+    end
+  end
 end

spec/features/projects/pipelines/pipeline_spec.rb

@@ -115,6 +115,13 @@ describe 'Pipeline', :js do
           expect(page).not_to have_content('Retry job')
         end
+
+        it 'should include the failure reason' do
+          page.within('#ci-badge-test') do
+            build_link = page.find('.js-pipeline-graph-job-link')
+            expect(build_link['data-original-title']).to eq('test - failed <br> (unknown failure)')
+          end
+        end
       end
       context 'when pipeline has manual jobs' do
@@ -289,6 +296,15 @@ describe 'Pipeline', :js do
       it { expect(build_manual.reload).to be_pending }
     end
+
+    context 'failed jobs' do
+      it 'displays a tooltip with the failure reason' do
+        page.within('.ci-table') do
+          failed_job_link = page.find('.ci-failed')
+          expect(failed_job_link[:title]).to eq('Failed <br> (unknown failure)')
+        end
+      end
+    end
   end
   describe 'GET /:project/pipelines/:id/failures' do