diff options
Diffstat (limited to 'spec/frontend/boards/components')
14 files changed, 61 insertions, 43 deletions
diff --git a/spec/frontend/boards/components/board_add_new_column_form_spec.js b/spec/frontend/boards/components/board_add_new_column_form_spec.js index 3b26ca57d6f..0b3c6cb24c4 100644 --- a/spec/frontend/boards/components/board_add_new_column_form_spec.js +++ b/spec/frontend/boards/components/board_add_new_column_form_spec.js @@ -60,8 +60,8 @@ describe('Board card layout', () => { }); const formTitle = () => wrapper.findByTestId('board-add-column-form-title').text(); - const findSearchInput = () => wrapper.find(GlSearchBoxByType); - const findSearchLabel = () => wrapper.find(GlFormGroup); + const findSearchInput = () => wrapper.findComponent(GlSearchBoxByType); + const findSearchLabelFormGroup = () => wrapper.findComponent(GlFormGroup); const cancelButton = () => wrapper.findByTestId('cancelAddNewColumn'); const submitButton = () => wrapper.findByTestId('addNewColumnButton'); const findDropdown = () => wrapper.findComponent(GlDropdown); @@ -121,10 +121,17 @@ describe('Board card layout', () => { mountComponent(props); - expect(findSearchLabel().attributes('label')).toEqual(props.searchLabel); + expect(findSearchLabelFormGroup().attributes('label')).toEqual(props.searchLabel); expect(findSearchInput().attributes('placeholder')).toEqual(props.searchPlaceholder); }); + it('does not show the dropdown as invalid by default', () => { + mountComponent(); + + expect(findSearchLabelFormGroup().attributes('state')).toBe('true'); + expect(findDropdown().props('toggleClass')).not.toContain('gl-inset-border-1-red-400!'); + }); + it('emits filter event on input', () => { mountComponent(); @@ -137,13 +144,13 @@ describe('Board card layout', () => { }); describe('Add list button', () => { - it('is disabled if no item is selected', () => { + it('is enabled by default', () => { mountComponent(); - expect(submitButton().props('disabled')).toBe(true); + expect(submitButton().props('disabled')).toBe(false); }); - it('emits add-list event on click', () => { + it('emits add-list event on click when an ID is selected', () => { mountComponent({ selectedId: mockLabelList.label.id, }); @@ -152,5 +159,16 @@ describe('Board card layout', () => { expect(wrapper.emitted('add-list')).toEqual([[]]); }); + + it('does not emit the add-list event on click and shows the dropdown as invalid when no ID is selected', async () => { + mountComponent(); + + await submitButton().vm.$emit('click'); + + expect(findSearchLabelFormGroup().attributes('state')).toBeUndefined(); + expect(findDropdown().props('toggleClass')).toContain('gl-inset-border-1-red-400!'); + + expect(wrapper.emitted('add-list')).toBeUndefined(); + }); }); }); diff --git a/spec/frontend/boards/components/board_add_new_column_trigger_spec.js b/spec/frontend/boards/components/board_add_new_column_trigger_spec.js index 7dd02bf1d35..354eb7bff16 100644 --- a/spec/frontend/boards/components/board_add_new_column_trigger_spec.js +++ b/spec/frontend/boards/components/board_add_new_column_trigger_spec.js @@ -39,7 +39,7 @@ describe('BoardAddNewColumnTrigger', () => { }); it('renders an enabled button', () => { - const button = wrapper.find(GlButton); + const button = wrapper.findComponent(GlButton); expect(button.props('disabled')).toBe(false); }); @@ -47,7 +47,7 @@ describe('BoardAddNewColumnTrigger', () => { describe('when button is disabled', () => { it('shows the tooltip', async () => { - wrapper.find(GlButton).vm.$emit('click'); + wrapper.findComponent(GlButton).vm.$emit('click'); await nextTick(); diff --git a/spec/frontend/boards/components/board_blocked_icon_spec.js b/spec/frontend/boards/components/board_blocked_icon_spec.js index 7a5c49bd488..cf4ba07da16 100644 --- a/spec/frontend/boards/components/board_blocked_icon_spec.js +++ b/spec/frontend/boards/components/board_blocked_icon_spec.js @@ -23,9 +23,9 @@ describe('BoardBlockedIcon', () => { let wrapper; let mockApollo; - const findGlIcon = () => wrapper.find(GlIcon); - const findGlPopover = () => wrapper.find(GlPopover); - const findGlLink = () => wrapper.find(GlLink); + const findGlIcon = () => wrapper.findComponent(GlIcon); + const findGlPopover = () => wrapper.findComponent(GlPopover); + const findGlLink = () => wrapper.findComponent(GlLink); const findPopoverTitle = () => wrapper.findByTestId('popover-title'); const findIssuableTitle = () => wrapper.findByTestId('issuable-title'); const findHiddenBlockingCount = () => wrapper.findByTestId('hidden-blocking-count'); @@ -114,7 +114,7 @@ describe('BoardBlockedIcon', () => { it('should display a loading spinner while loading', () => { createWrapper({ loading: true }); - expect(wrapper.find(GlLoadingIcon).exists()).toBe(true); + expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(true); }); it('should not query for blocking issuables by default', async () => { diff --git a/spec/frontend/boards/components/board_card_spec.js b/spec/frontend/boards/components/board_card_spec.js index 17a5383a31e..bb1e63a581e 100644 --- a/spec/frontend/boards/components/board_card_spec.js +++ b/spec/frontend/boards/components/board_card_spec.js @@ -88,7 +88,7 @@ describe('Board card', () => { createStore({ initialState: { isShowingLabels: true } }); mountComponent({ mountFn: mount, stubs: {} }); - wrapper.find(GlLabel).trigger('mouseup'); + wrapper.findComponent(GlLabel).trigger('mouseup'); expect(mockActions.toggleBoardItem).toHaveBeenCalledTimes(0); }); diff --git a/spec/frontend/boards/components/board_content_sidebar_spec.js b/spec/frontend/boards/components/board_content_sidebar_spec.js index 368c7d561f8..7e35c39cd48 100644 --- a/spec/frontend/boards/components/board_content_sidebar_spec.js +++ b/spec/frontend/boards/components/board_content_sidebar_spec.js @@ -108,7 +108,7 @@ describe('BoardContentSidebar', () => { createStore({ mockGetters: { isSidebarOpen: () => false } }); createComponent(); - expect(wrapper.findComponent(GlDrawer).exists()).toBe(false); + expect(wrapper.findComponent(GlDrawer).props('open')).toBe(false); }); it('applies an open attribute', () => { diff --git a/spec/frontend/boards/components/board_content_spec.js b/spec/frontend/boards/components/board_content_spec.js index f535679b8a0..97d9e08f5d4 100644 --- a/spec/frontend/boards/components/board_content_spec.js +++ b/spec/frontend/boards/components/board_content_spec.js @@ -67,12 +67,12 @@ describe('BoardContent', () => { }); it('renders BoardContentSidebar', () => { - expect(wrapper.find(BoardContentSidebar).exists()).toBe(true); + expect(wrapper.findComponent(BoardContentSidebar).exists()).toBe(true); }); it('does not display EpicsSwimlanes component', () => { - expect(wrapper.find(EpicsSwimlanes).exists()).toBe(false); - expect(wrapper.find(GlAlert).exists()).toBe(false); + expect(wrapper.findComponent(EpicsSwimlanes).exists()).toBe(false); + expect(wrapper.findComponent(GlAlert).exists()).toBe(false); }); }); @@ -82,7 +82,7 @@ describe('BoardContent', () => { }); it('does not render BoardContentSidebar', () => { - expect(wrapper.find(BoardContentSidebar).exists()).toBe(false); + expect(wrapper.findComponent(BoardContentSidebar).exists()).toBe(false); }); }); @@ -92,7 +92,7 @@ describe('BoardContent', () => { }); it('renders draggable component', () => { - expect(wrapper.find(Draggable).exists()).toBe(true); + expect(wrapper.findComponent(Draggable).exists()).toBe(true); }); }); @@ -102,7 +102,7 @@ describe('BoardContent', () => { }); it('does not render draggable component', () => { - expect(wrapper.find(Draggable).exists()).toBe(false); + expect(wrapper.findComponent(Draggable).exists()).toBe(false); }); }); }); diff --git a/spec/frontend/boards/components/board_list_header_spec.js b/spec/frontend/boards/components/board_list_header_spec.js index 2f9677680eb..50901f3fe84 100644 --- a/spec/frontend/boards/components/board_list_header_spec.js +++ b/spec/frontend/boards/components/board_list_header_spec.js @@ -83,7 +83,7 @@ describe('Board List Header Component', () => { const isCollapsed = () => wrapper.vm.list.collapsed; - const findAddIssueButton = () => wrapper.find({ ref: 'newIssueBtn' }); + const findAddIssueButton = () => wrapper.findComponent({ ref: 'newIssueBtn' }); const findTitle = () => wrapper.find('.board-title'); const findCaret = () => wrapper.findByTestId('board-title-caret'); diff --git a/spec/frontend/boards/components/board_new_item_spec.js b/spec/frontend/boards/components/board_new_item_spec.js index 86cebc8a719..f4e9901aad2 100644 --- a/spec/frontend/boards/components/board_new_item_spec.js +++ b/spec/frontend/boards/components/board_new_item_spec.js @@ -44,7 +44,7 @@ describe('BoardNewItem', () => { it('finds an enabled create button', async () => { expect(wrapper.findByTestId('create-button').props('disabled')).toBe(true); - wrapper.find(GlFormInput).vm.$emit('input', 'hello'); + wrapper.findComponent(GlFormInput).vm.$emit('input', 'hello'); await nextTick(); expect(wrapper.findByTestId('create-button').props('disabled')).toBe(false); @@ -53,7 +53,7 @@ describe('BoardNewItem', () => { describe('when the user types in a string with only spaces', () => { it('disables the Create Issue button', async () => { - wrapper.find(GlFormInput).vm.$emit('input', ' '); + wrapper.findComponent(GlFormInput).vm.$emit('input', ' '); await nextTick(); @@ -93,7 +93,7 @@ describe('BoardNewItem', () => { titleInput().setValue('Foo'); await glForm().trigger('submit'); - expect(wrapper.emitted('form-submit')).toBeTruthy(); + expect(wrapper.emitted('form-submit')).toHaveLength(1); expect(wrapper.emitted('form-submit')[0]).toEqual([ { title: 'Foo', @@ -131,7 +131,7 @@ describe('BoardNewItem', () => { await glForm().trigger('reset'); expect(titleInput().element.value).toBe(''); - expect(wrapper.emitted('form-cancel')).toBeTruthy(); + expect(wrapper.emitted('form-cancel')).toHaveLength(1); }); }); }); diff --git a/spec/frontend/boards/components/board_settings_sidebar_spec.js b/spec/frontend/boards/components/board_settings_sidebar_spec.js index 7f40c426b30..4171a6236de 100644 --- a/spec/frontend/boards/components/board_settings_sidebar_spec.js +++ b/spec/frontend/boards/components/board_settings_sidebar_spec.js @@ -57,10 +57,10 @@ describe('BoardSettingsSidebar', () => { }), ); }; - const findLabel = () => wrapper.find(GlLabel); - const findDrawer = () => wrapper.find(GlDrawer); - const findModal = () => wrapper.find(GlModal); - const findRemoveButton = () => wrapper.find(GlButton); + const findLabel = () => wrapper.findComponent(GlLabel); + const findDrawer = () => wrapper.findComponent(GlDrawer); + const findModal = () => wrapper.findComponent(GlModal); + const findRemoveButton = () => wrapper.findComponent(GlButton); afterEach(() => { jest.restoreAllMocks(); @@ -71,7 +71,7 @@ describe('BoardSettingsSidebar', () => { it('finds a MountingPortal component', () => { createComponent(); - expect(wrapper.find(MountingPortal).props()).toMatchObject({ + expect(wrapper.findComponent(MountingPortal).props()).toMatchObject({ mountTo: '#js-right-sidebar-portal', append: true, name: 'board-settings-sidebar', @@ -93,7 +93,7 @@ describe('BoardSettingsSidebar', () => { await nextTick(); - expect(wrapper.find(GlDrawer).exists()).toBe(false); + expect(wrapper.findComponent(GlDrawer).props('open')).toBe(false); }); it('closes the sidebar when emitting the correct event', async () => { @@ -103,7 +103,7 @@ describe('BoardSettingsSidebar', () => { await nextTick(); - expect(wrapper.find(GlDrawer).exists()).toBe(false); + expect(wrapper.findComponent(GlDrawer).props('open')).toBe(false); }); }); @@ -150,7 +150,7 @@ describe('BoardSettingsSidebar', () => { it('does not render GlDrawer', () => { createComponent({ sidebarType: '' }); - expect(findDrawer().exists()).toBe(false); + expect(findDrawer().props('open')).toBe(false); }); }); diff --git a/spec/frontend/boards/components/boards_selector_spec.js b/spec/frontend/boards/components/boards_selector_spec.js index d91e81fe4d0..f3be66db36f 100644 --- a/spec/frontend/boards/components/boards_selector_spec.js +++ b/spec/frontend/boards/components/boards_selector_spec.js @@ -53,7 +53,7 @@ describe('BoardsSelector', () => { }; const fillSearchBox = (filterTerm) => { - const searchBox = wrapper.find({ ref: 'searchBox' }); + const searchBox = wrapper.findComponent({ ref: 'searchBox' }); const searchBoxInput = searchBox.find('input'); searchBoxInput.setValue(filterTerm); searchBoxInput.trigger('input'); diff --git a/spec/frontend/boards/components/new_board_button_spec.js b/spec/frontend/boards/components/new_board_button_spec.js index 075fe225ec2..2bbd3797abf 100644 --- a/spec/frontend/boards/components/new_board_button_spec.js +++ b/spec/frontend/boards/components/new_board_button_spec.js @@ -53,13 +53,13 @@ describe('NewBoardButton', () => { it('renders nothing when `canAdminBoard` is `false`', () => { wrapper = createComponent({ canAdminBoard: false }); - expect(wrapper.find(GlButton).exists()).toBe(false); + expect(wrapper.findComponent(GlButton).exists()).toBe(false); }); it('renders nothing when `multipleIssueBoardsAvailable` is `false`', () => { wrapper = createComponent({ multipleIssueBoardsAvailable: false }); - expect(wrapper.find(GlButton).exists()).toBe(false); + expect(wrapper.findComponent(GlButton).exists()).toBe(false); }); it('emits `showBoardModal` when button is clicked', () => { @@ -67,7 +67,7 @@ describe('NewBoardButton', () => { wrapper = createComponent(); - wrapper.find(GlButton).vm.$emit('click', { preventDefault: () => {} }); + wrapper.findComponent(GlButton).vm.$emit('click', { preventDefault: () => {} }); expect(eventHub.$emit).toHaveBeenCalledWith('showBoardModal', 'new'); }); diff --git a/spec/frontend/boards/components/sidebar/board_editable_item_spec.js b/spec/frontend/boards/components/sidebar/board_editable_item_spec.js index 0c76c711b3a..5e2222ac3d7 100644 --- a/spec/frontend/boards/components/sidebar/board_editable_item_spec.js +++ b/spec/frontend/boards/components/sidebar/board_editable_item_spec.js @@ -6,7 +6,7 @@ import BoardSidebarItem from '~/boards/components/sidebar/board_editable_item.vu describe('boards sidebar remove issue', () => { let wrapper; - const findLoader = () => wrapper.find(GlLoadingIcon); + const findLoader = () => wrapper.findComponent(GlLoadingIcon); const findEditButton = () => wrapper.find('[data-testid="edit-button"]'); const findTitle = () => wrapper.find('[data-testid="title"]'); const findCollapsed = () => wrapper.find('[data-testid="collapsed-content"]'); diff --git a/spec/frontend/boards/components/sidebar/board_sidebar_time_tracker_spec.js b/spec/frontend/boards/components/sidebar/board_sidebar_time_tracker_spec.js index 7c8996be0b8..5c435643425 100644 --- a/spec/frontend/boards/components/sidebar/board_sidebar_time_tracker_spec.js +++ b/spec/frontend/boards/components/sidebar/board_sidebar_time_tracker_spec.js @@ -47,7 +47,7 @@ describe('BoardSidebarTimeTracker', () => { (timeTrackingLimitToHours) => { createComponent({ provide: { timeTrackingLimitToHours } }); - expect(wrapper.find(IssuableTimeTracker).props()).toEqual({ + expect(wrapper.findComponent(IssuableTimeTracker).props()).toEqual({ limitToHours: timeTrackingLimitToHours, showCollapsed: false, issuableId: '1', diff --git a/spec/frontend/boards/components/sidebar/board_sidebar_title_spec.js b/spec/frontend/boards/components/sidebar/board_sidebar_title_spec.js index 5364d929c38..cc1e5de15c1 100644 --- a/spec/frontend/boards/components/sidebar/board_sidebar_title_spec.js +++ b/spec/frontend/boards/components/sidebar/board_sidebar_title_spec.js @@ -46,10 +46,10 @@ describe('~/boards/components/sidebar/board_sidebar_title.vue', () => { }); }; - const findForm = () => wrapper.find(GlForm); - const findAlert = () => wrapper.find(GlAlert); - const findFormInput = () => wrapper.find(GlFormInput); - const findEditableItem = () => wrapper.find(BoardEditableItem); + const findForm = () => wrapper.findComponent(GlForm); + const findAlert = () => wrapper.findComponent(GlAlert); + const findFormInput = () => wrapper.findComponent(GlFormInput); + const findEditableItem = () => wrapper.findComponent(BoardEditableItem); const findCancelButton = () => wrapper.find('[data-testid="cancel-button"]'); const findTitle = () => wrapper.find('[data-testid="item-title"]'); const findCollapsed = () => wrapper.find('[data-testid="collapsed-content"]'); |