Add latest changes from gitlab-org/gitlab@master

5 files changed, 72 insertions, 52 deletions

diff --git a/spec/frontend/boards/components/board_app_spec.js b/spec/frontend/boards/components/board_app_spec.js
index 872a67a71fb..12318fb5d16 100644
--- a/spec/frontend/boards/components/board_app_spec.js
+++ b/spec/frontend/boards/components/board_app_spec.js
@@ -27,7 +27,7 @@ describe('BoardApp', () => {
     wrapper = shallowMount(BoardApp, {
       store,
       provide: {
-        fullBoardId: 'gid://gitlab/Board/1',
+        initialBoardId: 'gid://gitlab/Board/1',
       },
     });
   };
diff --git a/spec/frontend/boards/components/board_top_bar_spec.js b/spec/frontend/boards/components/board_top_bar_spec.js
index af492145eb0..8258d9fe7f4 100644
--- a/spec/frontend/boards/components/board_top_bar_spec.js
+++ b/spec/frontend/boards/components/board_top_bar_spec.js
@@ -1,6 +1,8 @@
 import { shallowMount } from '@vue/test-utils';
-import Vue from 'vue';
+import Vue, { nextTick } from 'vue';
+import VueApollo from 'vue-apollo';
 import Vuex from 'vuex';
+import createMockApollo from 'helpers/mock_apollo_helper';
 
 import BoardTopBar from '~/boards/components/board_top_bar.vue';
 import BoardAddNewColumnTrigger from '~/boards/components/board_add_new_column_trigger.vue';
@@ -9,11 +11,18 @@ import ConfigToggle from '~/boards/components/config_toggle.vue';
 import IssueBoardFilteredSearch from '~/boards/components/issue_board_filtered_search.vue';
 import NewBoardButton from '~/boards/components/new_board_button.vue';
 import ToggleFocus from '~/boards/components/toggle_focus.vue';
+import { BoardType } from '~/boards/constants';
+
+import groupBoardQuery from '~/boards/graphql/group_board.query.graphql';
+import projectBoardQuery from '~/boards/graphql/project_board.query.graphql';
+import { mockProjectBoardResponse, mockGroupBoardResponse } from '../mock_data';
+
+Vue.use(VueApollo);
+Vue.use(Vuex);
 
 describe('BoardTopBar', () => {
   let wrapper;
-
-  Vue.use(Vuex);
+  let mockApollo;
 
   const createStore = () => {
     return new Vuex.Store({
@@ -21,10 +30,22 @@ describe('BoardTopBar', () => {
     });
   };
 
+  const projectBoardQueryHandlerSuccess = jest.fn().mockResolvedValue(mockProjectBoardResponse);
+  const groupBoardQueryHandlerSuccess = jest.fn().mockResolvedValue(mockGroupBoardResponse);
+
   const createComponent = ({ provide = {} } = {}) => {
     const store = createStore();
+    mockApollo = createMockApollo([
+      [projectBoardQuery, projectBoardQueryHandlerSuccess],
+      [groupBoardQuery, groupBoardQueryHandlerSuccess],
+    ]);
+
     wrapper = shallowMount(BoardTopBar, {
       store,
+      apolloProvider: mockApollo,
+      props: {
+        boardId: 'gid://gitlab/Board/1',
+      },
       provide: {
         swimlanesFeatureAvailable: false,
         canAdminList: false,
@@ -33,7 +54,9 @@ describe('BoardTopBar', () => {
         boardType: 'group',
         releasesFetchPath: '/releases',
         isIssueBoard: true,
+        isEpicBoard: false,
         isGroupBoard: true,
+        isApolloBoard: false,
         ...provide,
       },
       stubs: { IssueBoardFilteredSearch },
@@ -42,6 +65,7 @@ describe('BoardTopBar', () => {
 
   afterEach(() => {
     wrapper.destroy();
+    mockApollo = null;
   });
 
   describe('base template', () => {
@@ -83,4 +107,26 @@ describe('BoardTopBar', () => {
       expect(wrapper.findComponent(BoardAddNewColumnTrigger).exists()).toBe(true);
     });
   });
+
+  describe('Apollo boards', () => {
+    it.each`
+      boardType            | queryHandler                       | notCalledHandler
+      ${BoardType.group}   | ${groupBoardQueryHandlerSuccess}   | ${projectBoardQueryHandlerSuccess}
+      ${BoardType.project} | ${projectBoardQueryHandlerSuccess} | ${groupBoardQueryHandlerSuccess}
+    `('fetches $boardType boards', async ({ boardType, queryHandler, notCalledHandler }) => {
+      createComponent({
+        provide: {
+          boardType,
+          isProjectBoard: boardType === BoardType.project,
+          isGroupBoard: boardType === BoardType.group,
+          isApolloBoard: true,
+        },
+      });
+
+      await nextTick();
+
+      expect(queryHandler).toHaveBeenCalled();
+      expect(notCalledHandler).not.toHaveBeenCalled();
+    });
+  });
 });
diff --git a/spec/frontend/boards/components/boards_selector_spec.js b/spec/frontend/boards/components/boards_selector_spec.js
index 7b61ca5e6fd..dfd8d2351a6 100644
--- a/spec/frontend/boards/components/boards_selector_spec.js
+++ b/spec/frontend/boards/components/boards_selector_spec.js
@@ -108,6 +108,7 @@ describe('BoardsSelector', () => {
         boardType: isGroupBoard ? 'group' : 'project',
         isGroupBoard,
         isProjectBoard,
+        isApolloBoard: false,
       },
     });
   };
diff --git a/spec/frontend/boards/mock_data.js b/spec/frontend/boards/mock_data.js
index df41eb05eae..0ab8a89bcca 100644
--- a/spec/frontend/boards/mock_data.js
+++ b/spec/frontend/boards/mock_data.js
@@ -50,6 +50,26 @@ export const mockBoard = {
   weight: 2,
 };
 
+export const mockProjectBoardResponse = {
+  data: {
+    workspace: {
+      id: 'gid://gitlab/Project/114',
+      board: mockBoard,
+      __typename: 'Project',
+    },
+  },
+};
+
+export const mockGroupBoardResponse = {
+  data: {
+    workspace: {
+      id: 'gid://gitlab/Group/114',
+      board: mockBoard,
+      __typename: 'Group',
+    },
+  },
+};
+
 export const mockBoardConfig = {
   milestoneId: 'gid://gitlab/Milestone/114',
   milestoneTitle: '14.9',
diff --git a/spec/frontend/flash_spec.js b/spec/frontend/flash_spec.js
index 2f0a52a9884..334117e0e3c 100644
--- a/spec/frontend/flash_spec.js
+++ b/spec/frontend/flash_spec.js
@@ -1,12 +1,6 @@
 import * as Sentry from '@sentry/browser';
 import { setHTMLFixture, resetHTMLFixture } from 'helpers/fixtures';
-import {
-  hideFlash,
-  addDismissFlashClickListener,
-  FLASH_CLOSED_EVENT,
-  createAlert,
-  VARIANT_WARNING,
-} from '~/flash';
+import { hideFlash, FLASH_CLOSED_EVENT, createAlert, VARIANT_WARNING } from '~/flash';
 
 jest.mock('@sentry/browser');
 
@@ -338,45 +332,4 @@ describe('Flash', () => {
       });
     });
   });
-
-  describe('addDismissFlashClickListener', () => {
-    let el;
-
-    describe('with close icon', () => {
-      beforeEach(() => {
-        el = document.createElement('div');
-        el.innerHTML = `
-          <div class="flash-container">
-            <div class="flash">
-              <div class="close-icon js-close-icon"></div>
-            </div>
-          </div>
-        `;
-      });
-
-      it('removes global flash on click', () => {
-        addDismissFlashClickListener(el, false);
-
-        el.querySelector('.js-close-icon').click();
-
-        expect(document.querySelector('.flash')).toBeNull();
-      });
-    });
-
-    describe('without close icon', () => {
-      beforeEach(() => {
-        el = document.createElement('div');
-        el.innerHTML = `
-          <div class="flash-container">
-            <div class="flash">
-            </div>
-          </div>
-        `;
-      });
-
-      it('does not throw', () => {
-        expect(() => addDismissFlashClickListener(el, false)).not.toThrow();
-      });
-    });
-  });
 });