Add latest changes from gitlab-org/gitlab@master

10 files changed, 133 insertions, 30 deletions

diff --git a/spec/frontend/admin/abuse_report/components/labels_select_spec.js b/spec/frontend/admin/abuse_report/components/labels_select_spec.js
index a22dcc18e10..6eabaa33189 100644
--- a/spec/frontend/admin/abuse_report/components/labels_select_spec.js
+++ b/spec/frontend/admin/abuse_report/components/labels_select_spec.js
@@ -9,7 +9,7 @@ import LabelsSelect from '~/admin/abuse_report/components/labels_select.vue';
 import createMockApollo from 'helpers/mock_apollo_helper';
 import waitForPromises from 'helpers/wait_for_promises';
 import { stubComponent, RENDER_ALL_SLOTS_TEMPLATE } from 'helpers/stub_component';
-import labelsQuery from '~/admin/abuse_report/components/graphql/abuse_report_labels.query.graphql';
+import labelsQuery from '~/admin/abuse_report/graphql/abuse_report_labels.query.graphql';
 import DropdownWidget from '~/vue_shared/components/dropdown/dropdown_widget/dropdown_widget.vue';
 import DropdownValue from '~/sidebar/components/labels/labels_select_widget/dropdown_value.vue';
 import DropdownHeader from '~/sidebar/components/labels/labels_select_widget/dropdown_header.vue';
diff --git a/spec/frontend/admin/abuse_report/components/report_details_spec.js b/spec/frontend/admin/abuse_report/components/report_details_spec.js
index a5c43dcb82b..a7e732b43b0 100644
--- a/spec/frontend/admin/abuse_report/components/report_details_spec.js
+++ b/spec/frontend/admin/abuse_report/components/report_details_spec.js
@@ -5,7 +5,7 @@ import LabelsSelect from '~/admin/abuse_report/components/labels_select.vue';
 import ReportDetails from '~/admin/abuse_report/components/report_details.vue';
 import createMockApollo from 'helpers/mock_apollo_helper';
 import waitForPromises from 'helpers/wait_for_promises';
-import abuseReportQuery from '~/admin/abuse_report/components/graphql/abuse_report.query.graphql';
+import abuseReportQuery from '~/admin/abuse_report/graphql/abuse_report.query.graphql';
 import { createAlert } from '~/alert';
 import { mockAbuseReport, mockLabel1, mockReportQueryResponse } from '../mock_data';
 
diff --git a/spec/frontend/admin/abuse_report/mock_data.js b/spec/frontend/admin/abuse_report/mock_data.js
index ee61eabfa66..c7faddf1d13 100644
--- a/spec/frontend/admin/abuse_report/mock_data.js
+++ b/spec/frontend/admin/abuse_report/mock_data.js
@@ -103,10 +103,14 @@ export const mockLabelsQueryResponse = {
 export const mockReportQueryResponse = {
   data: {
     abuseReport: {
+      id: 'gid://gitlab/AbuseReport/1',
       labels: {
         nodes: [mockLabel1],
         __typename: 'LabelConnection',
       },
+      discussions: {
+        nodes: [],
+      },
       __typename: 'AbuseReport',
     },
   },
diff --git a/spec/frontend/groups/members/utils_spec.js b/spec/frontend/groups/members/utils_spec.js
index 0912e66e3e8..c7874b8b896 100644
--- a/spec/frontend/groups/members/utils_spec.js
+++ b/spec/frontend/groups/members/utils_spec.js
@@ -8,7 +8,19 @@ describe('group member utils', () => {
           accessLevel: 50,
           expires_at: '2020-10-16',
         }),
-      ).toEqual({ group_member: { access_level: 50, expires_at: '2020-10-16' } });
+      ).toEqual({
+        group_member: { access_level: 50, expires_at: '2020-10-16', member_role_id: null },
+      });
+
+      expect(
+        groupMemberRequestFormatter({
+          accessLevel: 50,
+          expires_at: '2020-10-16',
+          memberRoleId: 80,
+        }),
+      ).toEqual({
+        group_member: { access_level: 50, expires_at: '2020-10-16', member_role_id: 80 },
+      });
     });
   });
 });
