Add latest changes from gitlab-org/gitlab@master

5 files changed, 164 insertions, 117 deletions

diff --git a/spec/frontend/create_cluster/eks_cluster/components/eks_cluster_configuration_form_spec.js b/spec/frontend/create_cluster/eks_cluster/components/eks_cluster_configuration_form_spec.js
index 5b04328bb78..1bd16d356b9 100644
--- a/spec/frontend/create_cluster/eks_cluster/components/eks_cluster_configuration_form_spec.js
+++ b/spec/frontend/create_cluster/eks_cluster/components/eks_cluster_configuration_form_spec.js
@@ -4,28 +4,38 @@ import Vue from 'vue';
 import EksClusterConfigurationForm from '~/create_cluster/eks_cluster/components/eks_cluster_configuration_form.vue';
 import RegionDropdown from '~/create_cluster/eks_cluster/components/region_dropdown.vue';
 
+import clusterDropdownStoreState from '~/create_cluster/eks_cluster/store/cluster_dropdown/state';
+
 const localVue = createLocalVue();
 localVue.use(Vuex);
 
 describe('EksClusterConfigurationForm', () => {
   let store;
   let actions;
-  let state;
+  let regionsState;
+  let regionsActions;
   let vm;
 
   beforeEach(() => {
     actions = {
-      fetchRegions: jest.fn(),
       setRegion: jest.fn(),
+      setVpc: jest.fn(),
+    };
+    regionsActions = {
+      fetchItems: jest.fn(),
     };
-    state = {
-      regions: [{ name: 'region 1' }],
-      isLoadingRegions: false,
-      loadingRegionsError: { message: '' },
+    regionsState = {
+      ...clusterDropdownStoreState(),
     };
     store = new Vuex.Store({
-      state,
       actions,
+      modules: {
+        regions: {
+          namespaced: true,
+          state: regionsState,
+          actions: regionsActions,
+        },
+      },
     });
   });
 
@@ -44,31 +54,35 @@ describe('EksClusterConfigurationForm', () => {
 
   describe('when mounted', () => {
     it('fetches available regions', () => {
-      expect(actions.fetchRegions).toHaveBeenCalled();
+      expect(regionsActions.fetchItems).toHaveBeenCalled();
     });
   });
 
   it('sets isLoadingRegions to RegionDropdown loading property', () => {
-    state.isLoadingRegions = true;
+    regionsState.isLoadingItems = true;
 
     return Vue.nextTick().then(() => {
-      expect(findRegionDropdown().props('loading')).toEqual(state.isLoadingRegions);
+      expect(findRegionDropdown().props('loading')).toEqual(regionsState.isLoadingItems);
     });
   });
 
   it('sets regions to RegionDropdown regions property', () => {
-    expect(findRegionDropdown().props('regions')).toEqual(state.regions);
+    expect(findRegionDropdown().props('regions')).toEqual(regionsState.items);
   });
 
   it('sets loadingRegionsError to RegionDropdown error property', () => {
-    expect(findRegionDropdown().props('error')).toEqual(state.loadingRegionsError);
+    expect(findRegionDropdown().props('error')).toEqual(regionsState.loadingItemsError);
   });
 
-  it('dispatches setRegion action when region is selected', () => {
-    const region = { region: 'us-west-2' };
+  describe('when region is selected', () => {
+    const region = { name: 'us-west-2' };
 
-    findRegionDropdown().vm.$emit('input', region);
+    beforeEach(() => {
+      findRegionDropdown().vm.$emit('input', region);
+    });
 
-    expect(actions.setRegion).toHaveBeenCalledWith(expect.anything(), { region }, undefined);
+    it('dispatches setRegion action', () => {
+      expect(actions.setRegion).toHaveBeenCalledWith(expect.anything(), { region }, undefined);
+    });
   });
 });
diff --git a/spec/frontend/create_cluster/eks_cluster/store/actions_spec.js b/spec/frontend/create_cluster/eks_cluster/store/actions_spec.js
index 9a3970813ed..3744ddb3dc6 100644
--- a/spec/frontend/create_cluster/eks_cluster/store/actions_spec.js
+++ b/spec/frontend/create_cluster/eks_cluster/store/actions_spec.js
@@ -1,91 +1,10 @@
 import testAction from 'helpers/vuex_action_helper';
 
-import * as awsServicesFacade from '~/create_cluster/eks_cluster/services/aws_services_facade';
 import createState from '~/create_cluster/eks_cluster/store/state';
 import * as types from '~/create_cluster/eks_cluster/store/mutation_types';
 import * as actions from '~/create_cluster/eks_cluster/store/actions';
 
 describe('EKS Cluster Store Actions', () => {
-  const regions = [{ name: 'region 1' }];
-
-  describe('fetchRegions', () => {
-    describe('on success', () => {
-      beforeEach(() => {
-        jest.spyOn(awsServicesFacade, 'fetchRegions').mockResolvedValueOnce(regions);
-      });
-
-      it('dispatches success with received regions', () =>
-        testAction(
-          actions.fetchRegions,
-          null,
-          createState(),
-          [],
-          [
-            { type: 'requestRegions' },
-            {
-              type: 'receiveRegionsSuccess',
-              payload: { regions },
-            },
-          ],
-        ));
-    });
-
-    describe('on failure', () => {
-      const error = new Error('Could not fetch regions');
-
-      beforeEach(() => {
-        jest.spyOn(awsServicesFacade, 'fetchRegions').mockRejectedValueOnce(error);
-      });
-
-      it('dispatches success with received regions', () =>
-        testAction(
-          actions.fetchRegions,
-          null,
-          createState(),
-          [],
-          [
-            { type: 'requestRegions' },
-            {
-              type: 'receiveRegionsError',
-              payload: { error },
-            },
-          ],
-        ));
-    });
-  });
-
-  describe('requestRegions', () => {
-    it(`commits ${types.REQUEST_REGIONS} mutation`, () =>
-      testAction(actions.requestRegions, null, createState(), [{ type: types.REQUEST_REGIONS }]));
-  });
-
-  describe('receiveRegionsSuccess', () => {
-    it(`commits ${types.RECEIVE_REGIONS_SUCCESS} mutation`, () =>
-      testAction(actions.receiveRegionsSuccess, { regions }, createState(), [
-        {
-          type: types.RECEIVE_REGIONS_SUCCESS,
-          payload: {
-            regions,
-          },
-        },
-      ]));
-  });
-
-  describe('receiveRegionsError', () => {
-    it(`commits ${types.RECEIVE_REGIONS_ERROR} mutation`, () => {
-      const error = new Error('Error fetching regions');
-
-      testAction(actions.receiveRegionsError, { error }, createState(), [
-        {
-          type: types.RECEIVE_REGIONS_ERROR,
-          payload: {
-            error,
-          },
-        },
-      ]);
-    });
-  });
-
   describe('setRegion', () => {
     it(`commits ${types.SET_REGION} mutation`, () => {
       const region = { name: 'west-1' };
diff --git a/spec/frontend/create_cluster/eks_cluster/store/cluster_dropdown/actions_spec.js b/spec/frontend/create_cluster/eks_cluster/store/cluster_dropdown/actions_spec.js
new file mode 100644
index 00000000000..58f8855a64c
--- /dev/null
+++ b/spec/frontend/create_cluster/eks_cluster/store/cluster_dropdown/actions_spec.js
@@ -0,0 +1,95 @@
+import testAction from 'helpers/vuex_action_helper';
+
+import createState from '~/create_cluster/eks_cluster/store/cluster_dropdown/state';
+import * as types from '~/create_cluster/eks_cluster/store/cluster_dropdown/mutation_types';
+import actionsFactory from '~/create_cluster/eks_cluster/store/cluster_dropdown/actions';
+
+describe('Cluster dropdown Store Actions', () => {
+  const items = [{ name: 'item 1' }];
+  let fetchFn;
+  let actions;
+
+  beforeEach(() => {
+    fetchFn = jest.fn();
+    actions = actionsFactory(fetchFn);
+  });
+
+  describe('fetchItems', () => {
+    describe('on success', () => {
+      beforeEach(() => {
+        fetchFn.mockResolvedValueOnce(items);
+        actions = actionsFactory(fetchFn);
+      });
+
+      it('dispatches success with received items', () =>
+        testAction(
+          actions.fetchItems,
+          null,
+          createState(),
+          [],
+          [
+            { type: 'requestItems' },
+            {
+              type: 'receiveItemsSuccess',
+              payload: { items },
+            },
+          ],
+        ));
+    });
+
+    describe('on failure', () => {
+      const error = new Error('Could not fetch items');
+
+      beforeEach(() => {
+        fetchFn.mockRejectedValueOnce(error);
+      });
+
+      it('dispatches success with received items', () =>
+        testAction(
+          actions.fetchItems,
+          null,
+          createState(),
+          [],
+          [
+            { type: 'requestItems' },
+            {
+              type: 'receiveItemsError',
+              payload: { error },
+            },
+          ],
+        ));
+    });
+  });
+
+  describe('requestItems', () => {
+    it(`commits ${types.REQUEST_ITEMS} mutation`, () =>
+      testAction(actions.requestItems, null, createState(), [{ type: types.REQUEST_ITEMS }]));
+  });
+
+  describe('receiveItemsSuccess', () => {
+    it(`commits ${types.RECEIVE_ITEMS_SUCCESS} mutation`, () =>
+      testAction(actions.receiveItemsSuccess, { items }, createState(), [
+        {
+          type: types.RECEIVE_ITEMS_SUCCESS,
+          payload: {
+            items,
+          },
+        },
+      ]));
+  });
+
+  describe('receiveItemsError', () => {
+    it(`commits ${types.RECEIVE_ITEMS_ERROR} mutation`, () => {
+      const error = new Error('Error fetching items');
+
+      testAction(actions.receiveItemsError, { error }, createState(), [
+        {
+          type: types.RECEIVE_ITEMS_ERROR,
+          payload: {
+            error,
+          },
+        },
+      ]);
+    });
+  });
+});
diff --git a/spec/frontend/create_cluster/eks_cluster/store/cluster_dropdown/mutations_spec.js b/spec/frontend/create_cluster/eks_cluster/store/cluster_dropdown/mutations_spec.js
new file mode 100644
index 00000000000..0665047edea
--- /dev/null
+++ b/spec/frontend/create_cluster/eks_cluster/store/cluster_dropdown/mutations_spec.js
@@ -0,0 +1,36 @@
+import {
+  REQUEST_ITEMS,
+  RECEIVE_ITEMS_SUCCESS,
+  RECEIVE_ITEMS_ERROR,
+} from '~/create_cluster/eks_cluster/store/cluster_dropdown/mutation_types';
+import createState from '~/create_cluster/eks_cluster/store/cluster_dropdown/state';
+import mutations from '~/create_cluster/eks_cluster/store/cluster_dropdown/mutations';
+
+describe('Cluster dropdown store mutations', () => {
+  let state;
+  let emptyPayload;
+  let items;
+  let error;
+
+  beforeEach(() => {
+    emptyPayload = {};
+    items = [{ name: 'item 1' }];
+    error = new Error('could not load error');
+    state = createState();
+  });
+
+  it.each`
+    mutation                 | mutatedProperty        | payload         | expectedValue | expectedValueDescription
+    ${REQUEST_ITEMS}         | ${'isLoadingItems'}    | ${emptyPayload} | ${true}       | ${true}
+    ${REQUEST_ITEMS}         | ${'loadingItemsError'} | ${emptyPayload} | ${null}       | ${null}
+    ${RECEIVE_ITEMS_SUCCESS} | ${'isLoadingItems'}    | ${{ items }}    | ${false}      | ${false}
+    ${RECEIVE_ITEMS_SUCCESS} | ${'items'}             | ${{ items }}    | ${items}      | ${'items payload'}
+    ${RECEIVE_ITEMS_ERROR}   | ${'isLoadingItems'}    | ${{ error }}    | ${false}      | ${false}
+    ${RECEIVE_ITEMS_ERROR}   | ${'error'}             | ${{ error }}    | ${error}      | ${'received error object'}
+  `(`$mutation sets $mutatedProperty to $expectedValueDescription`, data => {
+    const { mutation, mutatedProperty, payload, expectedValue } = data;
+
+    mutations[mutation](state, payload);
+    expect(state[mutatedProperty]).toBe(expectedValue);
+  });
+});
diff --git a/spec/frontend/create_cluster/eks_cluster/store/mutations_spec.js b/spec/frontend/create_cluster/eks_cluster/store/mutations_spec.js
index f2d48635f8c..99f05b0f449 100644
--- a/spec/frontend/create_cluster/eks_cluster/store/mutations_spec.js
+++ b/spec/frontend/create_cluster/eks_cluster/store/mutations_spec.js
@@ -1,36 +1,19 @@
-import {
-  REQUEST_REGIONS,
-  RECEIVE_REGIONS_ERROR,
-  RECEIVE_REGIONS_SUCCESS,
-  SET_REGION,
-} from '~/create_cluster/eks_cluster/store/mutation_types';
+import { SET_REGION } from '~/create_cluster/eks_cluster/store/mutation_types';
 import createState from '~/create_cluster/eks_cluster/store/state';
 import mutations from '~/create_cluster/eks_cluster/store/mutations';
 
 describe('Create EKS cluster store mutations', () => {
   let state;
-  let emptyPayload;
-  let regions;
   let region;
-  let error;
 
   beforeEach(() => {
-    emptyPayload = {};
     region = { name: 'regions-1' };
-    regions = [region];
-    error = new Error('could not load error');
     state = createState();
   });
 
   it.each`
-    mutation                   | mutatedProperty          | payload         | expectedValue | expectedValueDescription
-    ${REQUEST_REGIONS}         | ${'isLoadingRegions'}    | ${emptyPayload} | ${true}       | ${true}
-    ${REQUEST_REGIONS}         | ${'loadingRegionsError'} | ${emptyPayload} | ${null}       | ${null}
-    ${RECEIVE_REGIONS_SUCCESS} | ${'isLoadingRegions'}    | ${{ regions }}  | ${false}      | ${false}
-    ${RECEIVE_REGIONS_SUCCESS} | ${'regions'}             | ${{ regions }}  | ${regions}    | ${'regions payload'}
-    ${RECEIVE_REGIONS_ERROR}   | ${'isLoadingRegions'}    | ${{ error }}    | ${false}      | ${false}
-    ${RECEIVE_REGIONS_ERROR}   | ${'error'}               | ${{ error }}    | ${error}      | ${'received error object'}
-    ${SET_REGION}              | ${'selectedRegion'}      | ${{ region }}   | ${region}     | ${'selected region payload'}
+    mutation      | mutatedProperty     | payload       | expectedValue | expectedValueDescription
+    ${SET_REGION} | ${'selectedRegion'} | ${{ region }} | ${region}     | ${'selected region payload'}
   `(`$mutation sets $mutatedProperty to $expectedValueDescription`, data => {
     const { mutation, mutatedProperty, payload, expectedValue } = data;