diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2021-01-14 15:10:54 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2021-01-14 15:10:54 +0300 |
commit | 18873553de98259d0558157f78198b38ddd02b31 (patch) | |
tree | cbdf0261e8a72975b7044fe7df8a1439c93ed4d5 /spec/frontend/notes | |
parent | 0ea7b5c8a3f7afaae6b03279af56cd880d538bd7 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend/notes')
4 files changed, 211 insertions, 15 deletions
diff --git a/spec/frontend/notes/components/comment_field_layout_spec.js b/spec/frontend/notes/components/comment_field_layout_spec.js new file mode 100644 index 00000000000..4d9b4ea8c6f --- /dev/null +++ b/spec/frontend/notes/components/comment_field_layout_spec.js @@ -0,0 +1,137 @@ +import { shallowMount } from '@vue/test-utils'; +import { extendedWrapper } from 'helpers/vue_test_utils_helper'; +import CommentFieldLayout from '~/notes/components/comment_field_layout.vue'; +import EmailParticipantsWarning from '~/notes/components/email_participants_warning.vue'; +import NoteableWarning from '~/vue_shared/components/notes/noteable_warning.vue'; + +describe('Comment Field Layout Component', () => { + let wrapper; + + afterEach(() => { + wrapper.destroy(); + wrapper = null; + }); + + const LOCKED_DISCUSSION_DOCS_PATH = 'docs/locked/path'; + const CONFIDENTIAL_ISSUES_DOCS_PATH = 'docs/confidential/path'; + + const noteableDataMock = { + confidential: false, + discussion_locked: false, + locked_discussion_docs_path: LOCKED_DISCUSSION_DOCS_PATH, + confidential_issues_docs_path: CONFIDENTIAL_ISSUES_DOCS_PATH, + }; + + const findIssuableNoteWarning = () => wrapper.find(NoteableWarning); + const findEmailParticipantsWarning = () => wrapper.find(EmailParticipantsWarning); + const findErrorAlert = () => wrapper.findByTestId('comment-field-alert-container'); + + const createWrapper = (props = {}, slots = {}) => { + wrapper = extendedWrapper( + shallowMount(CommentFieldLayout, { + propsData: { + noteableData: noteableDataMock, + ...props, + }, + slots, + }), + ); + }; + + describe('.error-alert', () => { + it('does not exist by default', () => { + createWrapper(); + + expect(findErrorAlert().exists()).toBe(false); + }); + + it('exists when withAlertContainer is true', () => { + createWrapper({ withAlertContainer: true }); + + expect(findErrorAlert().isVisible()).toBe(true); + }); + }); + + describe('issue is not confidential and not locked', () => { + it('does not show IssuableNoteWarning', () => { + createWrapper(); + + expect(findIssuableNoteWarning().exists()).toBe(false); + }); + }); + + describe('issue is confidential', () => { + beforeEach(() => { + createWrapper({ + noteableData: { ...noteableDataMock, confidential: true }, + }); + }); + + it('shows IssuableNoteWarning', () => { + expect(findIssuableNoteWarning().isVisible()).toBe(true); + }); + + it('sets IssuableNoteWarning props', () => { + expect(findIssuableNoteWarning().props()).toMatchObject({ + isLocked: false, + isConfidential: true, + lockedNoteableDocsPath: LOCKED_DISCUSSION_DOCS_PATH, + confidentialNoteableDocsPath: CONFIDENTIAL_ISSUES_DOCS_PATH, + }); + }); + }); + + describe('issue is locked', () => { + beforeEach(() => { + createWrapper({ + noteableData: { ...noteableDataMock, discussion_locked: true }, + }); + }); + + it('shows IssuableNoteWarning', () => { + expect(findIssuableNoteWarning().isVisible()).toBe(true); + }); + + it('sets IssuableNoteWarning props', () => { + expect(findIssuableNoteWarning().props()).toMatchObject({ + isConfidential: false, + isLocked: true, + lockedNoteableDocsPath: LOCKED_DISCUSSION_DOCS_PATH, + confidentialNoteableDocsPath: CONFIDENTIAL_ISSUES_DOCS_PATH, + }); + }); + }); + + describe('issue has no email participants', () => { + it('does not show EmailParticipantsWarning', () => { + createWrapper(); + + expect(findEmailParticipantsWarning().exists()).toBe(false); + }); + }); + + describe('issue has email participants', () => { + beforeEach(() => { + createWrapper({ + noteableData: { + ...noteableDataMock, + issue_email_participants: [ + { email: 'someone@gitlab.com' }, + { email: 'another@gitlab.com' }, + ], + }, + }); + }); + + it('shows EmailParticipantsWarning', () => { + expect(findEmailParticipantsWarning().isVisible()).toBe(true); + }); + + it('sets EmailParticipantsWarning props', () => { + expect(findEmailParticipantsWarning().props('emails')).toEqual([ + 'someone@gitlab.com', + 'another@gitlab.com', + ]); + }); + }); +}); diff --git a/spec/frontend/notes/components/comment_form_spec.js b/spec/frontend/notes/components/comment_form_spec.js index fca1beca999..002c4f206cb 100644 --- a/spec/frontend/notes/components/comment_form_spec.js +++ b/spec/frontend/notes/components/comment_form_spec.js @@ -181,7 +181,7 @@ describe('issue_comment_form component', () => { describe('edit mode', () => { beforeEach(() => { - mountComponent(); + mountComponent({ mountFunction: mount }); }); it('should enter edit mode when arrow up is pressed', () => { @@ -200,7 +200,7 @@ describe('issue_comment_form component', () => { describe('event enter', () => { beforeEach(() => { - mountComponent(); + mountComponent({ mountFunction: mount }); }); it('should save note when cmd+enter is pressed', () => { @@ -368,17 +368,6 @@ describe('issue_comment_form component', () => { }); }); }); - - describe('issue is confidential', () => { - it('shows information warning', () => { - mountComponent({ - noteableData: { ...noteableDataMock, confidential: true }, - mountFunction: mount, - }); - - expect(wrapper.find('[data-testid="confidential-warning"]').exists()).toBe(true); - }); - }); }); describe('user is not logged in', () => { diff --git a/spec/frontend/notes/components/email_participants_warning_spec.js b/spec/frontend/notes/components/email_participants_warning_spec.js new file mode 100644 index 00000000000..ab1a6b152a4 --- /dev/null +++ b/spec/frontend/notes/components/email_participants_warning_spec.js @@ -0,0 +1,70 @@ +import { mount } from '@vue/test-utils'; +import EmailParticipantsWarning from '~/notes/components/email_participants_warning.vue'; + +describe('Email Participants Warning Component', () => { + let wrapper; + + afterEach(() => { + wrapper.destroy(); + wrapper = null; + }); + + const findMoreButton = () => wrapper.find('button'); + + const createWrapper = (emails) => { + wrapper = mount(EmailParticipantsWarning, { + propsData: { emails }, + }); + }; + + describe('with 3 or less emails', () => { + beforeEach(() => { + createWrapper(['a@gitlab.com', 'b@gitlab.com', 'c@gitlab.com']); + }); + + it('more button does not exist', () => { + expect(findMoreButton().exists()).toBe(false); + }); + + it('all emails are displayed', () => { + expect(wrapper.text()).toBe( + 'a@gitlab.com, b@gitlab.com, and c@gitlab.com will be notified of your comment.', + ); + }); + }); + + describe('with more than 3 emails', () => { + beforeEach(() => { + createWrapper(['a@gitlab.com', 'b@gitlab.com', 'c@gitlab.com', 'd@gitlab.com']); + }); + + it('only displays first 3 emails', () => { + expect(wrapper.text()).toContain('a@gitlab.com, b@gitlab.com, c@gitlab.com'); + expect(wrapper.text()).not.toContain('d@gitlab.com'); + }); + + it('more button does exist', () => { + expect(findMoreButton().exists()).toBe(true); + }); + + it('more button displays the correct wordage', () => { + expect(findMoreButton().text()).toBe('and 1 more'); + }); + + describe('when more button clicked', () => { + beforeEach(() => { + findMoreButton().trigger('click'); + }); + + it('more button no longer exists', () => { + expect(findMoreButton().exists()).toBe(false); + }); + + it('all emails are displayed', () => { + expect(wrapper.text()).toBe( + 'a@gitlab.com, b@gitlab.com, c@gitlab.com, and d@gitlab.com will be notified of your comment.', + ); + }); + }); + }); +}); diff --git a/spec/frontend/notes/components/note_form_spec.js b/spec/frontend/notes/components/note_form_spec.js index 95f35af8ebf..e64a75bede9 100644 --- a/spec/frontend/notes/components/note_form_spec.js +++ b/spec/frontend/notes/components/note_form_spec.js @@ -1,5 +1,5 @@ +import { mount } from '@vue/test-utils'; import { nextTick } from 'vue'; -import { shallowMount } from '@vue/test-utils'; import createStore from '~/notes/stores'; import NoteForm from '~/notes/components/note_form.vue'; import batchComments from '~/batch_comments/stores/modules/batch_comments'; @@ -19,7 +19,7 @@ describe('issue_note_form component', () => { let props; const createComponentWrapper = () => { - return shallowMount(NoteForm, { + return mount(NoteForm, { store, propsData: props, }); |