diff --git a/spec/frontend/members/components/table/role_dropdown_spec.js b/spec/frontend/members/components/table/role_dropdown_spec.js
index 915b2ae17ae..62275a05dc5 100644
--- a/spec/frontend/members/components/table/role_dropdown_spec.js
+++ b/spec/frontend/members/components/table/role_dropdown_spec.js
@@ -71,9 +71,7 @@ describe('RoleDropdown', () => {
 
   it('has items prop with all valid roles', () => {
     createComponent();
-    const roles = findListbox()
-      .props('items')
-      .map((item) => item.text);
+    const roles = findListboxItems().wrappers.map((item) => item.text());
     expect(roles).toEqual(Object.keys(member.validRoles));
   });
 
@@ -102,7 +100,7 @@ describe('RoleDropdown', () => {
 
         expect(actions.updateMemberRole).toHaveBeenCalledWith(expect.any(Object), {
           memberId: member.id,
-          accessLevel: { integerValue: 30, stringValue: 'Developer' },
+          accessLevel: { integerValue: 30, memberRoleId: null },
         });
       });
 
@@ -247,7 +245,7 @@ describe('RoleDropdown', () => {
       });
 
       it('resets selected dropdown item', () => {
-        expect(findListbox().props('selected')).toBe(member.validRoles.Owner);
+        expect(findListbox().props('selected')).toMatch(/role-static-\d+/);
       });
     });
   });
diff --git a/spec/frontend/members/mock_data.js b/spec/frontend/members/mock_data.js
index 161e96c0c48..4598c74757e 100644
--- a/spec/frontend/members/mock_data.js
+++ b/spec/frontend/members/mock_data.js
@@ -50,6 +50,7 @@ export const member = {
     Owner: 50,
     'Minimal access': 5,
   },
