Merge remote-tracking branch 'upstream/master' into ce-to-ee-2018-02-12

app/assets/javascripts/ci_variable_list/ci_variable_list.js

@@ -39,7 +39,7 @@ export default class VariableList {
       },
       protected: {
         selector: '.js-ci-variable-input-protected',
-        default: 'true',
+        default: 'false',
       },
       environment_scope: {
         // We can't use a `.js-` class here because

app/assets/javascripts/sidebar/components/time_tracking/sidebar_time_tracking.js

@@ -2,7 +2,7 @@ import _ from 'underscore';
 
 import '~/smart_interval';
 
-import timeTracker from './time_tracker';
+import IssuableTimeTracker from './time_tracker.vue';
 
 import Store from '../../stores/sidebar_store';
 import Mediator from '../../sidebar_mediator';
@@ -16,7 +16,7 @@ export default {
     };
   },
   components: {
-    'issuable-time-tracker': timeTracker,
+    IssuableTimeTracker,
   },
   methods: {
     listenForQuickActions() {

app/assets/javascripts/sidebar/components/time_tracking/time_tracker.js → app/assets/javascripts/sidebar/components/time_tracking/time_tracker.vue

+<script>
 import timeTrackingHelpState from './help_state';
 import timeTrackingCollapsedState from './collapsed_state';
 import timeTrackingSpentOnlyPane from './spent_only_pane';
@@ -8,7 +9,15 @@ import timeTrackingComparisonPane from './comparison_pane';
 import eventHub from '../../event_hub';
 
 export default {
-  name: 'issuable-time-tracker',
+  name: 'IssuableTimeTracker',
+  components: {
+    'time-tracking-collapsed-state': timeTrackingCollapsedState,
+    'time-tracking-estimate-only-pane': timeTrackingEstimateOnlyPane,
+    'time-tracking-spent-only-pane': timeTrackingSpentOnlyPane,
+    'time-tracking-no-tracking-pane': timeTrackingNoTrackingPane,
+    'time-tracking-comparison-pane': timeTrackingComparisonPane,
+    'time-tracking-help-state': timeTrackingHelpState,
+  },
   props: {
     time_estimate: {
       type: Number,
@@ -38,14 +47,6 @@ export default {
       showHelp: false,
     };
   },
-  components: {
-    'time-tracking-collapsed-state': timeTrackingCollapsedState,
-    'time-tracking-estimate-only-pane': timeTrackingEstimateOnlyPane,
-    'time-tracking-spent-only-pane': timeTrackingSpentOnlyPane,
-    'time-tracking-no-tracking-pane': timeTrackingNoTrackingPane,
-    'time-tracking-comparison-pane': timeTrackingComparisonPane,
-    'time-tracking-help-state': timeTrackingHelpState,
-  },
   computed: {
     timeSpent() {
       return this.time_spent;
@@ -81,6 +82,9 @@ export default {
       return !!this.showHelp;
     },
   },
+  created() {
+    eventHub.$on('timeTracker:updateData', this.update);
+  },
   methods: {
     toggleHelpState(show) {
       this.showHelp = show;
@@ -92,72 +96,73 @@ export default {
       this.human_time_spent = data.human_time_spent;
     },
   },
-  created() {
-    eventHub.$on('timeTracker:updateData', this.update);
-  },
-  template: `
-    <div
-      class="time_tracker time-tracking-component-wrap"
-      v-cloak
-    >
-      <time-tracking-collapsed-state
-        :show-comparison-state="showComparisonState"
-        :show-no-time-tracking-state="showNoTimeTrackingState"
-        :show-help-state="showHelpState"
-        :show-spent-only-state="showSpentOnlyState"
-        :show-estimate-only-state="showEstimateOnlyState"
+};
+</script>
+
+<template>
+  <div
+    class="time_tracker time-tracking-component-wrap"
+    v-cloak
+  >
+    <time-tracking-collapsed-state
+      :show-comparison-state="showComparisonState"
+      :show-no-time-tracking-state="showNoTimeTrackingState"
+      :show-help-state="showHelpState"
+      :show-spent-only-state="showSpentOnlyState"
+      :show-estimate-only-state="showEstimateOnlyState"
+      :time-spent-human-readable="timeSpentHumanReadable"
+      :time-estimate-human-readable="timeEstimateHumanReadable"
+    />
+    <div class="title hide-collapsed">
+      {{ __('Time tracking') }}
+      <div
+        class="help-button pull-right"
+        v-if="!showHelpState"
+        @click="toggleHelpState(true)"
+      >
+        <i
+          class="fa fa-question-circle"
+          aria-hidden="true"
+        >
+        </i>
+      </div>
+      <div
+        class="close-help-button pull-right"
+        v-if="showHelpState"
+        @click="toggleHelpState(false)"
+      >
+        <i
+          class="fa fa-close"
+          aria-hidden="true"
+        >
+        </i>
+      </div>
+    </div>
+    <div class="time-tracking-content hide-collapsed">
+      <time-tracking-estimate-only-pane
+        v-if="showEstimateOnlyState"
+        :time-estimate-human-readable="timeEstimateHumanReadable"
+      />
+      <time-tracking-spent-only-pane
+        v-if="showSpentOnlyState"
+        :time-spent-human-readable="timeSpentHumanReadable"
+      />
+      <time-tracking-no-tracking-pane
+        v-if="showNoTimeTrackingState"
+      />
+      <time-tracking-comparison-pane
+        v-if="showComparisonState"
+        :time-estimate="timeEstimate"
+        :time-spent="timeSpent"
         :time-spent-human-readable="timeSpentHumanReadable"
         :time-estimate-human-readable="timeEstimateHumanReadable"
       />
-      <div class="title hide-collapsed">
-        {{ __('Time tracking') }}
-        <div
-          class="help-button pull-right"
-          v-if="!showHelpState"
-          @click="toggleHelpState(true)"
-        >
-            <i
-              class="fa fa-question-circle"
-              aria-hidden="true"
-            />
-        </div>
-        <div
-          class="close-help-button pull-right"
+      <transition name="help-state-toggle">
+        <time-tracking-help-state
           v-if="showHelpState"
-          @click="toggleHelpState(false)"
-        >
-          <i
-            class="fa fa-close"
-            aria-hidden="true"
-          />
-        </div>
-      </div>
-      <div class="time-tracking-content hide-collapsed">
-        <time-tracking-estimate-only-pane
-          v-if="showEstimateOnlyState"
-          :time-estimate-human-readable="timeEstimateHumanReadable"
+          :root-path="rootPath"
         />
-        <time-tracking-spent-only-pane
-          v-if="showSpentOnlyState"
-          :time-spent-human-readable="timeSpentHumanReadable"
-        />
-        <time-tracking-no-tracking-pane
-          v-if="showNoTimeTrackingState"
-        />
-        <time-tracking-comparison-pane
-          v-if="showComparisonState"
-          :time-estimate="timeEstimate"
-          :time-spent="timeSpent"
-          :time-spent-human-readable="timeSpentHumanReadable"
-          :time-estimate-human-readable="timeEstimateHumanReadable"
-        />
-        <transition name="help-state-toggle">
-          <time-tracking-help-state
-            v-if="showHelpState"
-            :rootPath="rootPath"
-          />
-        </transition>
-      </div>
+      </transition>
     </div>
-  `,
-};
+  </div>
+</template>

app/views/ci/variables/_variable_row.html.haml

@@ -5,7 +5,7 @@
 - id = variable&.id
 - key = variable&.key
 - value = variable&.value
-- is_protected = variable && !only_key_value ? variable.protected : true
+- is_protected = variable && !only_key_value ? variable.protected : false
 
 - id_input_name = "#{form_field}[variables_attributes][][id]"
 - destroy_input_name = "#{form_field}[variables_attributes][][_destroy]"

changelogs/unreleased/refactor-move-issuable-time-tracker-vue-component.yml

+---
+title: Move IssuableTimeTracker vue component
+merge_request: 16948
+author: George Tsiolis
+type: performance

spec/javascripts/ci_variable_list/ci_variable_list_spec.js

@@ -126,7 +126,7 @@ describe('VariableList', () => {
 
           // Check for the correct default in the new row
           const $protectedInput = $wrapper.find('.js-row:last-child').find('.js-ci-variable-input-protected');
-          expect($protectedInput.val()).toBe('true');
+          expect($protectedInput.val()).toBe('false');
         })
         .then(done)
         .catch(done.fail);

spec/javascripts/issuable_time_tracker_spec.js

@@ -2,7 +2,7 @@
 
 import Vue from 'vue';
 
-import timeTracker from '~/sidebar/components/time_tracking/time_tracker';
+import timeTracker from '~/sidebar/components/time_tracking/time_tracker.vue';
 
 function initTimeTrackingComponent(opts) {
   setFixtures(`

spec/support/features/variable_list_shared_examples.rb

@@ -41,13 +41,13 @@ shared_examples 'variable list' do
     end
   end
 
-  it 'adds new unprotected variable' do
+  it 'adds new protected variable' do
     page.within('.js-ci-variable-list-section .js-row:last-child') do
       find('.js-ci-variable-input-key').set('key')
       find('.js-ci-variable-input-value').set('key value')
       find('.ci-variable-protected-item .js-project-feature-toggle').click
 
-      expect(find('.js-ci-variable-input-protected', visible: false).value).to eq('false')
+      expect(find('.js-ci-variable-input-protected', visible: false).value).to eq('true')
     end
 
     click_button('Save variables')
@@ -59,7 +59,7 @@ shared_examples 'variable list' do
     page.within('.js-ci-variable-list-section .js-row:nth-child(1)') do
       expect(find('.js-ci-variable-input-key').value).to eq('key')
       expect(find('.js-ci-variable-input-value', visible: false).value).to eq('key value')
-      expect(find('.js-ci-variable-input-protected', visible: false).value).to eq('false')
+      expect(find('.js-ci-variable-input-protected', visible: false).value).to eq('true')
     end
   end
 
@@ -143,7 +143,6 @@ shared_examples 'variable list' do
     page.within('.js-ci-variable-list-section .js-row:last-child') do
       find('.js-ci-variable-input-key').set('unprotected_key')
       find('.js-ci-variable-input-value').set('unprotected_value')
-      find('.ci-variable-protected-item .js-project-feature-toggle').click
 
       expect(find('.js-ci-variable-input-protected', visible: false).value).to eq('false')
     end
@@ -178,6 +177,7 @@ shared_examples 'variable list' do
     page.within('.js-ci-variable-list-section .js-row:last-child') do
       find('.js-ci-variable-input-key').set('protected_key')
       find('.js-ci-variable-input-value').set('protected_value')
+      find('.ci-variable-protected-item .js-project-feature-toggle').click
 
       expect(find('.js-ci-variable-input-protected', visible: false).value).to eq('true')
     end