tests: add vuex specs

spec/javascripts/projects/gke_cluster_dropdowns/helpers.js

+import {
+  gapiProjectsResponseMock,
+  gapiZonesResponseMock,
+  gapiMachineTypesResponseMock,
+} from './mock_data';
+
+// eslint-disable-next-line import/prefer-default-export
+export const resetStore = store => {
+  store.replaceState({
+    selectedProject: {
+      projectId: '',
+      name: '',
+    },
+    selectedZone: '',
+    selectedMachineType: '',
+    fetchedProjects: [],
+    fetchedZones: [],
+    fetchedMachineTypes: [],
+  });
+};
+
+// eslint-disable-next-line import/prefer-default-export
+export const gapi = () => ({
+  client: {
+    cloudresourcemanager: {
+      projects: {
+        list: () =>
+          new Promise(resolve => {
+            resolve({
+              result: { ...gapiProjectsResponseMock },
+            });
+          }),
+      },
+    },
+    compute: {
+      zones: {
+        list: () =>
+          new Promise(resolve => {
+            resolve({
+              result: { ...gapiZonesResponseMock },
+            });
+          }),
+      },
+      machineTypes: {
+        list: () =>
+          new Promise(resolve => {
+            resolve({
+              result: { ...gapiMachineTypesResponseMock },
+            });
+          }),
+      },
+    },
+  },
+});

spec/javascripts/projects/gke_cluster_dropdowns/mock_data.js

+export const selectedProjectMock = {
+  projectId: 'gcp-project-123',
+  name: 'gcp-project',
+};
+
+export const selectedZoneMock = 'us-central1-a';
+
+export const selectedMachineTypeMock = 'n1-standard-2';
+
+export const gapiProjectsResponseMock = {
+  projects: [
+    {
+      projectNumber: '1234',
+      projectId: 'gcp-project-123',
+      lifecycleState: 'ACTIVE',
+      name: 'gcp-project',
+      createTime: '2017-12-16T01:48:29.129Z',
+      parent: {
+        type: 'organization',
+        id: '12345',
+      },
+    },
+  ],
+};
+
+export const gapiZonesResponseMock = {
+  kind: 'compute#zoneList',
+  id: 'projects/gitlab-internal-153318/zones',
+  items: [
+    {
+      kind: 'compute#zone',
+      id: '2000',
+      creationTimestamp: '1969-12-31T16:00:00.000-08:00',
+      name: 'us-central1-a',
+      description: 'us-central1-a',
+      status: 'UP',
+      region:
+        'https://www.googleapis.com/compute/v1/projects/gitlab-internal-153318/regions/us-central1',
+      selfLink:
+        'https://www.googleapis.com/compute/v1/projects/gitlab-internal-153318/zones/us-central1-a',
+      availableCpuPlatforms: ['Intel Skylake', 'Intel Broadwell', 'Intel Sandy Bridge'],
+    },
+  ],
+  selfLink: 'https://www.googleapis.com/compute/v1/projects/gitlab-internal-153318/zones',
+};
+
+export const gapiMachineTypesResponseMock = {
+  kind: 'compute#machineTypeList',
+  id: 'projects/gitlab-internal-153318/zones/us-central1-a/machineTypes',
+  items: [
+    {
+      kind: 'compute#machineType',
+      id: '3002',
+      creationTimestamp: '1969-12-31T16:00:00.000-08:00',
+      name: 'n1-standard-2',
+      description: '2 vCPUs, 7.5 GB RAM',
+      guestCpus: 2,
+      memoryMb: 7680,
+      imageSpaceGb: 10,
+      maximumPersistentDisks: 64,
+      maximumPersistentDisksSizeGb: '65536',
+      zone: 'us-central1-a',
+      selfLink:
+        'https://www.googleapis.com/compute/v1/projects/gitlab-internal-153318/zones/us-central1-a/machineTypes/n1-standard-2',
+      isSharedCpu: false,
+    },
+  ],
+  selfLink:
+    'https://www.googleapis.com/compute/v1/projects/gitlab-internal-153318/zones/us-central1-a/machineTypes',
+};