+  customRoles: [],
 };
 
 export const group = {
diff --git a/spec/frontend/members/store/actions_spec.js b/spec/frontend/members/store/actions_spec.js
index 38214048b23..3df3d85c4f1 100644
--- a/spec/frontend/members/store/actions_spec.js
+++ b/spec/frontend/members/store/actions_spec.js
@@ -15,6 +15,8 @@ import {
 } from '~/members/store/actions';
 import * as types from '~/members/store/mutation_types';
 
+const mockedRequestFormatter = jest.fn().mockImplementation(noop);
+
 describe('Vuex members actions', () => {
   describe('update member actions', () => {
     let mock;
@@ -22,7 +24,7 @@ describe('Vuex members actions', () => {
     const state = {
       members,
       memberPath: '/groups/foo-bar/-/group_members/:id',
-      requestFormatter: noop,
+      requestFormatter: mockedRequestFormatter,
     };
 
     beforeEach(() => {
@@ -35,7 +37,7 @@ describe('Vuex members actions', () => {
 
     describe('updateMemberRole', () => {
       const memberId = members[0].id;
-      const accessLevel = { integerValue: 30, stringValue: 'Developer' };
+      const accessLevel = { integerValue: 30, memberRoleId: 90 };
 
       const payload = {
         memberId,
@@ -54,6 +56,10 @@ describe('Vuex members actions', () => {
           ]);
 
           expect(mock.history.put[0].url).toBe('/groups/foo-bar/-/group_members/238');
+          expect(mockedRequestFormatter).toHaveBeenCalledWith({
+            accessLevel: accessLevel.integerValue,
+            memberRoleId: accessLevel.memberRoleId,
+          });
         });
       });
 
diff --git a/spec/frontend/members/utils_spec.js b/spec/frontend/members/utils_spec.js
index c4357e9c1f0..54f5433c9c9 100644
--- a/spec/frontend/members/utils_spec.js
+++ b/spec/frontend/members/utils_spec.js
@@ -22,6 +22,8 @@ import {
   buildSortHref,
   parseDataAttributes,
   groupLinkRequestFormatter,
+  roleDropdownItems,
+  initialSelectedRole,
 } from '~/members/utils';
 import {
   member as memberMock,
@@ -35,6 +37,8 @@ import {
   dataAttribute,
 } from './mock_data';
 
+jest.mock('lodash/uniqueId', () => (prefix) => `${prefix}0`);
+
 const IS_CURRENT_USER_ID = 123;
 const IS_NOT_CURRENT_USER_ID = 124;
 const URL_HOST = 'https://localhost/';
@@ -317,7 +321,46 @@ describe('Members Utils', () => {
           accessLevel: 50,
           expires_at: '2020-10-16',
         }),
-      ).toEqual({ group_link: { group_access: 50, expires_at: '2020-10-16' } });
+      ).toEqual({
+        group_link: { group_access: 50, expires_at: '2020-10-16', member_role_id: null },
+      });
+
+      expect(
+        groupLinkRequestFormatter({
+          accessLevel: 50,
+          expires_at: '2020-10-16',
+          memberRoleId: 80,
+        }),
+      ).toEqual({
+        group_link: { group_access: 50, expires_at: '2020-10-16', member_role_id: 80 },
+      });
+    });
+  });
+
+  describe('roleDropdownItems', () => {
+    it('returns properly flatten and formatted dropdowns', () => {
+      const { flatten, formatted } = roleDropdownItems(members[0]);
+
+      expect(flatten).toEqual(formatted);
+      expect(flatten[0]).toMatchObject({
+        text: 'Guest',
+        value: 'role-static-0',
+        accessLevel: 10,
+        memberRoleId: null,
+      });
+    });
+  });
+
+  describe('initialSelectedRole', () => {
+    it('find and return correct value', () => {
+      expect(
+        initialSelectedRole(
+          [{ accessLevel: 10, memberRoleId: null, text: 'Guest', value: 'role-static-0' }],
+          {
+            accessLevel: { integerValue: 10 },
+          },
+        ),
+      ).toBe('role-static-0');
     });
   });
 });
diff --git a/spec/frontend/projects/members/utils_spec.js b/spec/frontend/projects/members/utils_spec.js
index 813e8455e85..2624851d9d8 100644
--- a/spec/frontend/projects/members/utils_spec.js
+++ b/spec/frontend/projects/members/utils_spec.js
@@ -8,7 +8,19 @@ describe('project member utils', () => {
           accessLevel: 50,
           expires_at: '2020-10-16',
         }),
-      ).toEqual({ project_member: { access_level: 50, expires_at: '2020-10-16' } });
+      ).toEqual({
+        project_member: { access_level: 50, expires_at: '2020-10-16', member_role_id: null },
+      });
+
+      expect(
+        projectMemberRequestFormatter({
+          accessLevel: 50,
+          expires_at: '2020-10-16',
+          memberRoleId: 80,
+        }),
+      ).toEqual({
+        project_member: { access_level: 50, expires_at: '2020-10-16', member_role_id: 80 },
+      });
     });
   });
 });
diff --git a/spec/frontend/vue_merge_request_widget/extensions/security_reports/mr_widget_security_reports_spec.js b/spec/frontend/vue_merge_request_widget/extensions/security_reports/mr_widget_security_reports_spec.js
index e23cd92f53e..b277a9f6716 100644
--- a/spec/frontend/vue_merge_request_widget/extensions/security_reports/mr_widget_security_reports_spec.js
+++ b/spec/frontend/vue_merge_request_widget/extensions/security_reports/mr_widget_security_reports_spec.js
@@ -1,5 +1,5 @@
 import Vue from 'vue';
