Add various design management util tests

Add tests for:

- extractDesign util
- onDesignQueryResult (pages/design/index.vue)
- onQueryError (pages/design/index.vue)

ee/spec/frontend/design_management/mock_data/designs.js

+import design from './design';
+
+export default {
+  project: {
+    issue: {
+      designCollection: {
+        designs: {
+          edges: [
+            {
+              node: design,
+            },
+          ],
+        },
+      },
+    },
+  },
+};

ee/spec/frontend/design_management/mock_data/no_designs.js

+export default {
+  project: {
+    issue: {
+      designCollection: {
+        designs: {
+          edges: [],
+        },
+      },
+    },
+  },
+};

ee/spec/frontend/design_management/pages/design/index_spec.js

 import { shallowMount } from '@vue/test-utils';
 import { GlAlert } from '@gitlab/ui';
 import { ApolloMutation } from 'vue-apollo';
+import createFlash from '~/flash';
 import DesignIndex from 'ee/design_management/pages/design/index.vue';
 import DesignDiscussion from 'ee/design_management/components/design_notes/design_discussion.vue';
 import DesignReplyForm from 'ee/design_management/components/design_notes/design_reply_form.vue';
 import Participants from '~/sidebar/components/participants/participants.vue';
 import createImageDiffNoteMutation from 'ee/design_management/graphql/mutations/createImageDiffNote.mutation.graphql';
 import design from '../../mock_data/design';
+import mockResponseNoDesigns from '../../mock_data/no_designs';
+import { DESIGN_NOT_FOUND_ERROR } from 'ee/design_management/utils/error_messages';
+import { DESIGNS_ROUTE_NAME } from 'ee/design_management/router/constants';
 
+jest.mock('~/flash');
 jest.mock('mousetrap', () => ({
   bind: jest.fn(),
   unbind: jest.fn(),
@@ -41,7 +46,8 @@ describe('Design management design index page', () => {
       },
     },
   };
-  const mutate = jest.fn(() => Promise.resolve());
+  const mutate = jest.fn().mockResolvedValue();
+  const routerPush = jest.fn();
 
   const findDiscussions = () => wrapper.findAll(DesignDiscussion);
   const findDiscussionForm = () => wrapper.find(DesignReplyForm);
@@ -57,9 +63,14 @@ describe('Design management design index page', () => {
       mutate,
     };
 
+    const $router = {
+      push: routerPush,
+      query: {},
+    };
+
     wrapper = shallowMount(DesignIndex, {
       propsData: { id: '1' },
-      mocks: { $apollo },
+      mocks: { $apollo, $router },
       stubs: {
         ApolloMutation,
       },
@@ -245,4 +256,32 @@ describe('Design management design index page', () => {
       expect(wrapper.element).toMatchSnapshot();
     });
   });
+
+  describe('onDesignQueryResult', () => {
+    describe('with no designs', () => {
+      it('redirects to /designs', () => {
+        createComponent(true);
+        wrapper.setMethods({
+          onQueryError: jest.fn(),
+        });
+
+        wrapper.vm.onDesignQueryResult(mockResponseNoDesigns);
+        expect(wrapper.vm.onQueryError).toHaveBeenCalledTimes(1);
+        expect(wrapper.vm.onQueryError).toHaveBeenCalledWith(DESIGN_NOT_FOUND_ERROR);
+      });
+    });
+  });
+
+  describe('onQueryError', () => {
+    it('redirects to /designs and displays flash', () => {
+      createComponent(true);
+
+      wrapper.vm.onQueryError(DESIGN_NOT_FOUND_ERROR);
+
+      expect(createFlash).toHaveBeenCalledTimes(1);
+      expect(createFlash).toHaveBeenCalledWith(DESIGN_NOT_FOUND_ERROR);
+      expect(routerPush).toHaveBeenCalledTimes(1);
+      expect(routerPush).toHaveBeenCalledWith({ name: DESIGNS_ROUTE_NAME });
+    });
+  });
 });

ee/spec/frontend/design_management/utils/design_management_utils_spec.js

@@ -5,7 +5,11 @@ import {
   designUploadOptimisticResponse,
   updateImageDiffNoteOptimisticResponse,
   isValidDesignFile,
+  extractDesign,
 } from 'ee/design_management/utils/design_management_utils';
+import mockResponseNoDesigns from '../mock_data/no_designs';
+import mockResponseWithDesigns from '../mock_data/designs';
+import mockDesign from '../mock_data/design';
 
 jest.mock('lodash/uniqueId', () => () => 1);
 
@@ -152,7 +156,21 @@ describe('isValidDesignFile', () => {
     ${'video/mpeg'}               | ${false}
     ${'audio/midi'}               | ${false}
     ${'application/octet-stream'} | ${false}
-  `('returns $valid for file type $mimetype', ({ mimetype, isValid }) => {
+  `('returns $isValid for file type $mimetype', ({ mimetype, isValid }) => {
     expect(isValidDesignFile({ type: mimetype })).toBe(isValid);
   });
 });
+
+describe('extractDesign', () => {
+  describe('with no designs', () => {
+    it('returns undefined', () => {
+      expect(extractDesign(mockResponseNoDesigns)).toBeUndefined();
+    });
+  });
+
+  describe('with designs', () => {
+    it('returns the first design available', () => {
+      expect(extractDesign(mockResponseWithDesigns)).toEqual(mockDesign);
+    });
+  });
+});