diff options
Diffstat (limited to 'spec/frontend/design_management/components')
6 files changed, 42 insertions, 26 deletions
diff --git a/spec/frontend/design_management/components/design_notes/design_discussion_spec.js b/spec/frontend/design_management/components/design_notes/design_discussion_spec.js index 77fc70e08d1..a414eb04ab4 100644 --- a/spec/frontend/design_management/components/design_notes/design_discussion_spec.js +++ b/spec/frontend/design_management/components/design_notes/design_discussion_spec.js @@ -1,6 +1,5 @@ import { mount } from '@vue/test-utils'; import { GlLoadingIcon } from '@gitlab/ui'; -import notes from '../../mock_data/notes'; import DesignDiscussion from '~/design_management/components/design_notes/design_discussion.vue'; import DesignNote from '~/design_management/components/design_notes/design_note.vue'; import DesignReplyForm from '~/design_management/components/design_notes/design_reply_form.vue'; @@ -8,6 +7,7 @@ import createNoteMutation from '~/design_management/graphql/mutations/create_not import toggleResolveDiscussionMutation from '~/design_management/graphql/mutations/toggle_resolve_discussion.mutation.graphql'; import ReplyPlaceholder from '~/notes/components/discussion_reply_placeholder.vue'; import ToggleRepliesWidget from '~/design_management/components/design_notes/toggle_replies_widget.vue'; +import notes from '../../mock_data/notes'; import mockDiscussion from '../../mock_data/discussion'; const defaultMockDiscussion = { diff --git a/spec/frontend/design_management/components/design_overlay_spec.js b/spec/frontend/design_management/components/design_overlay_spec.js index a026cc39c84..ecb1fdbf534 100644 --- a/spec/frontend/design_management/components/design_overlay_spec.js +++ b/spec/frontend/design_management/components/design_overlay_spec.js @@ -1,8 +1,8 @@ import { mount } from '@vue/test-utils'; import DesignOverlay from '~/design_management/components/design_overlay.vue'; import updateActiveDiscussion from '~/design_management/graphql/mutations/update_active_discussion.mutation.graphql'; -import notes from '../mock_data/notes'; import { ACTIVE_DISCUSSION_SOURCE_TYPES } from '~/design_management/constants'; +import notes from '../mock_data/notes'; const mutate = jest.fn(() => Promise.resolve()); diff --git a/spec/frontend/design_management/components/design_sidebar_spec.js b/spec/frontend/design_management/components/design_sidebar_spec.js index 60266883fcd..3d520ea721a 100644 --- a/spec/frontend/design_management/components/design_sidebar_spec.js +++ b/spec/frontend/design_management/components/design_sidebar_spec.js @@ -4,9 +4,9 @@ import Cookies from 'js-cookie'; import DesignSidebar from '~/design_management/components/design_sidebar.vue'; import Participants from '~/sidebar/components/participants/participants.vue'; import DesignDiscussion from '~/design_management/components/design_notes/design_discussion.vue'; -import design from '../mock_data/design'; import updateActiveDiscussionMutation from '~/design_management/graphql/mutations/update_active_discussion.mutation.graphql'; import DesignTodoButton from '~/design_management/components/design_todo_button.vue'; +import design from '../mock_data/design'; const scrollIntoViewMock = jest.fn(); HTMLElement.prototype.scrollIntoView = scrollIntoViewMock; diff --git a/spec/frontend/design_management/components/design_todo_button_spec.js b/spec/frontend/design_management/components/design_todo_button_spec.js index 9ebc6ca26a2..0c7516c55df 100644 --- a/spec/frontend/design_management/components/design_todo_button_spec.js +++ b/spec/frontend/design_management/components/design_todo_button_spec.js @@ -111,7 +111,7 @@ describe('Design management design todo button', () => { }); it('renders correct button text', () => { - expect(wrapper.text()).toBe('Add a To Do'); + expect(wrapper.text()).toBe('Add a to do'); }); describe('when clicked', () => { diff --git a/spec/frontend/design_management/components/list/__snapshots__/item_spec.js.snap b/spec/frontend/design_management/components/list/__snapshots__/item_spec.js.snap index 36a2ffd19c3..8fe3e92360a 100644 --- a/spec/frontend/design_management/components/list/__snapshots__/item_spec.js.snap +++ b/spec/frontend/design_management/components/list/__snapshots__/item_spec.js.snap @@ -26,9 +26,10 @@ exports[`Design management list item component with notes renders item with mult <img alt="test" - class="gl-display-block gl-mx-auto gl-max-w-full mh-100 design-img" + class="gl-display-block gl-mx-auto gl-max-w-full gl-max-h-full design-img" data-qa-filename="test" data-qa-selector="design_image" + data-testid="design-img-1" src="" /> </gl-intersection-observer-stub> @@ -43,6 +44,8 @@ exports[`Design management list item component with notes renders item with mult <span class="gl-font-weight-bold str-truncated-100" data-qa-selector="design_file_name" + data-testid="design-img-filename-1" + title="test" > test </span> @@ -100,9 +103,10 @@ exports[`Design management list item component with notes renders item with sing <img alt="test" - class="gl-display-block gl-mx-auto gl-max-w-full mh-100 design-img" + class="gl-display-block gl-mx-auto gl-max-w-full gl-max-h-full design-img" data-qa-filename="test" data-qa-selector="design_image" + data-testid="design-img-1" src="" /> </gl-intersection-observer-stub> @@ -117,6 +121,8 @@ exports[`Design management list item component with notes renders item with sing <span class="gl-font-weight-bold str-truncated-100" data-qa-selector="design_file_name" + data-testid="design-img-filename-1" + title="test" > test </span> diff --git a/spec/frontend/design_management/components/list/item_spec.js b/spec/frontend/design_management/components/list/item_spec.js index 55c6ecbc26b..a89d05127c7 100644 --- a/spec/frontend/design_management/components/list/item_spec.js +++ b/spec/frontend/design_management/components/list/item_spec.js @@ -1,6 +1,7 @@ import { createLocalVue, shallowMount } from '@vue/test-utils'; import { GlIcon, GlLoadingIcon, GlIntersectionObserver } from '@gitlab/ui'; import VueRouter from 'vue-router'; +import { extendedWrapper } from 'helpers/vue_test_utils_helper'; import Item from '~/design_management/components/list/item.vue'; const localVue = createLocalVue(); @@ -17,8 +18,11 @@ const DESIGN_VERSION_EVENT = { describe('Design management list item component', () => { let wrapper; + const imgId = 1; + const imgFilename = 'test'; - const findDesignEvent = () => wrapper.find('[data-testid="designEvent"]'); + const findDesignEvent = () => wrapper.findByTestId('design-event'); + const findImgFilename = (id = imgId) => wrapper.findByTestId(`design-img-filename-${id}`); const findEventIcon = () => findDesignEvent().find(GlIcon); const findLoadingIcon = () => wrapper.find(GlLoadingIcon); @@ -28,25 +32,27 @@ describe('Design management list item component', () => { isUploading = false, imageLoading = false, } = {}) { - wrapper = shallowMount(Item, { - localVue, - router, - propsData: { - id: 1, - filename: 'test', - image: 'http://via.placeholder.com/300', - isUploading, - event, - notesCount, - updatedAt: '01-01-2019', - }, - data() { - return { - imageLoading, - }; - }, - stubs: ['router-link'], - }); + wrapper = extendedWrapper( + shallowMount(Item, { + localVue, + router, + propsData: { + id: imgId, + filename: imgFilename, + image: 'http://via.placeholder.com/300', + isUploading, + event, + notesCount, + updatedAt: '01-01-2019', + }, + data() { + return { + imageLoading, + }; + }, + stubs: ['router-link'], + }), + ); } afterEach(() => { @@ -75,6 +81,10 @@ describe('Design management list item component', () => { return wrapper.vm.$nextTick(); }); + it('renders a tooltip', () => { + expect(findImgFilename().attributes('title')).toEqual(imgFilename); + }); + describe('before image is loaded', () => { it('renders loading spinner', () => { expect(wrapper.find(GlLoadingIcon)).toExist(); |