Change Job Log Timestamp Format

app/assets/javascripts/ci/job_details/components/job_log_top_bar.vue

@@ -88,6 +88,9 @@ export default {
     };
   },
   computed: {
+    hasJobLogTimestampsEnabled() {
+      return this.jobLog.length > 0 && this.jobLog[0].time;
+    },
     jobLogSize() {
       return sprintf(s__('Job|Showing last %{size} of log.'), {
         size: numberToHumanSize(this.size),
@@ -186,29 +189,34 @@ export default {
 </script>
 <template>
   <div class="top-bar gl-flex gl-items-center gl-justify-between">
-    <!-- truncated log information -->
-    <div class="gl-hidden gl-truncate sm:gl-block" data-testid="showing-last">
-      <template v-if="isJobLogSizeVisible">
-        {{ jobLogSize }}
-        <gl-sprintf
-          v-if="rawPath && isComplete && logViewerPath"
-          :message="
-            s__(
-              'Job|%{rawLinkStart}View raw%{rawLinkEnd} or %{fullLinkStart}full log%{fullLinkEnd}.',
-            )
-          "
-        >
-          <template #rawLink="{ content }">
-            <gl-link :href="rawPath">{{ content }}</gl-link>
-          </template>
-          <template #fullLink="{ content }">
-            <gl-link :href="logViewerPath"> {{ content }}</gl-link>
-          </template>
-        </gl-sprintf>
-        <gl-link v-else-if="rawPath" :href="rawPath">{{ s__('Job|View raw') }}</gl-link>
-      </template>
+    <div class="gl-hidden gl-truncate sm:gl-block">
+      <!-- truncated log information -->
+      <span data-testid="showing-last">
+        <template v-if="isJobLogSizeVisible">
+          {{ jobLogSize }}
+          <gl-sprintf
+            v-if="rawPath && isComplete && logViewerPath"
+            :message="
+              s__(
+                'Job|%{rawLinkStart}View raw%{rawLinkEnd} or %{fullLinkStart}full log%{fullLinkEnd}.',
+              )
+            "
+          >
+            <template #rawLink="{ content }">
+              <gl-link :href="rawPath">{{ content }}</gl-link>
+            </template>
+            <template #fullLink="{ content }">
+              <gl-link :href="logViewerPath"> {{ content }}</gl-link>
+            </template>
+          </gl-sprintf>
+          <gl-link v-else-if="rawPath" :href="rawPath">{{ s__('Job|View raw') }}</gl-link>
+        </template>
+      </span>
+      <!-- eo truncated log information -->
+      <span v-if="hasJobLogTimestampsEnabled">
+        {{ s__('Job|Log timestamps in UTC.') }}
+      </span>
     </div>
-    <!-- eo truncated log information -->
 
     <div class="controllers">
       <slot name="controllers"> </slot>

app/assets/javascripts/ci/job_details/store/utils.js

@@ -22,13 +22,13 @@ const TIME_START = 11;
 const TIME_END = 19;
 /**
  * Shortens timestamps in the form "2024-05-22T12:43:46.962646Z"
- * and extracts the time from them, example: "12:43:46Z"
+ * and extracts the time from them, example: "12:43:46"
  *
  * If the timestamp appears malformed the full string is returned.
  */
 const extractTime = (timestamp) => {
   if (timestamp.length === TIMESTAMP_LENGTH) {
-    return `${timestamp.substring(TIME_START, TIME_END)}Z`;
+    return `${timestamp.substring(TIME_START, TIME_END)}`;
   }
   return timestamp;
 };

locale/gitlab.pot

@@ -30987,6 +30987,9 @@ msgstr ""
 msgid "Job|Keep"
 msgstr ""
+msgid "Job|Log timestamps in UTC."
+msgstr ""
+
 msgid "Job|Manual"
 msgstr ""

spec/frontend/ci/job_details/store/utils_spec.js

@@ -53,7 +53,7 @@ describe('Jobs Store Utils', () => {
             ],
             lineNumber: 1,
             offset: 0,
-            time: '12:43:46Z',
+            time: '12:43:46',
           },
           {
             content: [{ text: ' on docker-auto-scale-com 8a6210b8' }],