Add latest changes from gitlab-org/gitlab@13-6-stable-eev13.6.0-rc42

8 files changed, 47 insertions, 15 deletions

diff --git a/app/assets/javascripts/sidebar/components/time_tracking/collapsed_state.vue b/app/assets/javascripts/sidebar/components/time_tracking/collapsed_state.vue
index 9d72bf4394e..7b67c34ded6 100644
--- a/app/assets/javascripts/sidebar/components/time_tracking/collapsed_state.vue
+++ b/app/assets/javascripts/sidebar/components/time_tracking/collapsed_state.vue
@@ -96,7 +96,12 @@ export default {
 </script>
 
 <template>
-  <div v-gl-tooltip:body.viewport.left :title="tooltipText" class="sidebar-collapsed-icon">
+  <div
+    v-gl-tooltip:body.viewport.left
+    :title="tooltipText"
+    data-testid="collapsedState"
+    class="sidebar-collapsed-icon"
+  >
     <gl-icon name="timer" />
     <div class="time-tracking-collapsed-summary">
       <div :class="divClass">
diff --git a/app/assets/javascripts/sidebar/components/time_tracking/comparison_pane.vue b/app/assets/javascripts/sidebar/components/time_tracking/comparison_pane.vue
index d4cc98e3743..99302993b9a 100644
--- a/app/assets/javascripts/sidebar/components/time_tracking/comparison_pane.vue
+++ b/app/assets/javascripts/sidebar/components/time_tracking/comparison_pane.vue
@@ -70,14 +70,19 @@ export default {
 </script>
 
 <template>
-  <div class="time-tracking-comparison-pane">
+  <div data-testid="timeTrackingComparisonPane">
     <div
       v-gl-tooltip
+      data-testid="compareMeter"
       :title="timeRemainingTooltip"
       :class="timeRemainingStatusClass"
       class="compare-meter"
     >
-      <gl-progress-bar :value="timeRemainingPercent" :variant="progressBarVariant" />
+      <gl-progress-bar
+        data-testid="timeRemainingProgress"
+        :value="timeRemainingPercent"
+        :variant="progressBarVariant"
+      />
       <div class="compare-display-container">
         <div class="compare-display float-left">
           <span class="compare-label">{{ s__('TimeTracking|Spent') }}</span>
diff --git a/app/assets/javascripts/sidebar/components/time_tracking/estimate_only_pane.vue b/app/assets/javascripts/sidebar/components/time_tracking/estimate_only_pane.vue
index 305726d9725..8a80b1bf13f 100644
--- a/app/assets/javascripts/sidebar/components/time_tracking/estimate_only_pane.vue
+++ b/app/assets/javascripts/sidebar/components/time_tracking/estimate_only_pane.vue
@@ -11,7 +11,8 @@ export default {
 </script>
 
 <template>
-  <div class="time-tracking-estimate-only-pane">
-    <span class="bold"> {{ s__('TimeTracking|Estimated:') }} </span> {{ timeEstimateHumanReadable }}
+  <div data-testid="estimateOnlyPane">
+    <span class="gl-font-weight-bold">{{ s__('TimeTracking|Estimated:') }} </span
+    >{{ timeEstimateHumanReadable }}
   </div>
 </template>
diff --git a/app/assets/javascripts/sidebar/components/time_tracking/help_state.vue b/app/assets/javascripts/sidebar/components/time_tracking/help_state.vue
index b45746e789d..8bc828091c0 100644
--- a/app/assets/javascripts/sidebar/components/time_tracking/help_state.vue
+++ b/app/assets/javascripts/sidebar/components/time_tracking/help_state.vue
@@ -34,7 +34,7 @@ export default {
 </script>
 
 <template>
-  <div class="time-tracking-help-state">
+  <div data-testid="helpPane" class="time-tracking-help-state">
     <div class="time-tracking-info">
       <h4>{{ __('Track time with quick actions') }}</h4>
       <p>{{ __('Quick actions can be used in the issues description and comment boxes.') }}</p>
diff --git a/app/assets/javascripts/sidebar/components/time_tracking/no_tracking_pane.vue b/app/assets/javascripts/sidebar/components/time_tracking/no_tracking_pane.vue
index 45552589e50..2d3d0ce8dc5 100644
--- a/app/assets/javascripts/sidebar/components/time_tracking/no_tracking_pane.vue
+++ b/app/assets/javascripts/sidebar/components/time_tracking/no_tracking_pane.vue
@@ -5,7 +5,7 @@ export default {
 </script>
 
 <template>
-  <div class="time-tracking-no-tracking-pane">
-    <span class="no-value"> {{ __('No estimate or time spent') }} </span>
+  <div data-testid="noTrackingPane">
+    <span class="no-value">{{ __('No estimate or time spent') }}</span>
   </div>
 </template>
diff --git a/app/assets/javascripts/sidebar/components/time_tracking/sidebar_time_tracking.vue b/app/assets/javascripts/sidebar/components/time_tracking/sidebar_time_tracking.vue
index 406677941b7..6bef5ed67a4 100644
--- a/app/assets/javascripts/sidebar/components/time_tracking/sidebar_time_tracking.vue
+++ b/app/assets/javascripts/sidebar/components/time_tracking/sidebar_time_tracking.vue
@@ -57,7 +57,6 @@ export default {
       :human-time-estimate="store.humanTimeEstimate"
       :human-time-spent="store.humanTotalTimeSpent"
       :limit-to-hours="store.timeTrackingLimitToHours"
-      :root-path="store.rootPath"
     />
   </div>
 </template>
diff --git a/app/assets/javascripts/sidebar/components/time_tracking/spent_only_pane.vue b/app/assets/javascripts/sidebar/components/time_tracking/spent_only_pane.vue
index b2b3b289c5c..33c6ac6e2ba 100644
--- a/app/assets/javascripts/sidebar/components/time_tracking/spent_only_pane.vue
+++ b/app/assets/javascripts/sidebar/components/time_tracking/spent_only_pane.vue
@@ -15,7 +15,7 @@ export default {
       return sprintf(
         s__('TimeTracking|%{startTag}Spent: %{endTag}%{timeSpentHumanReadable}'),
         {
-          startTag: '<span class="bold">',
+          startTag: '<span class="gl-font-weight-bold">',
           endTag: '</span>',
           timeSpentHumanReadable: this.timeSpentHumanReadable,
         },
@@ -27,5 +27,5 @@ export default {
 </script>
 
 <template>
-  <div class="time-tracking-spend-only-pane" v-html="timeSpent"></div>
+  <div data-testid="spentOnlyPane" v-html="timeSpent"></div>
 </template>
diff --git a/app/assets/javascripts/sidebar/components/time_tracking/time_tracker.vue b/app/assets/javascripts/sidebar/components/time_tracking/time_tracker.vue
index a2fb0ebcbc6..3199ed1e615 100644
--- a/app/assets/javascripts/sidebar/components/time_tracking/time_tracker.vue
+++ b/app/assets/javascripts/sidebar/components/time_tracking/time_tracker.vue
@@ -44,6 +44,21 @@ export default {
       default: false,
       required: false,
     },
+    /*
+      In issue list, "time-tracking-collapsed-state" is always rendered even if the sidebar isn't collapsed.
+      The actual hiding is controlled with css classes:
+        Hide "time-tracking-collapsed-state" 
+          if .right-sidebar .right-sidebar-collapsed .sidebar-collapsed-icon
+        Show "time-tracking-collapsed-state"
+          if .right-sidebar .right-sidebar-expanded .sidebar-collapsed-icon
+      
+      In Swimlanes sidebar, we do not use collapsed state at all.
+    */
+    showCollapsed: {
+      type: Boolean,
+      default: true,
+      required: false,
+    },
   },
   data() {
     return {
@@ -93,8 +108,9 @@ export default {
 </script>
 
 <template>
-  <div v-cloak class="time_tracker time-tracking-component-wrap">
+  <div v-cloak class="time-tracker time-tracking-component-wrap" data-testid="time-tracker">
     <time-tracking-collapsed-state
+      v-if="showCollapsed"
       :show-comparison-state="showComparisonState"
       :show-no-time-tracking-state="showNoTimeTrackingState"
       :show-help-state="showHelpState"
@@ -103,13 +119,19 @@ export default {
       :time-spent-human-readable="humanTimeSpent"
       :time-estimate-human-readable="humanTimeEstimate"
     />
-    <div class="title hide-collapsed">
+    <div class="title hide-collapsed gl-mb-3">
       {{ __('Time tracking') }}
-      <div v-if="!showHelpState" class="help-button float-right" @click="toggleHelpState(true)">
+      <div
+        v-if="!showHelpState"
+        data-testid="helpButton"
+        class="help-button float-right"
+        @click="toggleHelpState(true)"
+      >
         <gl-icon name="question-o" />
       </div>
       <div
-        v-if="showHelpState"
+        v-else
+        data-testid="closeHelpButton"
         class="close-help-button float-right"
         @click="toggleHelpState(false)"
       >