diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-07-20 06:08:56 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-07-20 06:08:56 +0300 |
commit | 0624f8b515fe2e40268f397cf698e3277c5d3877 (patch) | |
tree | b6fae3b679b2b14619e8480e3845013deafafbec /spec/frontend/invite_members/components | |
parent | 3c25c55bf591097e96170c2d2da1b40d295cc981 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend/invite_members/components')
-rw-r--r-- | spec/frontend/invite_members/components/import_project_members_modal_spec.js | 95 |
1 files changed, 93 insertions, 2 deletions
diff --git a/spec/frontend/invite_members/components/import_project_members_modal_spec.js b/spec/frontend/invite_members/components/import_project_members_modal_spec.js index 224ebe18e2a..4fac21f7a57 100644 --- a/spec/frontend/invite_members/components/import_project_members_modal_spec.js +++ b/spec/frontend/invite_members/components/import_project_members_modal_spec.js @@ -1,4 +1,4 @@ -import { GlFormGroup, GlSprintf, GlModal } from '@gitlab/ui'; +import { GlFormGroup, GlSprintf, GlModal, GlCollapse, GlIcon } from '@gitlab/ui'; import MockAdapter from 'axios-mock-adapter'; import { nextTick } from 'vue'; import { createWrapper } from '@vue/test-utils'; @@ -12,6 +12,7 @@ import eventHub from '~/invite_members/event_hub'; import ImportProjectMembersModal from '~/invite_members/components/import_project_members_modal.vue'; import ProjectSelect from '~/invite_members/components/project_select.vue'; import axios from '~/lib/utils/axios_utils'; +import { HTTP_STATUS_CREATED } from '~/lib/utils/http_status'; import { displaySuccessfulInvitationAlert, @@ -19,9 +20,14 @@ import { } from '~/invite_members/utils/trigger_successful_invite_alert'; import { + EXPANDED_ERRORS, IMPORT_PROJECT_MEMBERS_MODAL_TRACKING_CATEGORY, IMPORT_PROJECT_MEMBERS_MODAL_TRACKING_LABEL, } from '~/invite_members/constants'; +import { + IMPORT_PROJECT_MEMBERS_PATH, + importProjectMembersApiResponse, +} from '../mock_data/api_responses'; jest.mock('~/invite_members/utils/trigger_successful_invite_alert'); @@ -92,6 +98,14 @@ describe('ImportProjectMembersModal', () => { const formGroupInvalidFeedback = () => findFormGroup().props('invalidFeedback'); const formGroupErrorState = () => findFormGroup().props('state'); const findProjectSelect = () => wrapper.findComponent(ProjectSelect); + const findMemberErrorAlert = () => wrapper.findByTestId('alert-member-error'); + const findMoreInviteErrorsButton = () => wrapper.findByTestId('accordion-button'); + const findAccordion = () => wrapper.findComponent(GlCollapse); + const findErrorsIcon = () => wrapper.findComponent(GlIcon); + const findMemberErrorMessage = (element) => + `@${Object.keys(importProjectMembersApiResponse.EXPANDED_IMPORT_ERRORS.message)[element]}: ${ + Object.values(importProjectMembersApiResponse.EXPANDED_IMPORT_ERRORS.message)[element] + }`; describe('rendering the modal', () => { beforeEach(() => { @@ -241,7 +255,7 @@ describe('ImportProjectMembersModal', () => { }); }); - describe('when the import fails', () => { + describe('when the import fails due to generic api error', () => { beforeEach(async () => { createComponent(); @@ -276,5 +290,82 @@ describe('ImportProjectMembersModal', () => { expect(formGroupErrorState()).not.toBe(false); }); }); + + describe('when the import fails with member import errors', () => { + const mockInvitationsApi = (code, data) => { + mock.onPost(IMPORT_PROJECT_MEMBERS_PATH).reply(code, data); + }; + + beforeEach(() => { + createComponent(); + findProjectSelect().vm.$emit('input', projectToBeImported); + }); + + it('displays the error alert', async () => { + mockInvitationsApi( + HTTP_STATUS_CREATED, + importProjectMembersApiResponse.NO_COLLAPSE_IMPORT_ERRORS, + ); + + clickImportButton(); + await waitForPromises(); + + expect(findMemberErrorAlert().props('title')).toContain( + 'The following 2 out of 2 members could not be added', + ); + expect(findMemberErrorAlert().text()).toContain(findMemberErrorMessage(0)); + expect(findMemberErrorAlert().text()).toContain(findMemberErrorMessage(1)); + }); + + it('displays collapse when there are more than 2 errors', async () => { + mockInvitationsApi( + HTTP_STATUS_CREATED, + importProjectMembersApiResponse.EXPANDED_IMPORT_ERRORS, + ); + + clickImportButton(); + await waitForPromises(); + + expect(findAccordion().exists()).toBe(true); + expect(findMoreInviteErrorsButton().text()).toContain('Show more (2)'); + }); + + it('toggles the collapse on click', async () => { + mockInvitationsApi( + HTTP_STATUS_CREATED, + importProjectMembersApiResponse.EXPANDED_IMPORT_ERRORS, + ); + + clickImportButton(); + await waitForPromises(); + + expect(findMoreInviteErrorsButton().text()).toContain('Show more (2)'); + expect(findErrorsIcon().attributes('class')).not.toContain('gl-rotate-180'); + expect(findAccordion().attributes('visible')).toBeUndefined(); + + await findMoreInviteErrorsButton().vm.$emit('click'); + + expect(findMoreInviteErrorsButton().text()).toContain(EXPANDED_ERRORS); + expect(findErrorsIcon().attributes('class')).toContain('gl-rotate-180'); + expect(findAccordion().attributes('visible')).toBeDefined(); + + await findMoreInviteErrorsButton().vm.$emit('click'); + + expect(findMoreInviteErrorsButton().text()).toContain('Show more (2)'); + }); + + it("doesn't display collapse when there are 2 or less errors", async () => { + mockInvitationsApi( + HTTP_STATUS_CREATED, + importProjectMembersApiResponse.NO_COLLAPSE_IMPORT_ERRORS, + ); + + clickImportButton(); + await waitForPromises(); + + expect(findAccordion().exists()).toBe(false); + expect(findMoreInviteErrorsButton().exists()).toBe(false); + }); + }); }); }); |