diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-11-22 18:11:39 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-11-22 18:11:39 +0300 |
commit | 51ad17b4112ce677613ed2af7f8b742fe2ba2afe (patch) | |
tree | c67859e3f7f5551a48e5dd3a541e645a1fd1a12d /spec/frontend/invite_members/components | |
parent | 49203bfa3c7eb607a7561ae7da9b5c52aa49fd77 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend/invite_members/components')
3 files changed, 64 insertions, 6 deletions
diff --git a/spec/frontend/invite_members/components/invite_groups_modal_spec.js b/spec/frontend/invite_members/components/invite_groups_modal_spec.js index 4136de75545..358d70d8117 100644 --- a/spec/frontend/invite_members/components/invite_groups_modal_spec.js +++ b/spec/frontend/invite_members/components/invite_groups_modal_spec.js @@ -77,6 +77,16 @@ describe('InviteGroupsModal', () => { const clickInviteButton = emitClickFromModal('invite-modal-submit'); const clickCancelButton = emitClickFromModal('invite-modal-cancel'); + describe('passes correct props to InviteModalBase', () => { + it('set accessLevel', () => { + createInviteGroupToProjectWrapper(); + + expect(findBase().props('accessLevels')).toMatchObject({ + validRoles: propsData.accessLevels, + }); + }); + }); + describe('displaying the correct introText and form group description', () => { describe('when inviting to a project', () => { it('includes the correct type, and formatted intro text', () => { diff --git a/spec/frontend/invite_members/components/invite_members_modal_spec.js b/spec/frontend/invite_members/components/invite_members_modal_spec.js index 19b7fad5fc8..ad3174b8946 100644 --- a/spec/frontend/invite_members/components/invite_members_modal_spec.js +++ b/spec/frontend/invite_members/components/invite_members_modal_spec.js @@ -128,6 +128,7 @@ describe('InviteMembersModal', () => { }); const findModal = () => wrapper.findComponent(GlModal); + const findBase = () => wrapper.findComponent(InviteModalBase); const findIntroText = () => wrapper.findByTestId('modal-base-intro-text').text(); const findEmptyInvitesAlert = () => wrapper.findByTestId('empty-invites-alert'); const findMemberErrorAlert = () => wrapper.findByTestId('alert-member-error'); @@ -168,6 +169,22 @@ describe('InviteMembersModal', () => { await nextTick(); }; + describe('passes correct props to InviteModalBase', () => { + it('set defaultMemberRoleId', () => { + createInviteMembersToProjectWrapper(); + + expect(findBase().props('defaultMemberRoleId')).toBeNull(); + }); + + it('set accessLevel', () => { + createInviteMembersToProjectWrapper(); + + expect(findBase().props('accessLevels')).toMatchObject({ + validRoles: propsData.accessLevels, + }); + }); + }); + describe('rendering with tracking considerations', () => { describe('when inviting to a project', () => { describe('when inviting members', () => { diff --git a/spec/frontend/invite_members/components/invite_modal_base_spec.js b/spec/frontend/invite_members/components/invite_modal_base_spec.js index 345df1722bc..c26d1d921a5 100644 --- a/spec/frontend/invite_members/components/invite_modal_base_spec.js +++ b/spec/frontend/invite_members/components/invite_modal_base_spec.js @@ -7,6 +7,7 @@ import { GlModal, GlIcon, } from '@gitlab/ui'; +import { nextTick } from 'vue'; import { stubComponent } from 'helpers/stub_component'; import { mockTracking, unmockTracking } from 'helpers/tracking_helper'; import { @@ -45,6 +46,7 @@ describe('InviteModalBase', () => { wrapper = mountFn(InviteModalBase, { propsData: { ...propsData, + accessLevels: { validRoles: propsData.accessLevels }, ...props, }, stubs: { @@ -58,8 +60,8 @@ describe('InviteModalBase', () => { }); }; - const findListbox = () => extendedWrapper(wrapper.findComponent(GlCollapsibleListbox)); - const findListboxOptions = () => findListbox().findAllByRole('option'); + const findCollapsibleListbox = () => extendedWrapper(wrapper.findComponent(GlCollapsibleListbox)); + const findCollapsibleListboxOptions = () => findCollapsibleListbox().findAllByRole('option'); const findDatepicker = () => wrapper.findComponent(GlDatepicker); const findLink = () => wrapper.findComponent(GlLink); const findIcon = () => wrapper.findComponent(GlIcon); @@ -106,18 +108,47 @@ describe('InviteModalBase', () => { describe('rendering the access levels dropdown', () => { beforeEach(() => { createComponent({ + props: { isLoadingRoles: true }, mountFn: mountExtended, }); }); + it('passes `isLoadingRoles` prop to the dropdown', () => { + expect(findCollapsibleListbox().props('loading')).toBe(true); + }); + it('sets the default dropdown text to the default access level name', () => { - expect(findListbox().exists()).toBe(true); - const option = findListbox().find('[aria-selected]'); + expect(findCollapsibleListbox().exists()).toBe(true); + const option = findCollapsibleListbox().find('[aria-selected]'); + expect(option.text()).toBe('Reporter'); + }); + + it('updates the selection base on changes in the dropdown', async () => { + wrapper.setProps({ accessLevels: { validRoles: [] } }); + expect(findCollapsibleListbox().props('selected')).not.toHaveLength(0); + await nextTick(); + + expect(findCollapsibleListboxOptions()).toHaveLength(0); + expect(findCollapsibleListbox().props('selected')).toHaveLength(0); + }); + + it('reset the dropdown to the default option', async () => { + const developerOption = findCollapsibleListboxOptions().at(2); + await developerOption.trigger('click'); + + let option; + option = findCollapsibleListbox().find('[aria-selected]'); + expect(option.text()).toBe('Developer'); + + // Reset the dropdown by clicking cancel button + await findCancelButton().trigger('click'); + + option = findCollapsibleListbox().find('[aria-selected]'); expect(option.text()).toBe('Reporter'); }); it('renders dropdown items for each accessLevel', () => { - expect(findListboxOptions()).toHaveLength(5); + expect(findCollapsibleListboxOptions()).toHaveLength(5); }); }); @@ -215,7 +246,7 @@ describe('InviteModalBase', () => { it('renders correct blocks', () => { expect(findIcon().exists()).toBe(false); expect(findDisabledInput().exists()).toBe(false); - expect(findListbox().exists()).toBe(true); + expect(findCollapsibleListbox().exists()).toBe(true); expect(findDatepicker().exists()).toBe(true); expect(wrapper.findComponent(GlModal).text()).toMatch(textRegex); }); |