-import { GlDropdown } from '@gitlab/ui';
+import { GlDisclosureDropdown } from '@gitlab/ui';
 import VueApollo from 'vue-apollo';
 import MRSecurityWidget from '~/vue_merge_request_widget/extensions/security_reports/mr_widget_security_reports.vue';
 import Widget from '~/vue_merge_request_widget/components/widget/widget.vue';
@@ -27,8 +27,7 @@ describe('vue_merge_request_widget/extensions/security_reports/mr_widget_securit
   };
 
   const findWidget = () => wrapper.findComponent(Widget);
-  const findDropdown = () => wrapper.findComponent(GlDropdown);
-  const findDropdownItem = (name) => wrapper.findByTestId(name);
+  const findDropdown = () => wrapper.findComponent(GlDisclosureDropdown);
 
   describe('with data', () => {
     beforeEach(async () => {
@@ -55,24 +54,52 @@ describe('vue_merge_request_widget/extensions/security_reports/mr_widget_securit
     });
 
     it.each`
-      artifactName       | exists   | downloadPath
-      ${'sam_scan'}      | ${true}  | ${'/root/security-reports/-/jobs/14/artifacts/download?file_type=sast'}
-      ${'sast-spotbugs'} | ${true}  | ${'/root/security-reports/-/jobs/11/artifacts/download?file_type=sast'}
-      ${'sast-sobelow'}  | ${false} | ${''}
-      ${'sast-pmd-apex'} | ${false} | ${''}
-      ${'sast-eslint'}   | ${true}  | ${'/root/security-reports/-/jobs/8/artifacts/download?file_type=sast'}
-      ${'secrets'}       | ${true}  | ${'/root/security-reports/-/jobs/7/artifacts/download?file_type=secret_detection'}
+      artifactName       | downloadPath
+      ${'sam_scan'}      | ${'/root/security-reports/-/jobs/14/artifacts/download?file_type=sast'}
+      ${'sast-spotbugs'} | ${'/root/security-reports/-/jobs/11/artifacts/download?file_type=sast'}
+      ${'sast-eslint'}   | ${'/root/security-reports/-/jobs/8/artifacts/download?file_type=sast'}
+      ${'secrets'}       | ${'/root/security-reports/-/jobs/7/artifacts/download?file_type=secret_detection'}
     `(
-      'has a dropdown to download $artifactName artifacts',
-      ({ artifactName, exists, downloadPath }) => {
+      'has a dropdown item to download $artifactName artifacts',
+      ({ artifactName, downloadPath }) => {
         expect(findDropdown().exists()).toBe(true);
-        expect(wrapper.findByText(`Download ${artifactName}`).exists()).toBe(exists);
 
-        if (exists) {
-          const dropdownItem = findDropdownItem(`download-${artifactName}`);
-          expect(dropdownItem.attributes('download')).toBe('');
-          expect(dropdownItem.attributes('href')).toBe(downloadPath);
-        }
+        expect(findDropdown().props('items')).toEqual(
+          expect.arrayContaining([
+            {
+              href: downloadPath,
+              text: `Download ${artifactName}`,
+              extraAttrs: {
+                download: '',
+                rel: 'nofollow',
+              },
+            },
+          ]),
+        );
+      },
+    );
+
+    it.each`
+      artifactName       | downloadPath
+      ${'sast-sobelow'}  | ${''}
+      ${'sast-pmd-apex'} | ${''}
+    `(
+      'does not have a dropdown item to download $artifactName artifacts',
+      ({ artifactName, downloadPath }) => {
+        expect(findDropdown().exists()).toBe(true);
+
+        expect(findDropdown().props('items')).not.toEqual(
+          expect.arrayContaining([
+            {
+              href: downloadPath,
+              text: `Download ${artifactName}`,
+              extraAttrs: {
+                download: '',
+                rel: 'nofollow',
+              },
+            },
+          ]),
+        );
       },
     );
   });