diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2022-02-18 09:45:46 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2022-02-18 09:45:46 +0000 |
commit | a7b3560714b4d9cc4ab32dffcd1f74a284b93580 (patch) | |
tree | 7452bd5c3545c2fa67a28aa013835fb4fa071baf /spec/frontend/issuable/related_issues | |
parent | ee9173579ae56a3dbfe5afe9f9410c65bb327ca7 (diff) | |
download | gitlab-ce-a7b3560714b4d9cc4ab32dffcd1f74a284b93580.tar.gz |
Add latest changes from gitlab-org/gitlab@14-8-stable-eev14.8.0-rc42
Diffstat (limited to 'spec/frontend/issuable/related_issues')
3 files changed, 84 insertions, 47 deletions
diff --git a/spec/frontend/issuable/related_issues/components/add_issuable_form_spec.js b/spec/frontend/issuable/related_issues/components/add_issuable_form_spec.js index ff6922989cb..ce98a16dbb7 100644 --- a/spec/frontend/issuable/related_issues/components/add_issuable_form_spec.js +++ b/spec/frontend/issuable/related_issues/components/add_issuable_form_spec.js @@ -1,4 +1,6 @@ +import { GlFormGroup } from '@gitlab/ui'; import { mount, shallowMount } from '@vue/test-utils'; +import { nextTick } from 'vue'; import AddIssuableForm from '~/related_issues/components/add_issuable_form.vue'; import IssueToken from '~/related_issues/components/issue_token.vue'; import { issuableTypesMap, linkedIssueTypesMap, PathIdSeparator } from '~/related_issues/constants'; @@ -152,6 +154,30 @@ describe('AddIssuableForm', () => { }); }); + describe('categorized issuables', () => { + it.each` + issuableType | pathIdSeparator | contextHeader | contextFooter + ${issuableTypesMap.ISSUE} | ${PathIdSeparator.Issue} | ${'The current issue'} | ${'the following issue(s)'} + ${issuableTypesMap.EPIC} | ${PathIdSeparator.Epic} | ${'The current epic'} | ${'the following epic(s)'} + `( + 'show header text as "$contextHeader" and footer text as "$contextFooter" issuableType is set to $issuableType', + ({ issuableType, contextHeader, contextFooter }) => { + wrapper = shallowMount(AddIssuableForm, { + propsData: { + issuableType, + inputValue: '', + showCategorizedIssues: true, + pathIdSeparator, + pendingReferences: [], + }, + }); + + expect(wrapper.findComponent(GlFormGroup).attributes('label')).toBe(contextHeader); + expect(wrapper.find('p.bold').text()).toContain(contextFooter); + }, + ); + }); + describe('when it is a Linked Issues form', () => { beforeEach(() => { wrapper = mount(AddIssuableForm, { @@ -194,63 +220,55 @@ describe('AddIssuableForm', () => { }); describe('when the form is submitted', () => { - it('emits an event with a "relates_to" link type when the "relates to" radio input selected', (done) => { + it('emits an event with a "relates_to" link type when the "relates to" radio input selected', async () => { jest.spyOn(wrapper.vm, '$emit').mockImplementation(() => {}); wrapper.vm.linkedIssueType = linkedIssueTypesMap.RELATES_TO; wrapper.vm.onFormSubmit(); - wrapper.vm.$nextTick(() => { - expect(wrapper.vm.$emit).toHaveBeenCalledWith('addIssuableFormSubmit', { - pendingReferences: '', - linkedIssueType: linkedIssueTypesMap.RELATES_TO, - }); - done(); + await nextTick(); + expect(wrapper.vm.$emit).toHaveBeenCalledWith('addIssuableFormSubmit', { + pendingReferences: '', + linkedIssueType: linkedIssueTypesMap.RELATES_TO, }); }); - it('emits an event with a "blocks" link type when the "blocks" radio input selected', (done) => { + it('emits an event with a "blocks" link type when the "blocks" radio input selected', async () => { jest.spyOn(wrapper.vm, '$emit').mockImplementation(() => {}); wrapper.vm.linkedIssueType = linkedIssueTypesMap.BLOCKS; wrapper.vm.onFormSubmit(); - wrapper.vm.$nextTick(() => { - expect(wrapper.vm.$emit).toHaveBeenCalledWith('addIssuableFormSubmit', { - pendingReferences: '', - linkedIssueType: linkedIssueTypesMap.BLOCKS, - }); - done(); + await nextTick(); + expect(wrapper.vm.$emit).toHaveBeenCalledWith('addIssuableFormSubmit', { + pendingReferences: '', + linkedIssueType: linkedIssueTypesMap.BLOCKS, }); }); - it('emits an event with a "is_blocked_by" link type when the "is blocked by" radio input selected', (done) => { + it('emits an event with a "is_blocked_by" link type when the "is blocked by" radio input selected', async () => { jest.spyOn(wrapper.vm, '$emit').mockImplementation(() => {}); wrapper.vm.linkedIssueType = linkedIssueTypesMap.IS_BLOCKED_BY; wrapper.vm.onFormSubmit(); - wrapper.vm.$nextTick(() => { - expect(wrapper.vm.$emit).toHaveBeenCalledWith('addIssuableFormSubmit', { - pendingReferences: '', - linkedIssueType: linkedIssueTypesMap.IS_BLOCKED_BY, - }); - done(); + await nextTick(); + expect(wrapper.vm.$emit).toHaveBeenCalledWith('addIssuableFormSubmit', { + pendingReferences: '', + linkedIssueType: linkedIssueTypesMap.IS_BLOCKED_BY, }); }); - it('shows error message when error is present', (done) => { + it('shows error message when error is present', async () => { const itemAddFailureMessage = 'Something went wrong while submitting.'; wrapper.setProps({ hasError: true, itemAddFailureMessage, }); - wrapper.vm.$nextTick(() => { - expect(wrapper.find('.gl-field-error').exists()).toBe(true); - expect(wrapper.find('.gl-field-error').text()).toContain(itemAddFailureMessage); - done(); - }); + await nextTick(); + expect(wrapper.find('.gl-field-error').exists()).toBe(true); + expect(wrapper.find('.gl-field-error').text()).toContain(itemAddFailureMessage); }); }); }); diff --git a/spec/frontend/issuable/related_issues/components/related_issues_block_spec.js b/spec/frontend/issuable/related_issues/components/related_issues_block_spec.js index 608fec45bbd..c7925034eb0 100644 --- a/spec/frontend/issuable/related_issues/components/related_issues_block_spec.js +++ b/spec/frontend/issuable/related_issues/components/related_issues_block_spec.js @@ -7,6 +7,7 @@ import { } from 'jest/issuable/components/related_issuable_mock_data'; import RelatedIssuesBlock from '~/related_issues/components/related_issues_block.vue'; import { + issuableTypesMap, linkedIssueTypesMap, linkedIssueTypesTextMap, PathIdSeparator, @@ -29,14 +30,34 @@ describe('RelatedIssuesBlock', () => { wrapper = mount(RelatedIssuesBlock, { propsData: { pathIdSeparator: PathIdSeparator.Issue, - issuableType: 'issue', + issuableType: issuableTypesMap.ISSUE, }, }); }); - it('displays "Linked issues" in the header', () => { - expect(wrapper.find('.card-title').text()).toContain('Linked issues'); - }); + it.each` + issuableType | pathIdSeparator | titleText | helpLinkText | addButtonText + ${'issue'} | ${PathIdSeparator.Issue} | ${'Linked issues'} | ${'Read more about related issues'} | ${'Add a related issue'} + ${'epic'} | ${PathIdSeparator.Epic} | ${'Linked epics'} | ${'Read more about related epics'} | ${'Add a related epic'} + `( + 'displays "$titleText" in the header, "$helpLinkText" aria-label for help link, and "$addButtonText" aria-label for add button when issuableType is set to "$issuableType"', + ({ issuableType, pathIdSeparator, titleText, helpLinkText, addButtonText }) => { + wrapper = mount(RelatedIssuesBlock, { + propsData: { + pathIdSeparator, + issuableType, + canAdmin: true, + helpPath: '/help/user/project/issues/related_issues', + }, + }); + + expect(wrapper.find('.card-title').text()).toContain(titleText); + expect(wrapper.find('[data-testid="help-link"]').attributes('aria-label')).toBe( + helpLinkText, + ); + expect(findIssueCountBadgeAddButton().attributes('aria-label')).toBe(addButtonText); + }, + ); it('unable to add new related issues', () => { expect(findIssueCountBadgeAddButton().exists()).toBe(false); diff --git a/spec/frontend/issuable/related_issues/components/related_issues_root_spec.js b/spec/frontend/issuable/related_issues/components/related_issues_root_spec.js index 01de4da7900..b59717a1f60 100644 --- a/spec/frontend/issuable/related_issues/components/related_issues_root_spec.js +++ b/spec/frontend/issuable/related_issues/components/related_issues_root_spec.js @@ -1,5 +1,6 @@ import { mount, shallowMount } from '@vue/test-utils'; import MockAdapter from 'axios-mock-adapter'; +import { nextTick } from 'vue'; import waitForPromises from 'helpers/wait_for_promises'; import { defaultProps, @@ -210,40 +211,37 @@ describe('RelatedIssuesRoot', () => { }), ); - it('when canceling and hiding add issuable form', () => { + it('when canceling and hiding add issuable form', async () => { wrapper.vm.onPendingFormCancel(); - return wrapper.vm.$nextTick().then(() => { - expect(wrapper.vm.isFormVisible).toEqual(false); - expect(wrapper.vm.inputValue).toEqual(''); - expect(wrapper.vm.state.pendingReferences).toHaveLength(0); - }); + await nextTick(); + expect(wrapper.vm.isFormVisible).toEqual(false); + expect(wrapper.vm.inputValue).toEqual(''); + expect(wrapper.vm.state.pendingReferences).toHaveLength(0); }); }); describe('fetchRelatedIssues', () => { beforeEach(() => createComponent()); - it('sets isFetching while fetching', () => { + it('sets isFetching while fetching', async () => { wrapper.vm.fetchRelatedIssues(); expect(wrapper.vm.isFetching).toEqual(true); - return waitForPromises().then(() => { - expect(wrapper.vm.isFetching).toEqual(false); - }); + await waitForPromises(); + expect(wrapper.vm.isFetching).toEqual(false); }); - it('should fetch related issues', () => { + it('should fetch related issues', async () => { mock.onGet(defaultProps.endpoint).reply(200, [issuable1, issuable2]); wrapper.vm.fetchRelatedIssues(); - return waitForPromises().then(() => { - expect(wrapper.vm.state.relatedIssues).toHaveLength(2); - expect(wrapper.vm.state.relatedIssues[0].id).toEqual(issuable1.id); - expect(wrapper.vm.state.relatedIssues[1].id).toEqual(issuable2.id); - }); + await waitForPromises(); + expect(wrapper.vm.state.relatedIssues).toHaveLength(2); + expect(wrapper.vm.state.relatedIssues[0].id).toEqual(issuable1.id); + expect(wrapper.vm.state.relatedIssues[1].id).toEqual(issuable2.id); }); }); |