spec/javascripts/projects/gke_cluster_dropdowns/stores/actions_spec.js

+import testAction from 'spec/helpers/vuex_action_helper';
+import * as actions from '~/projects/gke_cluster_dropdowns/stores/actions';
+import store from '~/projects/gke_cluster_dropdowns/stores';
+import { resetStore, gapi } from '../helpers';
+import {
+  selectedProjectMock,
+  selectedZoneMock,
+  selectedMachineTypeMock,
+  gapiProjectsResponseMock,
+  gapiZonesResponseMock,
+  gapiMachineTypesResponseMock,
+} from '../mock_data';
+
+describe('GCP Cluster Dropdown Store Actions', () => {
+  afterEach(() => {
+    resetStore(store);
+  });
+
+  describe('setProject', () => {
+    it('should set project', done => {
+      testAction(
+        actions.setProject,
+        selectedProjectMock,
+        { selectedProject: {} },
+        [{ type: 'SET_PROJECT', payload: selectedProjectMock }],
+        [],
+        done,
+      );
+    });
+  });
+
+  describe('setZone', () => {
+    it('should set zone', done => {
+      testAction(
+        actions.setZone,
+        selectedZoneMock,
+        { selectedZone: '' },
+        [{ type: 'SET_ZONE', payload: selectedZoneMock }],
+        [],
+        done,
+      );
+    });
+  });
+
+  describe('setMachineType', () => {
+    it('should set machine type', done => {
+      testAction(
+        actions.setMachineType,
+        selectedMachineTypeMock,
+        { selectedMachineType: '' },
+        [{ type: 'SET_MACHINE_TYPE', payload: selectedMachineTypeMock }],
+        [],
+        done,
+      );
+    });
+  });
+
+  describe('async fetch methods', () => {
+    window.gapi = gapi();
+
+    describe('getProjects', () => {
+      it('fetches projects from Google API', done => {
+        store
+          .dispatch('getProjects')
+          .then(() => {
+            expect(store.state.fetchedProjects[0].projectId).toEqual(selectedProjectMock.projectId);
+            expect(store.state.fetchedProjects[0].name).toEqual(selectedProjectMock.name);
+
+            done();
+          })
+          .catch(done.fail);
+      });
+    });
+
+    describe('getZones', () => {
+      it('fetches zones from Google API', done => {
+        store
+          .dispatch('getZones')
+          .then(() => {
+            expect(store.state.fetchedZones[0].name).toEqual(selectedZoneMock);
+
+            done();
+          })
+          .catch(done.fail);
+      });
+    });
+
+    describe('getMachineTypes', () => {
+      it('fetches machine types from Google API', done => {
+        store
+          .dispatch('getMachineTypes')
+          .then(() => {
+            expect(store.state.fetchedMachineTypes[0].name).toEqual(selectedMachineTypeMock);
+
+            done();
+          })
+          .catch(done.fail);
+      });
+    });
+  });
+});

spec/javascripts/projects/gke_cluster_dropdowns/stores/getters_spec.js

+import * as getters from '~/projects/gke_cluster_dropdowns/stores/getters';
+import { selectedProjectMock, selectedZoneMock, selectedMachineTypeMock } from '../mock_data';
+
+describe('GCP Cluster Dropdown Store Getters', () => {
+  let state;
+
+  describe('valid states', () => {
+    beforeEach(() => {
+      state = {
+        selectedProject: selectedProjectMock,
+        selectedZone: selectedZoneMock,
+        selectedMachineType: selectedMachineTypeMock,
+      };
+    });
+
+    describe('hasProject', () => {
+      it('should return true when project is selected', () => {
+        expect(getters.hasProject(state)).toEqual(true);
+      });
+    });
+
+    describe('hasZone', () => {
+      it('should return true when zone is selected', () => {
+        expect(getters.hasZone(state)).toEqual(true);
+      });
+    });
+
+    describe('hasMachineType', () => {
+      it('should return true when machine type is selected', () => {
+        expect(getters.hasMachineType(state)).toEqual(true);
+      });
+    });
+  });
+
+  describe('invalid states', () => {
+    beforeEach(() => {
+      state = {
+        selectedProject: {
+          projectId: '',
+          name: '',
+        },
+        selectedZone: '',
+        selectedMachineType: '',
+      };
+    });
+
+    describe('hasProject', () => {
+      it('should return false when project is not selected', () => {
+        expect(getters.hasProject(state)).toEqual(false);
+      });
+    });
+
+    describe('hasZone', () => {
+      it('should return false when zone is not selected', () => {
+        expect(getters.hasZone(state)).toEqual(false);
+      });
+    });
+
+    describe('hasMachineType', () => {
+      it('should return false when machine type is not selected', () => {
+        expect(getters.hasMachineType(state)).toEqual(false);
+      });
+    });
+  });
+});

