Render section duration in job logsrender-duration-for-job-log-sections

Show the duration of the section in the form MM:SS
as data attribute in the section-end tag

3 files changed, 21 insertions, 6 deletions

diff --git a/changelogs/unreleased/render-duration-for-job-log-sections.yml b/changelogs/unreleased/render-duration-for-job-log-sections.yml
new file mode 100644
index 00000000000..9d79a59bd23
--- /dev/null
+++ b/changelogs/unreleased/render-duration-for-job-log-sections.yml
@@ -0,0 +1,5 @@
+---
+title: Render section duration in job logs as part of section-end tag
+merge_request: 31720
+author:
+type: added
diff --git a/lib/gitlab/ci/ansi2html.rb b/lib/gitlab/ci/ansi2html.rb
index b7886114e9c..4004bfbb63b 100644
--- a/lib/gitlab/ci/ansi2html.rb
+++ b/lib/gitlab/ci/ansi2html.rb
@@ -131,9 +131,9 @@ module Gitlab
 
         def on_109(_) set_bg_color(9, 'l') end
 
-        attr_accessor :offset, :n_open_tags, :fg_color, :bg_color, :style_mask, :sections, :lineno_in_section
+        attr_accessor :offset, :n_open_tags, :fg_color, :bg_color, :style_mask, :sections, :timestamps, :lineno_in_section
 
-        STATE_PARAMS = [:offset, :n_open_tags, :fg_color, :bg_color, :style_mask, :sections, :lineno_in_section].freeze
+        STATE_PARAMS = [:offset, :n_open_tags, :fg_color, :bg_color, :style_mask, :sections, :timestamps, :lineno_in_section].freeze
 
         def convert(stream, new_state)
           reset_state
@@ -218,6 +218,7 @@ module Gitlab
           return if @sections.include?(section)
 
           @sections << section
+          @timestamps[section] = timestamp
           write_raw %{<div class="js-section-start section-start fa fa-caret-down pr-2 cursor-pointer" data-timestamp="#{timestamp}" data-section="#{data_section_names}" role="button"></div>}
           @lineno_in_section = 0
         end
@@ -227,9 +228,13 @@ module Gitlab
 
           # close all sections up to section
           until @sections.empty?
-            write_raw %{<div class="section-end" data-section="#{data_section_names}"></div>}
-
+            open_sections = data_section_names
             last_section = @sections.pop
+            duration = duration_for_section(last_section, timestamp)
+
+            write_raw %{<div class="section-end" data-section="#{open_sections}" data-duration="#{duration}"></div>}
+            @timestamps.delete(last_section)
+
             break if section == last_section
           end
         end
@@ -238,6 +243,10 @@ module Gitlab
           @sections.join(" ")
         end
 
+        def duration_for_section(section, end_timestamp)
+          Time.at(end_timestamp.to_i - @timestamps[section].to_i).utc.strftime("%M:%S")
+        end
+
         def handle_sequence(scanner)
           indicator = scanner[1]
           commands = scanner[2].split ';'
@@ -337,6 +346,7 @@ module Gitlab
           @n_open_tags = 0
           @out = +''
           @sections = []
+          @timestamps = {}
           @lineno_in_section = 0
           reset
         end
diff --git a/spec/lib/gitlab/ci/ansi2html_spec.rb b/spec/lib/gitlab/ci/ansi2html_spec.rb
index c8afcbd053d..59c95d43a43 100644
--- a/spec/lib/gitlab/ci/ansi2html_spec.rb
+++ b/spec/lib/gitlab/ci/ansi2html_spec.rb
@@ -204,7 +204,7 @@ describe Gitlab::Ci::Ansi2html do
   context "with section markers" do
     let(:section_name) { 'test_section' }
     let(:section_start_time) { Time.new(2017, 9, 20).utc }
-    let(:section_duration) { 3.seconds }
+    let(:section_duration) { 83.seconds }
     let(:section_end_time) { section_start_time + section_duration }
     let(:section_start) { "section_start:#{section_start_time.to_i}:#{section_name}\r\033[0K"}
     let(:section_end) { "section_end:#{section_end_time.to_i}:#{section_name}\r\033[0K"}
@@ -214,7 +214,7 @@ describe Gitlab::Ci::Ansi2html do
       ' role="button"></div>'
     end
     let(:section_end_html) do
-      "<div class=\"section-end\" data-section=\"#{class_name(section_name)}\"></div>"
+      "<div class=\"section-end\" data-section=\"#{class_name(section_name)}\" data-duration=\"01:23\"></div>"
     end
 
     shared_examples 'forbidden char in section_name' do