diff options
Diffstat (limited to 'spec/frontend/issuable_show')
6 files changed, 57 insertions, 27 deletions
diff --git a/spec/frontend/issuable_show/components/issuable_body_spec.js b/spec/frontend/issuable_show/components/issuable_body_spec.js index 4ffbbad4f37..bf166bea1e5 100644 --- a/spec/frontend/issuable_show/components/issuable_body_spec.js +++ b/spec/frontend/issuable_show/components/issuable_body_spec.js @@ -1,10 +1,11 @@ import { shallowMount } from '@vue/test-utils'; +import { useFakeDate } from 'helpers/fake_date'; import IssuableBody from '~/issuable_show/components/issuable_body.vue'; -import IssuableTitle from '~/issuable_show/components/issuable_title.vue'; import IssuableDescription from '~/issuable_show/components/issuable_description.vue'; import IssuableEditForm from '~/issuable_show/components/issuable_edit_form.vue'; +import IssuableTitle from '~/issuable_show/components/issuable_title.vue'; import TimeAgoTooltip from '~/vue_shared/components/time_ago_tooltip.vue'; import { mockIssuableShowProps, mockIssuable } from '../mock_data'; @@ -35,6 +36,9 @@ const createComponent = (propsData = issuableBodyProps) => }); describe('IssuableBody', () => { + // Some assertions expect a date later than our default + useFakeDate(2020, 11, 11); + let wrapper; beforeEach(() => { @@ -98,11 +102,8 @@ describe('IssuableBody', () => { it('renders issuable edit info', () => { const editedEl = wrapper.find('small'); - const sanitizedText = editedEl.text().replace(/\n/g, ' ').replace(/\s+/g, ' '); - expect(sanitizedText).toContain('Edited'); - expect(sanitizedText).toContain('ago'); - expect(sanitizedText).toContain(`by ${mockIssuable.updatedBy.name}`); + expect(editedEl.text()).toMatchInterpolatedText('Edited 3 months ago by Administrator'); }); it('renders issuable-edit-form when `editFormVisible` prop is true', async () => { diff --git a/spec/frontend/issuable_show/components/issuable_description_spec.js b/spec/frontend/issuable_show/components/issuable_description_spec.js index 1dd8348b098..29ecce1002d 100644 --- a/spec/frontend/issuable_show/components/issuable_description_spec.js +++ b/spec/frontend/issuable_show/components/issuable_description_spec.js @@ -1,5 +1,5 @@ -import $ from 'jquery'; import { shallowMount } from '@vue/test-utils'; +import $ from 'jquery'; import IssuableDescription from '~/issuable_show/components/issuable_description.vue'; diff --git a/spec/frontend/issuable_show/components/issuable_edit_form_spec.js b/spec/frontend/issuable_show/components/issuable_edit_form_spec.js index 522374f2e9c..184c9fe251c 100644 --- a/spec/frontend/issuable_show/components/issuable_edit_form_spec.js +++ b/spec/frontend/issuable_show/components/issuable_edit_form_spec.js @@ -1,9 +1,9 @@ -import { shallowMount } from '@vue/test-utils'; import { GlFormInput } from '@gitlab/ui'; -import MarkdownField from '~/vue_shared/components/markdown/field.vue'; +import { shallowMount } from '@vue/test-utils'; import IssuableEditForm from '~/issuable_show/components/issuable_edit_form.vue'; import IssuableEventHub from '~/issuable_show/event_hub'; +import MarkdownField from '~/vue_shared/components/markdown/field.vue'; import { mockIssuableShowProps, mockIssuable } from '../mock_data'; diff --git a/spec/frontend/issuable_show/components/issuable_header_spec.js b/spec/frontend/issuable_show/components/issuable_header_spec.js index f9c20ab04b8..2164caa40a8 100644 --- a/spec/frontend/issuable_show/components/issuable_header_spec.js +++ b/spec/frontend/issuable_show/components/issuable_header_spec.js @@ -1,5 +1,6 @@ -import { shallowMount } from '@vue/test-utils'; import { GlIcon, GlAvatarLabeled } from '@gitlab/ui'; +import { shallowMount } from '@vue/test-utils'; +import { extendedWrapper } from 'helpers/vue_test_utils_helper'; import IssuableHeader from '~/issuable_show/components/issuable_header.vue'; @@ -10,21 +11,23 @@ const issuableHeaderProps = { ...mockIssuableShowProps, }; -const createComponent = (propsData = issuableHeaderProps) => - shallowMount(IssuableHeader, { - propsData, - slots: { - 'status-badge': 'Open', - 'header-actions': ` +const createComponent = (propsData = issuableHeaderProps, { stubs } = {}) => + extendedWrapper( + shallowMount(IssuableHeader, { + propsData, + slots: { + 'status-badge': 'Open', + 'header-actions': ` <button class="js-close">Close issuable</button> <a class="js-new" href="/gitlab-org/gitlab-shell/-/issues/new">New issuable</a> `, - }, - }); + }, + stubs, + }), + ); describe('IssuableHeader', () => { let wrapper; - const findByTestId = (testId) => wrapper.find(`[data-testid="${testId}"]`); beforeEach(() => { wrapper = createComponent(); @@ -63,7 +66,7 @@ describe('IssuableHeader', () => { describe('template', () => { it('renders issuable status icon and text', () => { - const statusBoxEl = findByTestId('status'); + const statusBoxEl = wrapper.findByTestId('status'); expect(statusBoxEl.exists()).toBe(true); expect(statusBoxEl.find(GlIcon).props('name')).toBe(mockIssuableShowProps.statusIcon); @@ -77,7 +80,7 @@ describe('IssuableHeader', () => { await wrapper.vm.$nextTick(); - const blockedEl = findByTestId('blocked'); + const blockedEl = wrapper.findByTestId('blocked'); expect(blockedEl.exists()).toBe(true); expect(blockedEl.find(GlIcon).props('name')).toBe('lock'); @@ -90,7 +93,7 @@ describe('IssuableHeader', () => { await wrapper.vm.$nextTick(); - const confidentialEl = findByTestId('confidential'); + const confidentialEl = wrapper.findByTestId('confidential'); expect(confidentialEl.exists()).toBe(true); expect(confidentialEl.find(GlIcon).props('name')).toBe('eye-slash'); @@ -105,7 +108,7 @@ describe('IssuableHeader', () => { href: webUrl, target: '_blank', }; - const avatarEl = findByTestId('avatar'); + const avatarEl = wrapper.findByTestId('avatar'); expect(avatarEl.exists()).toBe(true); expect(avatarEl.attributes()).toMatchObject(avatarElAttrs); expect(avatarEl.find(GlAvatarLabeled).attributes()).toMatchObject({ @@ -113,20 +116,46 @@ describe('IssuableHeader', () => { src: avatarUrl, label: name, }); + expect(avatarEl.find(GlAvatarLabeled).find(GlIcon).exists()).toBe(false); }); it('renders sidebar toggle button', () => { - const toggleButtonEl = findByTestId('sidebar-toggle'); + const toggleButtonEl = wrapper.findByTestId('sidebar-toggle'); expect(toggleButtonEl.exists()).toBe(true); expect(toggleButtonEl.props('icon')).toBe('chevron-double-lg-left'); }); it('renders header actions', () => { - const actionsEl = findByTestId('header-actions'); + const actionsEl = wrapper.findByTestId('header-actions'); expect(actionsEl.find('button.js-close').exists()).toBe(true); expect(actionsEl.find('a.js-new').exists()).toBe(true); }); + + describe('when author exists outside of GitLab', () => { + it("renders 'external-link' icon in avatar label", () => { + wrapper = createComponent( + { + ...issuableHeaderProps, + author: { + ...issuableHeaderProps.author, + webUrl: 'https://jira.com/test-user/author.jpg', + }, + }, + { + stubs: { + GlAvatarLabeled, + }, + }, + ); + + const avatarEl = wrapper.findComponent(GlAvatarLabeled); + const icon = avatarEl.find(GlIcon); + + expect(icon.exists()).toBe(true); + expect(icon.props('name')).toBe('external-link'); + }); + }); }); }); diff --git a/spec/frontend/issuable_show/components/issuable_show_root_spec.js b/spec/frontend/issuable_show/components/issuable_show_root_spec.js index 6cebfc150f9..3e3778492d2 100644 --- a/spec/frontend/issuable_show/components/issuable_show_root_spec.js +++ b/spec/frontend/issuable_show/components/issuable_show_root_spec.js @@ -1,9 +1,9 @@ import { shallowMount } from '@vue/test-utils'; +import IssuableBody from '~/issuable_show/components/issuable_body.vue'; +import IssuableHeader from '~/issuable_show/components/issuable_header.vue'; import IssuableShowRoot from '~/issuable_show/components/issuable_show_root.vue'; -import IssuableHeader from '~/issuable_show/components/issuable_header.vue'; -import IssuableBody from '~/issuable_show/components/issuable_body.vue'; import IssuableSidebar from '~/issuable_sidebar/components/issuable_sidebar_root.vue'; import { mockIssuableShowProps, mockIssuable } from '../mock_data'; diff --git a/spec/frontend/issuable_show/components/issuable_title_spec.js b/spec/frontend/issuable_show/components/issuable_title_spec.js index e8621c763b3..df6fbdea76b 100644 --- a/spec/frontend/issuable_show/components/issuable_title_spec.js +++ b/spec/frontend/issuable_show/components/issuable_title_spec.js @@ -1,5 +1,5 @@ -import { shallowMount } from '@vue/test-utils'; import { GlIcon, GlButton, GlIntersectionObserver } from '@gitlab/ui'; +import { shallowMount } from '@vue/test-utils'; import { createMockDirective, getBinding } from 'helpers/vue_mock_directive'; import IssuableTitle from '~/issuable_show/components/issuable_title.vue'; |