spec/javascripts/projects/gke_cluster_dropdowns/stores/mutations_spec.js

+import mutations from '~/projects/gke_cluster_dropdowns/stores/mutations';
+import {
+  selectedProjectMock,
+  selectedZoneMock,
+  selectedMachineTypeMock,
+  gapiProjectsResponseMock,
+  gapiZonesResponseMock,
+  gapiMachineTypesResponseMock,
+} from '../mock_data';
+
+describe('GCP Cluster Dropdown Store Mutations', () => {
+  describe('SET_PROJECT', () => {
+    it('should set GCP project as selectedProject', () => {
+      const state = {
+        selectedProject: {
+          projectId: '',
+          name: '',
+        },
+      };
+      const projectToSelect = gapiProjectsResponseMock.projects[0];
+
+      mutations.SET_PROJECT(state, projectToSelect);
+
+      expect(state.selectedProject.projectId).toEqual(selectedProjectMock.projectId);
+      expect(state.selectedProject.name).toEqual(selectedProjectMock.name);
+    });
+  });
+
+  describe('SET_ZONE', () => {
+    it('should set GCP zone as selectedZone', () => {
+      const state = {
+        selectedZone: '',
+      };
+      const zoneToSelect = gapiZonesResponseMock.items[0].name;
+
+      mutations.SET_ZONE(state, zoneToSelect);
+
+      expect(state.selectedZone).toEqual(selectedZoneMock);
+    });
+  });
+
+  describe('SET_MACHINE_TYPE', () => {
+    it('should set GCP machine type as selectedMachineType', () => {
+      const state = {
+        selectedMachineType: '',
+      };
+      const machineTypeToSelect = gapiMachineTypesResponseMock.items[0].name;
+
+      mutations.SET_MACHINE_TYPE(state, machineTypeToSelect);
+
+      expect(state.selectedMachineType).toEqual(selectedMachineTypeMock);
+    });
+  });
+
+  describe('SET_FETCHED_PROJECTS', () => {
+    it('should set Google API Projects response as fetchedProjects', () => {
+      const state = {
+        fetchedProjects: [],
+      };
+
+      expect(state.fetchedProjects.length).toEqual(0);
+
+      mutations.SET_FETCHED_PROJECTS(state, gapiProjectsResponseMock.projects);
+
+      expect(state.fetchedProjects.length).toEqual(gapiProjectsResponseMock.projects.length);
+    });
+  });
+
+  describe('SET_FETCHED_ZONES', () => {
+    it('should set Google API Zones response as fetchedZones', () => {
+      const state = {
+        fetchedZones: [],
+      };
+
+      expect(state.fetchedZones.length).toEqual(0);
+
+      mutations.SET_FETCHED_ZONES(state, gapiZonesResponseMock.items);
+
+      expect(state.fetchedZones.length).toEqual(gapiZonesResponseMock.items.length);
+    });
+  });
+
+  describe('SET_FETCHED_MACHINE_TYPES', () => {
+    it('should set Google API Machine Types response as fetchedMachineTypes', () => {
+      const state = {
+        fetchedMachineTypes: [],
+      };
+
+      expect(state.fetchedMachineTypes.length).toEqual(0);
+
+      mutations.SET_FETCHED_MACHINE_TYPES(state, gapiMachineTypesResponseMock.items);
+
+      expect(state.fetchedMachineTypes.length).toEqual(gapiMachineTypesResponseMock.items.length);
+    });
+  });
+});