Merge branch '213101-junit-report-times' into 'master'

Format test report times to adjust for ms

See merge request gitlab-org/gitlab!39644

app/assets/javascripts/pipelines/components/test_reports/test_summary.vue

 <script>
 import { GlDeprecatedButton, GlProgressBar } from '@gitlab/ui';
 import { __ } from '~/locale';
-import { formatTime, secondsToMilliseconds } from '~/lib/utils/datetime_utility';
 import Icon from '~/vue_shared/components/icon.vue';
+import { formattedTime } from '../../stores/test_reports/utils';
 
 export default {
   name: 'TestSummary',
@@ -39,7 +39,7 @@ export default {
       return 0;
     },
     formattedDuration() {
-      return formatTime(secondsToMilliseconds(this.report.total_time));
+      return formattedTime(this.report.total_time);
     },
     progressBarVariant() {
       if (this.successPercentage < 33) {

app/assets/javascripts/pipelines/stores/test_reports/utils.js

 import { TestStatus } from '~/pipelines/constants';
-import { formatTime, secondsToMilliseconds } from '~/lib/utils/datetime_utility';
+import { __, sprintf } from '../../../locale';
 
 export function iconForTestStatus(status) {
   switch (status) {
@@ -12,7 +12,13 @@ export function iconForTestStatus(status) {
   }
 }
 
-export const formattedTime = timeInSeconds => formatTime(secondsToMilliseconds(timeInSeconds));
+export const formattedTime = (seconds = 0) => {
+  if (seconds < 1) {
+    const milliseconds = seconds * 1000;
+    return sprintf(__('%{milliseconds}ms'), { milliseconds: milliseconds.toFixed(2) });
+  }
+  return sprintf(__('%{seconds}s'), { seconds: seconds.toFixed(2) });
+};
 
 export const addIconStatus = testCase => ({
   ...testCase,

changelogs/unreleased/213101-junit-report-times.yml

+---
+title: Adjust format for JUnit report duration times
+merge_request: 39644
+author:
+type: changed

locale/gitlab.pot

@@ -551,6 +551,9 @@ msgstr ""
 msgid "%{milestone} (expired)"
 msgstr ""
 
+msgid "%{milliseconds}ms"
+msgstr ""
+
 msgid "%{mrText}, this issue will be closed automatically."
 msgstr ""
 
@@ -663,6 +666,9 @@ msgstr ""
 msgid "%{retryButtonStart}Try again%{retryButtonEnd} or %{newFileButtonStart}attach a new file%{newFileButtonEnd}"
 msgstr ""
 
+msgid "%{seconds}s"
+msgstr ""
+
 msgid "%{securityScanner} is not enabled for this project. %{linkStart}More information%{linkEnd}"
 msgid_plural "%{securityScanner} are not enabled for this project. %{linkStart}More information%{linkEnd}"
 msgstr[0] ""

spec/frontend/pipelines/test_reports/stores/getters_spec.js

 import { getJSONFixture } from 'helpers/fixtures';
 import * as getters from '~/pipelines/stores/test_reports/getters';
-import { iconForTestStatus } from '~/pipelines/stores/test_reports/utils';
+import { iconForTestStatus, formattedTime } from '~/pipelines/stores/test_reports/utils';
 
 describe('Getters TestReports Store', () => {
   let state;
@@ -34,7 +34,7 @@ describe('Getters TestReports Store', () => {
       const suites = getters.getTestSuites(state);
       const expected = testReports.test_suites.map(x => ({
         ...x,
-        formattedTime: '00:00:00',
+        formattedTime: formattedTime(x.total_time),
       }));
 
       expect(suites).toEqual(expected);
@@ -65,7 +65,7 @@ describe('Getters TestReports Store', () => {
       const cases = getters.getSuiteTests(state);
       const expected = testReports.test_suites[0].test_cases.map(x => ({
         ...x,
-        formattedTime: '00:00:00',
+        formattedTime: formattedTime(x.execution_time),
         icon: iconForTestStatus(x.status),
       }));
 

spec/frontend/pipelines/test_reports/stores/utils_spec.js

+import { formattedTime } from '~/pipelines/stores/test_reports/utils';
+
+describe('Test reports utils', () => {
+  describe('formattedTime', () => {
+    describe('when time is smaller than a second', () => {
+      it('should return time in milliseconds fixed to 2 decimals', () => {
+        const result = formattedTime(0.4815162342);
+        expect(result).toBe('481.52ms');
+      });
+    });
+
+    describe('when time is equal to a second', () => {
+      it('should return time in seconds fixed to 2 decimals', () => {
+        const result = formattedTime(1);
+        expect(result).toBe('1.00s');
+      });
+    });
+
+    describe('when time is greater than a second', () => {
+      it('should return time in seconds fixed to 2 decimals', () => {
+        const result = formattedTime(4.815162342);
+        expect(result).toBe('4.82s');
+      });
+    });
+  });
+});

spec/frontend/pipelines/test_reports/test_summary_spec.js

 import { mount } from '@vue/test-utils';
 import { getJSONFixture } from 'helpers/fixtures';
 import Summary from '~/pipelines/components/test_reports/test_summary.vue';
+import { formattedTime } from '~/pipelines/stores/test_reports/utils';
 
 describe('Test reports summary', () => {
   let wrapper;
@@ -76,7 +77,7 @@ describe('Test reports summary', () => {
     });
 
     it('displays the correctly formatted duration', () => {
-      expect(duration().text()).toBe('00:00:00');
+      expect(duration().text()).toBe(formattedTime(testSuite.total_time));
     });
   });