Merge branch 'ek-minor-vsa-spec-fixes' into 'master'

Minor fixes for VSA jest specs

See merge request gitlab-org/gitlab!68823

ee/app/assets/javascripts/analytics/cycle_analytics/components/limit_warning_component.vue

-<script>
-import { GlTooltipDirective, GlIcon } from '@gitlab/ui';
-import { n__ } from '~/locale';
-import { EVENTS_LIST_ITEM_LIMIT } from '../constants';
-
-export default {
-  components: {
-    GlIcon,
-  },
-  directives: {
-    GlTooltip: GlTooltipDirective,
-  },
-  props: {
-    count: {
-      type: Number,
-      required: true,
-    },
-  },
-  eventsListItemLimit: EVENTS_LIST_ITEM_LIMIT,
-  tooltipTitle: n__(
-    'Limited to showing %d event at most',
-    'Limited to showing %d events at most',
-    EVENTS_LIST_ITEM_LIMIT,
-  ),
-};
-</script>
-<template>
-  <!-- TODO: im not sure why this is rendered only for exactly 50 items, why not >= 50? -->
-  <span v-if="count >= $options.eventsListItemLimit" class="events-info float-right">
-    <gl-icon v-gl-tooltip="{ title: $options.tooltipTitle }" name="warning" />
-    {{ n__('Showing %d event', 'Showing %d events', $options.eventsListItemLimit) }}
-  </span>
-</template>

ee/app/assets/javascripts/analytics/cycle_analytics/components/value_stream_form.vue

@@ -336,6 +336,7 @@ export default {
           <transition name="fade">
             <gl-button
               v-if="canRestore"
+              data-testid="vsa-reset-button"
               class="gl-ml-3"
               variant="link"
               @click="handleResetDefaults"

ee/spec/frontend/analytics/cycle_analytics/components/value_stream_form_spec.js

 import { GlModal, GlFormInput } from '@gitlab/ui';
 import { shallowMount, createLocalVue } from '@vue/test-utils';
 import Vuex from 'vuex';
-import { PRESET_OPTIONS_BLANK } from 'ee/analytics/cycle_analytics/components/create_value_stream_form/constants';
+import {
+  PRESET_OPTIONS_BLANK,
+  PRESET_OPTIONS_DEFAULT,
+} from 'ee/analytics/cycle_analytics/components/create_value_stream_form/constants';
 import CustomStageFields from 'ee/analytics/cycle_analytics/components/create_value_stream_form/custom_stage_fields.vue';
 import DefaultStageFields from 'ee/analytics/cycle_analytics/components/create_value_stream_form/default_stage_fields.vue';
 import ValueStreamForm from 'ee/analytics/cycle_analytics/components/value_stream_form.vue';
@@ -44,7 +47,7 @@ describe('ValueStreamForm', () => {
     name: 'Editable value stream',
   };
 
-  const initialPreset = PRESET_OPTIONS_BLANK;
+  const initialPreset = PRESET_OPTIONS_DEFAULT;
 
   const fakeStore = () =>
     new Vuex.Store({
@@ -86,13 +89,14 @@ describe('ValueStreamForm', () => {
   const findModal = () => wrapper.findComponent(GlModal);
   const findExtendedFormFields = () => wrapper.findByTestId('extended-form-fields');
   const findPresetSelector = () => wrapper.findByTestId('vsa-preset-selector');
-  const findRestoreButton = (index) => wrapper.findByTestId(`stage-action-restore-${index}`);
+  const findRestoreButton = () => wrapper.findByTestId('vsa-reset-button');
+  const findRestoreStageButton = (index) => wrapper.findByTestId(`stage-action-restore-${index}`);
   const findHiddenStages = () => wrapper.findAllByTestId('vsa-hidden-stage').wrappers;
   const findBtn = (btn) => findModal().props(btn);
 
   const clickSubmit = () => findModal().vm.$emit('primary', mockEvent);
   const clickAddStage = () => findModal().vm.$emit('secondary', mockEvent);
-  const clickRestoreStageAtIndex = (index) => findRestoreButton(index).vm.$emit('click');
+  const clickRestoreStageAtIndex = (index) => findRestoreStageButton(index).vm.$emit('click');
   const expectFieldError = (testId, error = '') =>
     expect(wrapper.findByTestId(testId).attributes('invalid-feedback')).toBe(error);
 
@@ -118,6 +122,18 @@ describe('ValueStreamForm', () => {
       it('has the preset button', () => {
         expect(findPresetSelector().exists()).toBe(true);
       });
+
+      it('will toggle between the blank and default templates', () => {
+        expect(wrapper.vm.stages).toHaveLength(defaultStageConfig.length);
+
+        findPresetSelector().vm.$emit('input', PRESET_OPTIONS_BLANK);
+
+        expect(wrapper.vm.stages).toHaveLength(1);
+
+        findPresetSelector().vm.$emit('input', PRESET_OPTIONS_DEFAULT);
+
+        expect(wrapper.vm.stages).toHaveLength(defaultStageConfig.length);
+      });
     });
 
     it('does not display any hidden stages', () => {
@@ -215,6 +231,20 @@ describe('ValueStreamForm', () => {
         expect(findHiddenStages().length).toBe(0);
       });
 
+      describe('restore defaults button', () => {
+        it('will clear the form fields', async () => {
+          expect(wrapper.vm.stages).toHaveLength(stageCount);
+
+          await clickAddStage();
+
+          expect(wrapper.vm.stages).toHaveLength(stageCount + 1);
+
+          findRestoreButton().vm.$emit('click');
+
+          expect(wrapper.vm.stages).toHaveLength(stageCount);
+        });
+      });
+
       describe('with hidden stages', () => {
         const hiddenStages = defaultStageConfig.map((s) => ({ ...s, hidden: true }));
 

ee/spec/frontend/analytics/cycle_analytics/store/actions_spec.js

@@ -181,6 +181,18 @@ describe('Value Stream Analytics actions', () => {
     });
   });
 
+  describe('receiveCycleAnalyticsDataSuccess', () => {
+    it(`commits the ${types.RECEIVE_VALUE_STREAM_DATA_SUCCESS} and dispatches the 'typeOfWork/fetchTopRankedGroupLabels' action`, () => {
+      return testAction(
+        actions.receiveCycleAnalyticsDataSuccess,
+        null,
+        state,
+        [{ type: types.RECEIVE_VALUE_STREAM_DATA_SUCCESS }],
+        [{ type: 'typeOfWork/fetchTopRankedGroupLabels' }],
+      );
+    });
+  });
+
   describe('receiveCycleAnalyticsDataError', () => {
     it(`commits the ${types.RECEIVE_VALUE_STREAM_DATA_ERROR} mutation on a 403 response`, () => {
       const response = { status: 403 };