diff options
Diffstat (limited to 'spec/frontend/environments')
15 files changed, 57 insertions, 41 deletions
diff --git a/spec/frontend/environments/canary_ingress_spec.js b/spec/frontend/environments/canary_ingress_spec.js index d58f9f9b8a2..340740e6499 100644 --- a/spec/frontend/environments/canary_ingress_spec.js +++ b/spec/frontend/environments/canary_ingress_spec.js @@ -10,7 +10,7 @@ describe('/environments/components/canary_ingress.vue', () => { const setWeightTo = (weightWrapper, x) => weightWrapper - .findAll(GlDropdownItem) + .findAllComponents(GlDropdownItem) .at(x / 5) .vm.$emit('click'); @@ -59,14 +59,14 @@ describe('/environments/components/canary_ingress.vue', () => { }); it('lists options from 0 to 100 in increments of 5', () => { - const options = stableWeightDropdown.findAll(GlDropdownItem); + const options = stableWeightDropdown.findAllComponents(GlDropdownItem); expect(options).toHaveLength(21); options.wrappers.forEach((w, i) => expect(w.text()).toBe((i * 5).toString())); }); it('is set to open the change modal', () => { stableWeightDropdown - .findAll(GlDropdownItem) + .findAllComponents(GlDropdownItem) .wrappers.forEach((w) => expect(getBinding(w.element, 'gl-modal')).toMatchObject({ value: CANARY_UPDATE_MODAL }), ); @@ -92,13 +92,13 @@ describe('/environments/components/canary_ingress.vue', () => { it('lists options from 0 to 100 in increments of 5', () => { canaryWeightDropdown - .findAll(GlDropdownItem) + .findAllComponents(GlDropdownItem) .wrappers.forEach((w, i) => expect(w.text()).toBe((i * 5).toString())); }); it('is set to open the change modal', () => { canaryWeightDropdown - .findAll(GlDropdownItem) + .findAllComponents(GlDropdownItem) .wrappers.forEach((w) => expect(getBinding(w.element, 'gl-modal')).toMatchObject({ value: CANARY_UPDATE_MODAL }), ); diff --git a/spec/frontend/environments/canary_update_modal_spec.js b/spec/frontend/environments/canary_update_modal_spec.js index 16792dcda1e..31b1770da59 100644 --- a/spec/frontend/environments/canary_update_modal_spec.js +++ b/spec/frontend/environments/canary_update_modal_spec.js @@ -10,7 +10,7 @@ describe('/environments/components/canary_update_modal.vue', () => { let modal; let mutate; - const findAlert = () => wrapper.find(GlAlert); + const findAlert = () => wrapper.findComponent(GlAlert); const createComponent = () => { mutate = jest.fn().mockResolvedValue(); @@ -27,7 +27,7 @@ describe('/environments/components/canary_update_modal.vue', () => { $apollo: { mutate }, }, }); - modal = wrapper.find(GlModal); + modal = wrapper.findComponent(GlModal); }; afterEach(() => { diff --git a/spec/frontend/environments/confirm_rollback_modal_spec.js b/spec/frontend/environments/confirm_rollback_modal_spec.js index c4763933468..2163814528a 100644 --- a/spec/frontend/environments/confirm_rollback_modal_spec.js +++ b/spec/frontend/environments/confirm_rollback_modal_spec.js @@ -73,7 +73,7 @@ describe('Confirm Rollback Modal Component', () => { hasMultipleCommits, retryUrl, }); - const modal = component.find(GlModal); + const modal = component.findComponent(GlModal); expect(modal.attributes('title')).toContain('Rollback'); expect(modal.attributes('title')).toContain('test'); @@ -92,7 +92,7 @@ describe('Confirm Rollback Modal Component', () => { hasMultipleCommits, }); - const modal = component.find(GlModal); + const modal = component.findComponent(GlModal); expect(modal.attributes('title')).toContain('Re-deploy'); expect(modal.attributes('title')).toContain('test'); @@ -110,7 +110,7 @@ describe('Confirm Rollback Modal Component', () => { }); const eventHubSpy = jest.spyOn(eventHub, '$emit'); - const modal = component.find(GlModal); + const modal = component.findComponent(GlModal); modal.vm.$emit('ok'); expect(eventHubSpy).toHaveBeenCalledWith('rollbackEnvironment', env); @@ -155,7 +155,7 @@ describe('Confirm Rollback Modal Component', () => { }, { apolloProvider }, ); - const modal = component.find(GlModal); + const modal = component.findComponent(GlModal); expect(trimText(modal.text())).toContain('commit abc0123'); expect(modal.text()).toContain('Are you sure you want to continue?'); @@ -177,7 +177,7 @@ describe('Confirm Rollback Modal Component', () => { }, { apolloProvider }, ); - const modal = component.find(GlModal); + const modal = component.findComponent(GlModal); expect(modal.attributes('title')).toContain('Rollback'); expect(modal.attributes('title')).toContain('test'); @@ -201,7 +201,7 @@ describe('Confirm Rollback Modal Component', () => { { apolloProvider }, ); - const modal = component.find(GlModal); + const modal = component.findComponent(GlModal); expect(modal.attributes('title')).toContain('Re-deploy'); expect(modal.attributes('title')).toContain('test'); @@ -220,7 +220,7 @@ describe('Confirm Rollback Modal Component', () => { { apolloProvider }, ); - const modal = component.find(GlModal); + const modal = component.findComponent(GlModal); modal.vm.$emit('ok'); await nextTick(); diff --git a/spec/frontend/environments/deploy_board_component_spec.js b/spec/frontend/environments/deploy_board_component_spec.js index 4d63648dd48..c005ca22070 100644 --- a/spec/frontend/environments/deploy_board_component_spec.js +++ b/spec/frontend/environments/deploy_board_component_spec.js @@ -26,7 +26,9 @@ describe('Deploy Board', () => { }); it('should render percentage with completion value provided', () => { - expect(wrapper.find({ ref: 'percentage' }).text()).toBe(`${deployBoardMockData.completion}%`); + expect(wrapper.findComponent({ ref: 'percentage' }).text()).toBe( + `${deployBoardMockData.completion}%`, + ); }); it('should render total instance count', () => { @@ -79,7 +81,9 @@ describe('Deploy Board', () => { }); it('should render percentage with completion value provided', () => { - expect(wrapper.find({ ref: 'percentage' }).text()).toBe(`${rolloutStatus.completion}%`); + expect(wrapper.findComponent({ ref: 'percentage' }).text()).toBe( + `${rolloutStatus.completion}%`, + ); }); it('should render total instance count', () => { diff --git a/spec/frontend/environments/edit_environment_spec.js b/spec/frontend/environments/edit_environment_spec.js index 2c8c054ccbd..0f2d6e95bf0 100644 --- a/spec/frontend/environments/edit_environment_spec.js +++ b/spec/frontend/environments/edit_environment_spec.js @@ -42,7 +42,7 @@ describe('~/environments/components/edit.vue', () => { const findExternalUrlInput = () => wrapper.findByLabelText('External URL'); const findForm = () => wrapper.findByRole('form', { name: 'Edit environment' }); - const showsLoading = () => wrapper.find(GlLoadingIcon).exists(); + const showsLoading = () => wrapper.findComponent(GlLoadingIcon).exists(); const submitForm = async (expected, response) => { mock diff --git a/spec/frontend/environments/environment_actions_spec.js b/spec/frontend/environments/environment_actions_spec.js index ada79e2d415..68895b194a1 100644 --- a/spec/frontend/environments/environment_actions_spec.js +++ b/spec/frontend/environments/environment_actions_spec.js @@ -51,7 +51,7 @@ describe('EnvironmentActions Component', () => { } const findDropdownItem = (action) => { - const buttons = wrapper.findAll(GlDropdownItem); + const buttons = wrapper.findAllComponents(GlDropdownItem); return buttons.filter((button) => button.text().startsWith(action.name)).at(0); }; @@ -62,12 +62,12 @@ describe('EnvironmentActions Component', () => { it('should render a dropdown button with 2 icons', () => { createComponent({}, { mountFn: mount }); - expect(wrapper.find(GlDropdown).findAll(GlIcon).length).toBe(2); + expect(wrapper.findComponent(GlDropdown).findAllComponents(GlIcon).length).toBe(2); }); it('should render a dropdown button with aria-label description', () => { createComponent(); - expect(wrapper.find(GlDropdown).attributes('aria-label')).toBe('Deploy to...'); + expect(wrapper.findComponent(GlDropdown).attributes('aria-label')).toBe('Deploy to...'); }); it('should render a tooltip', () => { @@ -98,11 +98,11 @@ describe('EnvironmentActions Component', () => { }); it('should render a dropdown with the provided list of actions', () => { - expect(wrapper.findAll(GlDropdownItem)).toHaveLength(actions.length); + expect(wrapper.findAllComponents(GlDropdownItem)).toHaveLength(actions.length); }); it("should render a disabled action when it's not playable", () => { - const dropdownItems = wrapper.findAll(GlDropdownItem); + const dropdownItems = wrapper.findAllComponents(GlDropdownItem); const lastDropdownItem = dropdownItems.at(dropdownItems.length - 1); expect(lastDropdownItem.attributes('disabled')).toBe('true'); }); @@ -136,7 +136,7 @@ describe('EnvironmentActions Component', () => { }); it('should render a dropdown button with a loading icon', () => { - expect(wrapper.find(GlLoadingIcon).isVisible()).toBe(true); + expect(wrapper.findComponent(GlLoadingIcon).isVisible()).toBe(true); }); }); diff --git a/spec/frontend/environments/environment_delete_spec.js b/spec/frontend/environments/environment_delete_spec.js index 057cb9858c4..530f9f55088 100644 --- a/spec/frontend/environments/environment_delete_spec.js +++ b/spec/frontend/environments/environment_delete_spec.js @@ -21,7 +21,7 @@ describe('External URL Component', () => { }); }; - const findDropdownItem = () => wrapper.find(GlDropdownItem); + const findDropdownItem = () => wrapper.findComponent(GlDropdownItem); describe('event hub', () => { beforeEach(() => { diff --git a/spec/frontend/environments/environment_item_spec.js b/spec/frontend/environments/environment_item_spec.js index 1c86a66d9b8..dd909cf4473 100644 --- a/spec/frontend/environments/environment_item_spec.js +++ b/spec/frontend/environments/environment_item_spec.js @@ -88,11 +88,11 @@ describe('Environment item', () => { it('should render user avatar with link to profile', () => { const avatarLink = findLastDeploymentAvatarLink(); const avatar = findLastDeploymentAvatar(); - const { username, avatar_url, web_url } = environment.last_deployment.user; + const { username, avatar_url: src, web_url } = environment.last_deployment.user; expect(avatarLink.attributes('href')).toBe(web_url); expect(avatar.props()).toMatchObject({ - src: avatar_url, + src, entityName: username, }); expect(avatar.attributes()).toMatchObject({ @@ -127,12 +127,12 @@ describe('Environment item', () => { it('should render the build ID and user', () => { const avatarLink = findUpcomingDeploymentAvatarLink(); const avatar = findUpcomingDeploymentAvatar(); - const { username, avatar_url, web_url } = environment.upcoming_deployment.user; + const { username, avatar_url: src, web_url } = environment.upcoming_deployment.user; expect(findUpcomingDeploymentContent().text()).toMatchInterpolatedText('#27 by'); expect(avatarLink.attributes('href')).toBe(web_url); expect(avatar.props()).toMatchObject({ - src: avatar_url, + src, entityName: username, }); }); @@ -166,12 +166,12 @@ describe('Environment item', () => { it('should still render the build ID and user avatar', () => { const avatarLink = findUpcomingDeploymentAvatarLink(); const avatar = findUpcomingDeploymentAvatar(); - const { username, avatar_url, web_url } = environment.upcoming_deployment.user; + const { username, avatar_url: src, web_url } = environment.upcoming_deployment.user; expect(findUpcomingDeploymentContent().text()).toMatchInterpolatedText('#27 by'); expect(avatarLink.attributes('href')).toBe(web_url); expect(avatar.props()).toMatchObject({ - src: avatar_url, + src, entityName: username, }); }); diff --git a/spec/frontend/environments/environment_pin_spec.js b/spec/frontend/environments/environment_pin_spec.js index 669c974ea4f..170036b5b00 100644 --- a/spec/frontend/environments/environment_pin_spec.js +++ b/spec/frontend/environments/environment_pin_spec.js @@ -41,7 +41,7 @@ describe('Pin Component', () => { it('should emit onPinClick when clicked', () => { const eventHubSpy = jest.spyOn(eventHub, '$emit'); - const item = wrapper.find(GlDropdownItem); + const item = wrapper.findComponent(GlDropdownItem); item.vm.$emit('click'); @@ -74,7 +74,7 @@ describe('Pin Component', () => { it('should emit onPinClick when clicked', () => { jest.spyOn(mockApollo.defaultClient, 'mutate'); - const item = wrapper.find(GlDropdownItem); + const item = wrapper.findComponent(GlDropdownItem); item.vm.$emit('click'); diff --git a/spec/frontend/environments/environment_rollback_spec.js b/spec/frontend/environments/environment_rollback_spec.js index 7eff46baaf7..be61c6fcc90 100644 --- a/spec/frontend/environments/environment_rollback_spec.js +++ b/spec/frontend/environments/environment_rollback_spec.js @@ -44,7 +44,7 @@ describe('Rollback Component', () => { }, }, }); - const button = wrapper.find(GlDropdownItem); + const button = wrapper.findComponent(GlDropdownItem); button.vm.$emit('click'); @@ -71,7 +71,7 @@ describe('Rollback Component', () => { }, apolloProvider, }); - const button = wrapper.find(GlDropdownItem); + const button = wrapper.findComponent(GlDropdownItem); button.vm.$emit('click'); expect(apolloProvider.defaultClient.mutate).toHaveBeenCalledWith({ diff --git a/spec/frontend/environments/environment_stop_spec.js b/spec/frontend/environments/environment_stop_spec.js index 358abca2f77..851e24c22cc 100644 --- a/spec/frontend/environments/environment_stop_spec.js +++ b/spec/frontend/environments/environment_stop_spec.js @@ -22,7 +22,7 @@ describe('Stop Component', () => { }); }; - const findButton = () => wrapper.find(GlButton); + const findButton = () => wrapper.findComponent(GlButton); describe('eventHub', () => { beforeEach(() => { diff --git a/spec/frontend/environments/environment_table_spec.js b/spec/frontend/environments/environment_table_spec.js index aff6b1327f0..49a643aaac8 100644 --- a/spec/frontend/environments/environment_table_spec.js +++ b/spec/frontend/environments/environment_table_spec.js @@ -177,10 +177,10 @@ describe('Environment table', () => { }, }); - wrapper.find(DeployBoard).vm.$emit('changeCanaryWeight', 40); + wrapper.findComponent(DeployBoard).vm.$emit('changeCanaryWeight', 40); await nextTick(); - expect(wrapper.find(CanaryUpdateModal).props()).toMatchObject({ + expect(wrapper.findComponent(CanaryUpdateModal).props()).toMatchObject({ weight: 40, environment: mockItem, }); diff --git a/spec/frontend/environments/environments_detail_header_spec.js b/spec/frontend/environments/environments_detail_header_spec.js index 305e7385b43..4687119127d 100644 --- a/spec/frontend/environments/environments_detail_header_spec.js +++ b/spec/frontend/environments/environments_detail_header_spec.js @@ -1,5 +1,6 @@ import { GlSprintf } from '@gitlab/ui'; import { shallowMountExtended } from 'helpers/vue_test_utils_helper'; +import { createMockDirective, getBinding } from 'helpers/vue_mock_directive'; import DeleteEnvironmentModal from '~/environments/components/delete_environment_modal.vue'; import EnvironmentsDetailHeader from '~/environments/components/environments_detail_header.vue'; import StopEnvironmentModal from '~/environments/components/stop_environment_modal.vue'; @@ -43,6 +44,9 @@ describe('Environments detail header component', () => { GlSprintf, TimeAgo, }, + directives: { + GlTooltip: createMockDirective(), + }, propsData: { canAdminEnvironment: false, canUpdateEnvironment: false, @@ -185,6 +189,14 @@ describe('Environments detail header component', () => { it('displays the metrics button with correct path', () => { expect(findMetricsButton().attributes('href')).toBe(metricsPath); }); + + it('uses a gl tooltip for the title', () => { + const button = findMetricsButton(); + const tooltip = getBinding(button.element, 'gl-tooltip'); + + expect(tooltip).toBeDefined(); + expect(button.attributes('title')).toBe('See metrics'); + }); }); describe('when has all admin rights', () => { diff --git a/spec/frontend/environments/folder/environments_folder_view_spec.js b/spec/frontend/environments/folder/environments_folder_view_spec.js index 9eb57b2682f..f8b8465cf6f 100644 --- a/spec/frontend/environments/folder/environments_folder_view_spec.js +++ b/spec/frontend/environments/folder/environments_folder_view_spec.js @@ -65,7 +65,7 @@ describe('Environments Folder View', () => { }); it('should render a table with environments', () => { - const table = wrapper.find(EnvironmentTable); + const table = wrapper.findComponent(EnvironmentTable); expect(table.exists()).toBe(true); expect(table.find('.environment-name').text()).toEqual(environmentsList[0].name); @@ -93,7 +93,7 @@ describe('Environments Folder View', () => { describe('pagination', () => { it('should render pagination', () => { - expect(wrapper.find(GlPagination).exists()).toBe(true); + expect(wrapper.findComponent(GlPagination).exists()).toBe(true); }); it('should make an API request when changing page', () => { @@ -126,7 +126,7 @@ describe('Environments Folder View', () => { }); it('should not render a table', () => { - expect(wrapper.find(EnvironmentTable).exists()).toBe(false); + expect(wrapper.findComponent(EnvironmentTable).exists()).toBe(false); }); it('should render available tab with count 0', () => { diff --git a/spec/frontend/environments/new_environment_spec.js b/spec/frontend/environments/new_environment_spec.js index f6d970e02d8..5a1c1c7714c 100644 --- a/spec/frontend/environments/new_environment_spec.js +++ b/spec/frontend/environments/new_environment_spec.js @@ -40,7 +40,7 @@ describe('~/environments/components/new.vue', () => { wrapper.destroy(); }); - const showsLoading = () => wrapper.find(GlLoadingIcon).exists(); + const showsLoading = () => wrapper.findComponent(GlLoadingIcon).exists(); const submitForm = async (expected, response) => { mock |