diff options
Diffstat (limited to 'spec/frontend')
38 files changed, 220 insertions, 97 deletions
diff --git a/spec/frontend/blob/components/blob_edit_content_spec.js b/spec/frontend/blob/components/blob_edit_content_spec.js index eff53fe7ce9..189d2629efa 100644 --- a/spec/frontend/blob/components/blob_edit_content_spec.js +++ b/spec/frontend/blob/components/blob_edit_content_spec.js @@ -12,11 +12,12 @@ describe('Blob Header Editing', () => { const value = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.'; const fileName = 'lorem.txt'; - function createComponent() { + function createComponent(props = {}) { wrapper = shallowMount(BlobEditContent, { propsData: { value, fileName, + ...props, }, }); } @@ -40,6 +41,14 @@ describe('Blob Header Editing', () => { }); describe('functionality', () => { + it('does not fail without content', () => { + const spy = jest.spyOn(global.console, 'error'); + createComponent({ value: undefined }); + + expect(spy).not.toHaveBeenCalled(); + expect(wrapper.contains('#editor')).toBe(true); + }); + it('initialises Editor Lite', () => { const el = wrapper.find({ ref: 'editor' }).element; expect(initEditorLite).toHaveBeenCalledWith({ diff --git a/spec/frontend/blob/components/blob_header_default_actions_spec.js b/spec/frontend/blob/components/blob_header_default_actions_spec.js index 39d627e71c5..684840afe1c 100644 --- a/spec/frontend/blob/components/blob_header_default_actions_spec.js +++ b/spec/frontend/blob/components/blob_header_default_actions_spec.js @@ -6,7 +6,7 @@ import { BTN_RAW_TITLE, RICH_BLOB_VIEWER, } from '~/blob/components/constants'; -import { GlButtonGroup, GlButton } from '@gitlab/ui'; +import { GlButtonGroup, GlDeprecatedButton } from '@gitlab/ui'; import { Blob } from './mock_data'; describe('Blob Header Default Actions', () => { @@ -27,7 +27,7 @@ describe('Blob Header Default Actions', () => { beforeEach(() => { createComponent(); btnGroup = wrapper.find(GlButtonGroup); - buttons = wrapper.findAll(GlButton); + buttons = wrapper.findAll(GlDeprecatedButton); }); afterEach(() => { @@ -62,7 +62,7 @@ describe('Blob Header Default Actions', () => { createComponent({ activeViewer: RICH_BLOB_VIEWER, }); - buttons = wrapper.findAll(GlButton); + buttons = wrapper.findAll(GlDeprecatedButton); expect(buttons.at(0).attributes('disabled')).toBeTruthy(); }); diff --git a/spec/frontend/blob/components/blob_header_viewer_switcher_spec.js b/spec/frontend/blob/components/blob_header_viewer_switcher_spec.js index f1a7ac8b21a..0f34d6419d3 100644 --- a/spec/frontend/blob/components/blob_header_viewer_switcher_spec.js +++ b/spec/frontend/blob/components/blob_header_viewer_switcher_spec.js @@ -6,7 +6,7 @@ import { SIMPLE_BLOB_VIEWER, SIMPLE_BLOB_VIEWER_TITLE, } from '~/blob/components/constants'; -import { GlButtonGroup, GlButton } from '@gitlab/ui'; +import { GlButtonGroup, GlDeprecatedButton } from '@gitlab/ui'; describe('Blob Header Viewer Switcher', () => { let wrapper; @@ -35,7 +35,7 @@ describe('Blob Header Viewer Switcher', () => { beforeEach(() => { createComponent(); btnGroup = wrapper.find(GlButtonGroup); - buttons = wrapper.findAll(GlButton); + buttons = wrapper.findAll(GlDeprecatedButton); }); it('renders gl-button-group component', () => { @@ -57,7 +57,7 @@ describe('Blob Header Viewer Switcher', () => { function factory(propsData = {}) { createComponent(propsData); - buttons = wrapper.findAll(GlButton); + buttons = wrapper.findAll(GlDeprecatedButton); simpleBtn = buttons.at(0); richBtn = buttons.at(1); diff --git a/spec/frontend/ci_variable_list/components/ci_variable_modal_spec.js b/spec/frontend/ci_variable_list/components/ci_variable_modal_spec.js index 058aca16ea0..70edd36669b 100644 --- a/spec/frontend/ci_variable_list/components/ci_variable_modal_spec.js +++ b/spec/frontend/ci_variable_list/components/ci_variable_modal_spec.js @@ -1,6 +1,6 @@ import Vuex from 'vuex'; import { createLocalVue, shallowMount } from '@vue/test-utils'; -import { GlButton } from '@gitlab/ui'; +import { GlDeprecatedButton } from '@gitlab/ui'; import CiVariableModal from '~/ci_variable_list/components/ci_variable_modal.vue'; import createStore from '~/ci_variable_list/store'; import mockData from '../services/mock_data'; @@ -27,11 +27,11 @@ describe('Ci variable modal', () => { const findModal = () => wrapper.find(ModalStub); const addOrUpdateButton = index => findModal() - .findAll(GlButton) + .findAll(GlDeprecatedButton) .at(index); const deleteVariableButton = () => findModal() - .findAll(GlButton) + .findAll(GlDeprecatedButton) .at(1); beforeEach(() => { diff --git a/spec/frontend/ci_variable_list/components/ci_variable_popover_spec.js b/spec/frontend/ci_variable_list/components/ci_variable_popover_spec.js index 5d37f059161..46f77a6f11e 100644 --- a/spec/frontend/ci_variable_list/components/ci_variable_popover_spec.js +++ b/spec/frontend/ci_variable_list/components/ci_variable_popover_spec.js @@ -1,5 +1,5 @@ import { shallowMount } from '@vue/test-utils'; -import { GlButton } from '@gitlab/ui'; +import { GlDeprecatedButton } from '@gitlab/ui'; import CiVariablePopover from '~/ci_variable_list/components/ci_variable_popover.vue'; import mockData from '../services/mock_data'; @@ -18,7 +18,7 @@ describe('Ci Variable Popover', () => { }); }; - const findButton = () => wrapper.find(GlButton); + const findButton = () => wrapper.find(GlDeprecatedButton); beforeEach(() => { createComponent(); diff --git a/spec/frontend/code_navigation/components/__snapshots__/popover_spec.js.snap b/spec/frontend/code_navigation/components/__snapshots__/popover_spec.js.snap index dda6d68018e..c1534022242 100644 --- a/spec/frontend/code_navigation/components/__snapshots__/popover_spec.js.snap +++ b/spec/frontend/code_navigation/components/__snapshots__/popover_spec.js.snap @@ -23,7 +23,7 @@ exports[`Code navigation popover component renders popover 1`] = ` <div class="popover-body" > - <gl-button-stub + <gl-deprecated-button-stub class="w-100" href="http://test.com" size="md" @@ -33,7 +33,7 @@ exports[`Code navigation popover component renders popover 1`] = ` Go to definition - </gl-button-stub> + </gl-deprecated-button-stub> </div> </div> `; diff --git a/spec/frontend/contributors/component/__snapshots__/contributors_spec.js.snap b/spec/frontend/contributors/component/__snapshots__/contributors_spec.js.snap index a4a0b98de1b..fafffcb6e0c 100644 --- a/spec/frontend/contributors/component/__snapshots__/contributors_spec.js.snap +++ b/spec/frontend/contributors/component/__snapshots__/contributors_spec.js.snap @@ -15,6 +15,7 @@ exports[`Contributors charts should render charts when loading completed and the <div> <glareachart-stub + annotations="" data="[object Object]" height="264" includelegendavgmax="true" @@ -42,6 +43,7 @@ exports[`Contributors charts should render charts when loading completed and the <div> <glareachart-stub + annotations="" data="[object Object]" height="216" includelegendavgmax="true" diff --git a/spec/frontend/environments/environment_pin_spec.js b/spec/frontend/environments/environment_pin_spec.js index d1d6735fa38..486f6db7366 100644 --- a/spec/frontend/environments/environment_pin_spec.js +++ b/spec/frontend/environments/environment_pin_spec.js @@ -1,5 +1,5 @@ import { shallowMount } from '@vue/test-utils'; -import { GlButton } from '@gitlab/ui'; +import { GlDeprecatedButton } from '@gitlab/ui'; import Icon from '~/vue_shared/components/icon.vue'; import eventHub from '~/environments/event_hub'; import PinComponent from '~/environments/components/environment_pin.vue'; @@ -37,7 +37,7 @@ describe('Pin Component', () => { it('should emit onPinClick when clicked', () => { const eventHubSpy = jest.spyOn(eventHub, '$emit'); - const button = wrapper.find(GlButton); + const button = wrapper.find(GlDeprecatedButton); button.vm.$emit('click'); diff --git a/spec/frontend/environments/environment_rollback_spec.js b/spec/frontend/environments/environment_rollback_spec.js index fb62a096c3d..f25e05f9cd8 100644 --- a/spec/frontend/environments/environment_rollback_spec.js +++ b/spec/frontend/environments/environment_rollback_spec.js @@ -1,5 +1,5 @@ import { shallowMount, mount } from '@vue/test-utils'; -import { GlButton } from '@gitlab/ui'; +import { GlDeprecatedButton } from '@gitlab/ui'; import eventHub from '~/environments/event_hub'; import RollbackComponent from '~/environments/components/environment_rollback.vue'; @@ -40,7 +40,7 @@ describe('Rollback Component', () => { }, }, }); - const button = wrapper.find(GlButton); + const button = wrapper.find(GlDeprecatedButton); button.vm.$emit('click'); diff --git a/spec/frontend/error_tracking/components/error_details_spec.js b/spec/frontend/error_tracking/components/error_details_spec.js index 72b0466a1f0..adbbc04ce78 100644 --- a/spec/frontend/error_tracking/components/error_details_spec.js +++ b/spec/frontend/error_tracking/components/error_details_spec.js @@ -3,7 +3,7 @@ import Vuex from 'vuex'; import { __ } from '~/locale'; import createFlash from '~/flash'; import { - GlButton, + GlDeprecatedButton, GlLoadingIcon, GlLink, GlBadge, @@ -38,7 +38,7 @@ describe('ErrorDetails', () => { function mountComponent() { wrapper = shallowMount(ErrorDetails, { - stubs: { GlButton, GlSprintf }, + stubs: { GlDeprecatedButton, GlSprintf }, localVue, store, mocks, @@ -178,7 +178,7 @@ describe('ErrorDetails', () => { expect(wrapper.find(GlLoadingIcon).exists()).toBe(true); expect(wrapper.find(Stacktrace).exists()).toBe(false); expect(wrapper.find(GlBadge).exists()).toBe(false); - expect(wrapper.findAll(GlButton).length).toBe(3); + expect(wrapper.findAll(GlDeprecatedButton).length).toBe(3); }); describe('unsafe chars for culprit field', () => { diff --git a/spec/frontend/error_tracking/components/error_tracking_actions_spec.js b/spec/frontend/error_tracking/components/error_tracking_actions_spec.js index b22805f5227..1ea92883e54 100644 --- a/spec/frontend/error_tracking/components/error_tracking_actions_spec.js +++ b/spec/frontend/error_tracking/components/error_tracking_actions_spec.js @@ -1,5 +1,5 @@ import { shallowMount } from '@vue/test-utils'; -import { GlButton } from '@gitlab/ui'; +import { GlDeprecatedButton } from '@gitlab/ui'; import ErrorTrackingActions from '~/error_tracking/components/error_tracking_actions.vue'; describe('Error Tracking Actions', () => { @@ -20,7 +20,7 @@ describe('Error Tracking Actions', () => { }, ...props, }, - stubs: { GlButton }, + stubs: { GlDeprecatedButton }, }); } @@ -34,7 +34,7 @@ describe('Error Tracking Actions', () => { } }); - const findButtons = () => wrapper.findAll(GlButton); + const findButtons = () => wrapper.findAll(GlDeprecatedButton); describe('when error status is unresolved', () => { it('renders the correct actions buttons to allow ignore and resolve', () => { diff --git a/spec/frontend/error_tracking/components/error_tracking_list_spec.js b/spec/frontend/error_tracking/components/error_tracking_list_spec.js index 3bea1d343be..a6cb074f481 100644 --- a/spec/frontend/error_tracking/components/error_tracking_list_spec.js +++ b/spec/frontend/error_tracking/components/error_tracking_list_spec.js @@ -241,7 +241,7 @@ describe('ErrorTrackingList', () => { stubs: { GlTable: false, GlLink: false, - GlButton: false, + GlDeprecatedButton: false, }, }); }); @@ -280,7 +280,7 @@ describe('ErrorTrackingList', () => { stubs: { GlTable: false, GlLink: false, - GlButton: false, + GlDeprecatedButton: false, }, }); }); diff --git a/spec/frontend/grafana_integration/components/__snapshots__/grafana_integration_spec.js.snap b/spec/frontend/grafana_integration/components/__snapshots__/grafana_integration_spec.js.snap index 09977ecc7a3..1595f6c9fff 100644 --- a/spec/frontend/grafana_integration/components/__snapshots__/grafana_integration_spec.js.snap +++ b/spec/frontend/grafana_integration/components/__snapshots__/grafana_integration_spec.js.snap @@ -16,13 +16,13 @@ exports[`grafana integration component default state to match the default snapsh </h3> - <gl-button-stub + <gl-deprecated-button-stub class="js-settings-toggle" size="md" variant="secondary" > Expand - </gl-button-stub> + </gl-deprecated-button-stub> <p class="js-section-sub-header" @@ -90,14 +90,14 @@ exports[`grafana integration component default state to match the default snapsh </p> </gl-form-group-stub> - <gl-button-stub + <gl-deprecated-button-stub size="md" variant="success" > Save Changes - </gl-button-stub> + </gl-deprecated-button-stub> </form> </div> </section> diff --git a/spec/frontend/grafana_integration/components/grafana_integration_spec.js b/spec/frontend/grafana_integration/components/grafana_integration_spec.js index 92754ada64f..3df200a98e4 100644 --- a/spec/frontend/grafana_integration/components/grafana_integration_spec.js +++ b/spec/frontend/grafana_integration/components/grafana_integration_spec.js @@ -1,5 +1,5 @@ import { mount, shallowMount } from '@vue/test-utils'; -import { GlButton } from '@gitlab/ui'; +import { GlDeprecatedButton } from '@gitlab/ui'; import { TEST_HOST } from 'helpers/test_constants'; import GrafanaIntegration from '~/grafana_integration/components/grafana_integration.vue'; import { createStore } from '~/grafana_integration/store'; @@ -51,7 +51,7 @@ describe('grafana integration component', () => { it('renders as an expand button by default', () => { wrapper = shallowMount(GrafanaIntegration, { store }); - const button = wrapper.find(GlButton); + const button = wrapper.find(GlDeprecatedButton); expect(button.text()).toBe('Expand'); }); @@ -77,7 +77,8 @@ describe('grafana integration component', () => { }); describe('submit button', () => { - const findSubmitButton = () => wrapper.find('.settings-content form').find(GlButton); + const findSubmitButton = () => + wrapper.find('.settings-content form').find(GlDeprecatedButton); const endpointRequest = [ operationsSettingsEndpoint, diff --git a/spec/frontend/logs/components/log_control_buttons_spec.js b/spec/frontend/logs/components/log_control_buttons_spec.js index 38e568f569f..85fc5a040d6 100644 --- a/spec/frontend/logs/components/log_control_buttons_spec.js +++ b/spec/frontend/logs/components/log_control_buttons_spec.js @@ -1,5 +1,5 @@ import { shallowMount } from '@vue/test-utils'; -import { GlButton } from '@gitlab/ui'; +import { GlDeprecatedButton } from '@gitlab/ui'; import LogControlButtons from '~/logs/components/log_control_buttons.vue'; describe('LogControlButtons', () => { @@ -31,9 +31,9 @@ describe('LogControlButtons', () => { expect(wrapper.isVueInstance()).toBe(true); expect(wrapper.isEmpty()).toBe(false); - expect(findScrollToTop().is(GlButton)).toBe(true); - expect(findScrollToBottom().is(GlButton)).toBe(true); - expect(findRefreshBtn().is(GlButton)).toBe(true); + expect(findScrollToTop().is(GlDeprecatedButton)).toBe(true); + expect(findScrollToBottom().is(GlDeprecatedButton)).toBe(true); + expect(findRefreshBtn().is(GlDeprecatedButton)).toBe(true); }); it('emits a `refresh` event on click on `refresh` button', () => { diff --git a/spec/frontend/maintenance_mode_settings/components/app_spec.js b/spec/frontend/maintenance_mode_settings/components/app_spec.js index a67bc63cfe1..0453354b008 100644 --- a/spec/frontend/maintenance_mode_settings/components/app_spec.js +++ b/spec/frontend/maintenance_mode_settings/components/app_spec.js @@ -1,6 +1,6 @@ import { shallowMount } from '@vue/test-utils'; import MaintenanceModeSettingsApp from '~/maintenance_mode_settings/components/app.vue'; -import { GlToggle, GlFormTextarea, GlButton } from '@gitlab/ui'; +import { GlToggle, GlFormTextarea, GlDeprecatedButton } from '@gitlab/ui'; describe('MaintenanceModeSettingsApp', () => { let wrapper; @@ -16,7 +16,7 @@ describe('MaintenanceModeSettingsApp', () => { const findMaintenanceModeSettingsContainer = () => wrapper.find('article'); const findGlToggle = () => wrapper.find(GlToggle); const findGlFormTextarea = () => wrapper.find(GlFormTextarea); - const findGlButton = () => wrapper.find(GlButton); + const findGlButton = () => wrapper.find(GlDeprecatedButton); describe('template', () => { beforeEach(() => { @@ -35,7 +35,7 @@ describe('MaintenanceModeSettingsApp', () => { expect(findGlFormTextarea().exists()).toBe(true); }); - it('renders the GlButton', () => { + it('renders the GlDeprecatedButton', () => { expect(findGlButton().exists()).toBe(true); }); }); diff --git a/spec/frontend/monitoring/components/__snapshots__/dashboard_template_spec.js.snap b/spec/frontend/monitoring/components/__snapshots__/dashboard_template_spec.js.snap index c61ac0fb175..f7e15d4a5c4 100644 --- a/spec/frontend/monitoring/components/__snapshots__/dashboard_template_spec.js.snap +++ b/spec/frontend/monitoring/components/__snapshots__/dashboard_template_spec.js.snap @@ -90,7 +90,7 @@ exports[`Dashboard template matches the default snapshot 1`] = ` <gl-form-group-stub class="col-sm-2 col-md-2 col-lg-1 refresh-dashboard-button" > - <gl-button-stub + <gl-deprecated-button-stub size="md" title="Reload this page" variant="default" @@ -99,7 +99,7 @@ exports[`Dashboard template matches the default snapshot 1`] = ` name="repeat" size="16" /> - </gl-button-stub> + </gl-deprecated-button-stub> </gl-form-group-stub> <!----> diff --git a/spec/frontend/monitoring/components/dashboard_spec.js b/spec/frontend/monitoring/components/dashboard_spec.js index ec25c9e169a..f2c3b199481 100644 --- a/spec/frontend/monitoring/components/dashboard_spec.js +++ b/spec/frontend/monitoring/components/dashboard_spec.js @@ -1,5 +1,5 @@ import { shallowMount, createLocalVue, mount } from '@vue/test-utils'; -import { GlDropdownItem, GlButton } from '@gitlab/ui'; +import { GlDropdownItem, GlDeprecatedButton } from '@gitlab/ui'; import VueDraggable from 'vuedraggable'; import MockAdapter from 'axios-mock-adapter'; import axios from '~/lib/utils/axios_utils'; @@ -234,7 +234,7 @@ describe('Dashboard', () => { const refreshBtn = wrapper.findAll({ ref: 'refreshDashboardBtn' }); expect(refreshBtn).toHaveLength(1); - expect(refreshBtn.is(GlButton)).toBe(true); + expect(refreshBtn.is(GlDeprecatedButton)).toBe(true); }); }); @@ -517,7 +517,7 @@ describe('Dashboard', () => { const externalDashboardButton = wrapper.find('.js-external-dashboard-link'); expect(externalDashboardButton.exists()).toBe(true); - expect(externalDashboardButton.is(GlButton)).toBe(true); + expect(externalDashboardButton.is(GlDeprecatedButton)).toBe(true); expect(externalDashboardButton.text()).toContain('View full dashboard'); }); }); diff --git a/spec/frontend/monitoring/components/embeds/embed_group_spec.js b/spec/frontend/monitoring/components/embeds/embed_group_spec.js index 54d21def603..49c10483c45 100644 --- a/spec/frontend/monitoring/components/embeds/embed_group_spec.js +++ b/spec/frontend/monitoring/components/embeds/embed_group_spec.js @@ -1,6 +1,6 @@ import { createLocalVue, mount, shallowMount } from '@vue/test-utils'; import Vuex from 'vuex'; -import { GlButton, GlCard } from '@gitlab/ui'; +import { GlDeprecatedButton, GlCard } from '@gitlab/ui'; import { TEST_HOST } from 'helpers/test_constants'; import EmbedGroup from '~/monitoring/components/embeds/embed_group.vue'; import MetricEmbed from '~/monitoring/components/embeds/metric_embed.vue'; @@ -80,7 +80,7 @@ describe('Embed Group', () => { metricsWithDataGetter.mockReturnValue([1]); mountComponent({ shallow: false, stubs: { MetricEmbed: '<div />' } }); - wrapper.find(GlButton).trigger('click'); + wrapper.find(GlDeprecatedButton).trigger('click'); wrapper.vm.$nextTick(() => { expect(wrapper.find('.card-body').classes()).toContain('d-none'); @@ -150,14 +150,14 @@ describe('Embed Group', () => { metricsWithDataGetter.mockReturnValue([1]); mountComponent({ shallow: false, stubs: { MetricEmbed: '<div />' } }); - expect(wrapper.find(GlButton).text()).toBe('Hide chart'); + expect(wrapper.find(GlDeprecatedButton).text()).toBe('Hide chart'); }); it('has a plural label when there are multiple embeds', () => { metricsWithDataGetter.mockReturnValue([2]); mountComponent({ shallow: false, stubs: { MetricEmbed: '<div />' } }); - expect(wrapper.find(GlButton).text()).toBe('Hide charts'); + expect(wrapper.find(GlDeprecatedButton).text()).toBe('Hide charts'); }); }); }); diff --git a/spec/frontend/notes/components/discussion_resolve_with_issue_button_spec.js b/spec/frontend/notes/components/discussion_resolve_with_issue_button_spec.js index 4348445f7ca..e62fb5db2c0 100644 --- a/spec/frontend/notes/components/discussion_resolve_with_issue_button_spec.js +++ b/spec/frontend/notes/components/discussion_resolve_with_issue_button_spec.js @@ -1,4 +1,4 @@ -import { GlButton } from '@gitlab/ui'; +import { GlDeprecatedButton } from '@gitlab/ui'; import { shallowMount, createLocalVue } from '@vue/test-utils'; import { TEST_HOST } from 'spec/test_constants'; import ResolveWithIssueButton from '~/notes/components/discussion_resolve_with_issue_button.vue'; @@ -23,7 +23,7 @@ describe('ResolveWithIssueButton', () => { }); it('it should have a link with the provided link property as href', () => { - const button = wrapper.find(GlButton); + const button = wrapper.find(GlDeprecatedButton); expect(button.attributes().href).toBe(url); }); diff --git a/spec/frontend/operation_settings/components/external_dashboard_spec.js b/spec/frontend/operation_settings/components/external_dashboard_spec.js index 89db03378db..19214d1d954 100644 --- a/spec/frontend/operation_settings/components/external_dashboard_spec.js +++ b/spec/frontend/operation_settings/components/external_dashboard_spec.js @@ -1,5 +1,5 @@ import { mount, shallowMount } from '@vue/test-utils'; -import { GlButton, GlLink, GlFormGroup, GlFormInput } from '@gitlab/ui'; +import { GlDeprecatedButton, GlLink, GlFormGroup, GlFormInput } from '@gitlab/ui'; import { TEST_HOST } from 'helpers/test_constants'; import ExternalDashboard from '~/operation_settings/components/external_dashboard.vue'; import store from '~/operation_settings/store'; @@ -49,7 +49,7 @@ describe('operation settings external dashboard component', () => { describe('expand/collapse button', () => { it('renders as an expand button by default', () => { - const button = wrapper.find(GlButton); + const button = wrapper.find(GlDeprecatedButton); expect(button.text()).toBe('Expand'); }); @@ -115,7 +115,8 @@ describe('operation settings external dashboard component', () => { }); describe('submit button', () => { - const findSubmitButton = () => wrapper.find('.settings-content form').find(GlButton); + const findSubmitButton = () => + wrapper.find('.settings-content form').find(GlDeprecatedButton); const endpointRequest = [ operationsSettingsEndpoint, diff --git a/spec/frontend/pages/admin/users/components/__snapshots__/delete_user_modal_spec.js.snap b/spec/frontend/pages/admin/users/components/__snapshots__/delete_user_modal_spec.js.snap index 9b723ccc3dc..ea3bedf59e0 100644 --- a/spec/frontend/pages/admin/users/components/__snapshots__/delete_user_modal_spec.js.snap +++ b/spec/frontend/pages/admin/users/components/__snapshots__/delete_user_modal_spec.js.snap @@ -38,14 +38,14 @@ exports[`User Operation confirmation modal renders modal with form included 1`] /> </form> - <gl-button-stub + <gl-deprecated-button-stub size="md" variant="secondary" > Cancel - </gl-button-stub> + </gl-deprecated-button-stub> - <gl-button-stub + <gl-deprecated-button-stub disabled="true" size="md" variant="warning" @@ -53,14 +53,14 @@ exports[`User Operation confirmation modal renders modal with form included 1`] secondaryAction - </gl-button-stub> + </gl-deprecated-button-stub> - <gl-button-stub + <gl-deprecated-button-stub disabled="true" size="md" variant="danger" > action - </gl-button-stub> + </gl-deprecated-button-stub> </div> `; diff --git a/spec/frontend/pages/admin/users/components/delete_user_modal_spec.js b/spec/frontend/pages/admin/users/components/delete_user_modal_spec.js index 3efefa8137f..16b0bd305cd 100644 --- a/spec/frontend/pages/admin/users/components/delete_user_modal_spec.js +++ b/spec/frontend/pages/admin/users/components/delete_user_modal_spec.js @@ -1,5 +1,5 @@ import { shallowMount } from '@vue/test-utils'; -import { GlButton, GlFormInput } from '@gitlab/ui'; +import { GlDeprecatedButton, GlFormInput } from '@gitlab/ui'; import DeleteUserModal from '~/pages/admin/users/components/delete_user_modal.vue'; import ModalStub from './stubs/modal_stub'; @@ -13,7 +13,7 @@ describe('User Operation confirmation modal', () => { const findButton = variant => wrapper - .findAll(GlButton) + .findAll(GlDeprecatedButton) .filter(w => w.attributes('variant') === variant) .at(0); const findForm = () => wrapper.find('form'); diff --git a/spec/frontend/projects/pipelines/charts/components/__snapshots__/pipelines_area_chart_spec.js.snap b/spec/frontend/projects/pipelines/charts/components/__snapshots__/pipelines_area_chart_spec.js.snap index c15971912dd..3222b92d23f 100644 --- a/spec/frontend/projects/pipelines/charts/components/__snapshots__/pipelines_area_chart_spec.js.snap +++ b/spec/frontend/projects/pipelines/charts/components/__snapshots__/pipelines_area_chart_spec.js.snap @@ -10,6 +10,7 @@ exports[`PipelinesAreaChart matches the snapshot 1`] = ` <div> <glareachart-stub + annotations="" data="[object Object],[object Object]" height="300" legendaveragetext="Avg" diff --git a/spec/frontend/releases/components/release_block_milestone_info_spec.js b/spec/frontend/releases/components/release_block_milestone_info_spec.js index 0e79c45b337..0b65b6cab96 100644 --- a/spec/frontend/releases/components/release_block_milestone_info_spec.js +++ b/spec/frontend/releases/components/release_block_milestone_info_spec.js @@ -1,5 +1,5 @@ import { mount } from '@vue/test-utils'; -import { GlProgressBar, GlLink, GlBadge, GlButton } from '@gitlab/ui'; +import { GlProgressBar, GlLink, GlBadge, GlDeprecatedButton } from '@gitlab/ui'; import { trimText } from 'helpers/text_helper'; import ReleaseBlockMilestoneInfo from '~/releases/components/release_block_milestone_info.vue'; import { milestones as originalMilestones } from '../mock_data'; @@ -106,7 +106,7 @@ describe('Release block milestone info', () => { const clickShowMoreFewerButton = () => { milestoneListContainer() - .find(GlButton) + .find(GlDeprecatedButton) .trigger('click'); return wrapper.vm.$nextTick(); diff --git a/spec/frontend/self_monitor/components/__snapshots__/self_monitor_form_spec.js.snap b/spec/frontend/self_monitor/components/__snapshots__/self_monitor_form_spec.js.snap index 955716ccbca..f7a9827a9ad 100644 --- a/spec/frontend/self_monitor/components/__snapshots__/self_monitor_form_spec.js.snap +++ b/spec/frontend/self_monitor/components/__snapshots__/self_monitor_form_spec.js.snap @@ -15,13 +15,13 @@ exports[`self monitor component When the self monitor project has not been creat </h4> - <gl-button-stub + <gl-deprecated-button-stub class="js-settings-toggle" size="md" variant="secondary" > Expand - </gl-button-stub> + </gl-deprecated-button-stub> <p class="js-section-sub-header" diff --git a/spec/frontend/self_monitor/components/self_monitor_form_spec.js b/spec/frontend/self_monitor/components/self_monitor_form_spec.js index 6532c6ed2c7..0e6abba08f3 100644 --- a/spec/frontend/self_monitor/components/self_monitor_form_spec.js +++ b/spec/frontend/self_monitor/components/self_monitor_form_spec.js @@ -1,5 +1,5 @@ import { shallowMount } from '@vue/test-utils'; -import { GlButton } from '@gitlab/ui'; +import { GlDeprecatedButton } from '@gitlab/ui'; import SelfMonitor from '~/self_monitor/components/self_monitor_form.vue'; import { createStore } from '~/self_monitor/store'; @@ -41,7 +41,7 @@ describe('self monitor component', () => { it('renders as an expand button by default', () => { wrapper = shallowMount(SelfMonitor, { store }); - const button = wrapper.find(GlButton); + const button = wrapper.find(GlDeprecatedButton); expect(button.text()).toBe('Expand'); }); diff --git a/spec/frontend/serverless/components/missing_prometheus_spec.js b/spec/frontend/serverless/components/missing_prometheus_spec.js index 896dc5b43e1..90730765f7c 100644 --- a/spec/frontend/serverless/components/missing_prometheus_spec.js +++ b/spec/frontend/serverless/components/missing_prometheus_spec.js @@ -1,4 +1,4 @@ -import { GlButton } from '@gitlab/ui'; +import { GlDeprecatedButton } from '@gitlab/ui'; import { shallowMount } from '@vue/test-utils'; import missingPrometheusComponent from '~/serverless/components/missing_prometheus.vue'; @@ -26,7 +26,7 @@ describe('missingPrometheusComponent', () => { 'Function invocation metrics require Prometheus to be installed first.', ); - expect(wrapper.find(GlButton).attributes('variant')).toBe('success'); + expect(wrapper.find(GlDeprecatedButton).attributes('variant')).toBe('success'); }); it('should render no prometheus data message', () => { diff --git a/spec/frontend/snippets/components/snippet_blob_edit_spec.js b/spec/frontend/snippets/components/snippet_blob_edit_spec.js index 334fe7196a4..75688e61892 100644 --- a/spec/frontend/snippets/components/snippet_blob_edit_spec.js +++ b/spec/frontend/snippets/components/snippet_blob_edit_spec.js @@ -1,6 +1,7 @@ import SnippetBlobEdit from '~/snippets/components/snippet_blob_edit.vue'; import BlobHeaderEdit from '~/blob/components/blob_edit_header.vue'; import BlobContentEdit from '~/blob/components/blob_edit_content.vue'; +import { GlLoadingIcon } from '@gitlab/ui'; import { shallowMount } from '@vue/test-utils'; import { nextTick } from 'vue'; @@ -13,11 +14,13 @@ describe('Snippet Blob Edit component', () => { const findHeader = () => wrapper.find(BlobHeaderEdit); const findContent = () => wrapper.find(BlobContentEdit); - function createComponent() { + function createComponent(props = {}) { wrapper = shallowMount(SnippetBlobEdit, { propsData: { value, fileName, + isLoading: false, + ...props, }, }); } @@ -39,9 +42,23 @@ describe('Snippet Blob Edit component', () => { expect(findHeader().exists()).toBe(true); expect(findContent().exists()).toBe(true); }); + + it('renders loader if isLoading equals true', () => { + createComponent({ isLoading: true }); + expect(wrapper.contains(GlLoadingIcon)).toBe(true); + expect(findContent().exists()).toBe(false); + }); }); describe('functionality', () => { + it('does not fail without content', () => { + const spy = jest.spyOn(global.console, 'error'); + createComponent({ value: undefined }); + + expect(spy).not.toHaveBeenCalled(); + expect(findContent().exists()).toBe(true); + }); + it('emits "name-change" event when the file name gets changed', () => { expect(wrapper.emitted('name-change')).toBeUndefined(); const newFilename = 'foo.bar'; @@ -51,5 +68,15 @@ describe('Snippet Blob Edit component', () => { expect(wrapper.emitted('name-change')[0]).toEqual([newFilename]); }); }); + + it('emits "input" event when the file content gets changed', () => { + expect(wrapper.emitted('input')).toBeUndefined(); + const newValue = 'foo.bar'; + findContent().vm.$emit('input', newValue); + + return nextTick().then(() => { + expect(wrapper.emitted('input')[0]).toEqual([newValue]); + }); + }); }); }); diff --git a/spec/frontend/snippets/components/snippet_header_spec.js b/spec/frontend/snippets/components/snippet_header_spec.js index 16a66c70d6a..878baab9cac 100644 --- a/spec/frontend/snippets/components/snippet_header_spec.js +++ b/spec/frontend/snippets/components/snippet_header_spec.js @@ -1,7 +1,7 @@ import SnippetHeader from '~/snippets/components/snippet_header.vue'; import DeleteSnippetMutation from '~/snippets/mutations/deleteSnippet.mutation.graphql'; import { ApolloMutation } from 'vue-apollo'; -import { GlButton, GlModal } from '@gitlab/ui'; +import { GlDeprecatedButton, GlModal } from '@gitlab/ui'; import { shallowMount } from '@vue/test-utils'; describe('Snippet header component', () => { @@ -89,7 +89,7 @@ describe('Snippet header component', () => { updateSnippet: false, }, }); - expect(wrapper.findAll(GlButton).length).toEqual(0); + expect(wrapper.findAll(GlDeprecatedButton).length).toEqual(0); createComponent({ permissions: { @@ -97,7 +97,7 @@ describe('Snippet header component', () => { updateSnippet: false, }, }); - expect(wrapper.findAll(GlButton).length).toEqual(1); + expect(wrapper.findAll(GlDeprecatedButton).length).toEqual(1); createComponent({ permissions: { @@ -105,7 +105,7 @@ describe('Snippet header component', () => { updateSnippet: true, }, }); - expect(wrapper.findAll(GlButton).length).toEqual(2); + expect(wrapper.findAll(GlDeprecatedButton).length).toEqual(2); createComponent({ permissions: { @@ -117,7 +117,7 @@ describe('Snippet header component', () => { canCreateSnippet: true, }); return wrapper.vm.$nextTick().then(() => { - expect(wrapper.findAll(GlButton).length).toEqual(3); + expect(wrapper.findAll(GlDeprecatedButton).length).toEqual(3); }); }); diff --git a/spec/frontend/static_site_editor/components/static_site_editor_spec.js b/spec/frontend/static_site_editor/components/static_site_editor_spec.js new file mode 100644 index 00000000000..919763ce9fe --- /dev/null +++ b/spec/frontend/static_site_editor/components/static_site_editor_spec.js @@ -0,0 +1,82 @@ +import Vuex from 'vuex'; +import { shallowMount, createLocalVue } from '@vue/test-utils'; + +import { GlSkeletonLoader } from '@gitlab/ui'; + +import createState from '~/static_site_editor/store/state'; + +import StaticSiteEditor from '~/static_site_editor/components/static_site_editor.vue'; +import EditArea from '~/static_site_editor/components/edit_area.vue'; + +const localVue = createLocalVue(); + +localVue.use(Vuex); + +describe('StaticSiteEditor', () => { + let wrapper; + let store; + let loadContentActionMock; + + const buildStore = (initialState = {}) => { + loadContentActionMock = jest.fn(); + + store = new Vuex.Store({ + state: createState(initialState), + actions: { + loadContent: loadContentActionMock, + }, + }); + }; + + const buildWrapper = () => { + wrapper = shallowMount(StaticSiteEditor, { + localVue, + store, + }); + }; + + const findEditArea = () => wrapper.find(EditArea); + + beforeEach(() => { + buildStore(); + buildWrapper(); + }); + + afterEach(() => { + wrapper.destroy(); + }); + + describe('when content is not loaded', () => { + it('does not render edit area', () => { + expect(findEditArea().exists()).toBe(false); + }); + }); + + describe('when content is loaded', () => { + const content = 'edit area content'; + + beforeEach(() => { + buildStore({ content, isContentLoaded: true }); + buildWrapper(); + }); + + it('renders the edit area', () => { + expect(findEditArea().exists()).toBe(true); + }); + + it('passes page content to edit area', () => { + expect(findEditArea().props('value')).toBe(content); + }); + }); + + it('displays skeleton loader while loading content', () => { + buildStore({ isLoadingContent: true }); + buildWrapper(); + + expect(wrapper.find(GlSkeletonLoader).exists()).toBe(true); + }); + + it('dispatches load content action', () => { + expect(loadContentActionMock).toHaveBeenCalled(); + }); +}); diff --git a/spec/frontend/vue_mr_widget/deployment/deployment_action_button_spec.js b/spec/frontend/vue_mr_widget/deployment/deployment_action_button_spec.js index 1b14ee694fe..6adf4975414 100644 --- a/spec/frontend/vue_mr_widget/deployment/deployment_action_button_spec.js +++ b/spec/frontend/vue_mr_widget/deployment/deployment_action_button_spec.js @@ -1,5 +1,5 @@ import { mount } from '@vue/test-utils'; -import { GlIcon, GlLoadingIcon, GlButton } from '@gitlab/ui'; +import { GlIcon, GlLoadingIcon, GlDeprecatedButton } from '@gitlab/ui'; import DeploymentActionButton from '~/vue_merge_request_widget/components/deployment/deployment_action_button.vue'; import { CREATED, @@ -75,7 +75,7 @@ describe('Deployment action button', () => { it('is disabled and shows the loading icon', () => { expect(wrapper.find(GlLoadingIcon).exists()).toBe(true); - expect(wrapper.find(GlButton).props('disabled')).toBe(true); + expect(wrapper.find(GlDeprecatedButton).props('disabled')).toBe(true); }); }); @@ -90,7 +90,7 @@ describe('Deployment action button', () => { }); it('is disabled and does not show the loading icon', () => { expect(wrapper.find(GlLoadingIcon).exists()).toBe(false); - expect(wrapper.find(GlButton).props('disabled')).toBe(true); + expect(wrapper.find(GlDeprecatedButton).props('disabled')).toBe(true); }); }); @@ -106,7 +106,7 @@ describe('Deployment action button', () => { }); it('is disabled and does not show the loading icon', () => { expect(wrapper.find(GlLoadingIcon).exists()).toBe(false); - expect(wrapper.find(GlButton).props('disabled')).toBe(true); + expect(wrapper.find(GlDeprecatedButton).props('disabled')).toBe(true); }); }); @@ -118,7 +118,7 @@ describe('Deployment action button', () => { }); it('is not disabled nor does it show the loading icon', () => { expect(wrapper.find(GlLoadingIcon).exists()).toBe(false); - expect(wrapper.find(GlButton).props('disabled')).toBe(false); + expect(wrapper.find(GlDeprecatedButton).props('disabled')).toBe(false); }); }); }); diff --git a/spec/frontend/vue_shared/components/clipboard_button_spec.js b/spec/frontend/vue_shared/components/clipboard_button_spec.js index 07ff86828e7..7f0b7ba8cf8 100644 --- a/spec/frontend/vue_shared/components/clipboard_button_spec.js +++ b/spec/frontend/vue_shared/components/clipboard_button_spec.js @@ -1,5 +1,5 @@ import { shallowMount } from '@vue/test-utils'; -import { GlButton, GlIcon } from '@gitlab/ui'; +import { GlDeprecatedButton, GlIcon } from '@gitlab/ui'; import ClipboardButton from '~/vue_shared/components/clipboard_button.vue'; describe('clipboard button', () => { @@ -26,7 +26,7 @@ describe('clipboard button', () => { }); it('renders a button for clipboard', () => { - expect(wrapper.find(GlButton).exists()).toBe(true); + expect(wrapper.find(GlDeprecatedButton).exists()).toBe(true); expect(wrapper.attributes('data-clipboard-text')).toBe('copy me'); expect(wrapper.find(GlIcon).props('name')).toBe('copy-to-clipboard'); }); diff --git a/spec/frontend/vue_shared/components/sidebar/labels_select_vue/dropdown_button_spec.js b/spec/frontend/vue_shared/components/sidebar/labels_select_vue/dropdown_button_spec.js index d996f48f9cc..e2d31a41e82 100644 --- a/spec/frontend/vue_shared/components/sidebar/labels_select_vue/dropdown_button_spec.js +++ b/spec/frontend/vue_shared/components/sidebar/labels_select_vue/dropdown_button_spec.js @@ -35,7 +35,7 @@ describe('DropdownButton', () => { describe('template', () => { it('renders component container element', () => { - expect(wrapper.is('gl-button-stub')).toBe(true); + expect(wrapper.is('gl-deprecated-button-stub')).toBe(true); }); it('renders button text element', () => { diff --git a/spec/frontend/vue_shared/components/sidebar/labels_select_vue/dropdown_contents_create_view_spec.js b/spec/frontend/vue_shared/components/sidebar/labels_select_vue/dropdown_contents_create_view_spec.js index 9bc01d8723f..d7ca7ce30a9 100644 --- a/spec/frontend/vue_shared/components/sidebar/labels_select_vue/dropdown_contents_create_view_spec.js +++ b/spec/frontend/vue_shared/components/sidebar/labels_select_vue/dropdown_contents_create_view_spec.js @@ -1,7 +1,7 @@ import Vuex from 'vuex'; import { shallowMount, createLocalVue } from '@vue/test-utils'; -import { GlButton, GlIcon, GlFormInput, GlLink, GlLoadingIcon } from '@gitlab/ui'; +import { GlDeprecatedButton, GlIcon, GlFormInput, GlLink, GlLoadingIcon } from '@gitlab/ui'; import DropdownContentsCreateView from '~/vue_shared/components/sidebar/labels_select_vue/dropdown_contents_create_view.vue'; import labelSelectModule from '~/vue_shared/components/sidebar/labels_select_vue/store'; @@ -127,7 +127,7 @@ describe('DropdownContentsCreateView', () => { it('renders dropdown back button element', () => { const backBtnEl = wrapper .find('.dropdown-title') - .findAll(GlButton) + .findAll(GlDeprecatedButton) .at(0); expect(backBtnEl.exists()).toBe(true); @@ -145,7 +145,7 @@ describe('DropdownContentsCreateView', () => { it('renders dropdown close button element', () => { const closeBtnEl = wrapper .find('.dropdown-title') - .findAll(GlButton) + .findAll(GlDeprecatedButton) .at(1); expect(closeBtnEl.exists()).toBe(true); @@ -192,7 +192,7 @@ describe('DropdownContentsCreateView', () => { it('renders create button element', () => { const createBtnEl = wrapper .find('.dropdown-actions') - .findAll(GlButton) + .findAll(GlDeprecatedButton) .at(0); expect(createBtnEl.exists()).toBe(true); @@ -213,7 +213,7 @@ describe('DropdownContentsCreateView', () => { it('renders cancel button element', () => { const cancelBtnEl = wrapper .find('.dropdown-actions') - .findAll(GlButton) + .findAll(GlDeprecatedButton) .at(1); expect(cancelBtnEl.exists()).toBe(true); diff --git a/spec/frontend/vue_shared/components/sidebar/labels_select_vue/dropdown_contents_labels_view_spec.js b/spec/frontend/vue_shared/components/sidebar/labels_select_vue/dropdown_contents_labels_view_spec.js index 487b917852e..3e6dbdb7ecb 100644 --- a/spec/frontend/vue_shared/components/sidebar/labels_select_vue/dropdown_contents_labels_view_spec.js +++ b/spec/frontend/vue_shared/components/sidebar/labels_select_vue/dropdown_contents_labels_view_spec.js @@ -1,7 +1,7 @@ import Vuex from 'vuex'; import { shallowMount, createLocalVue } from '@vue/test-utils'; -import { GlButton, GlLoadingIcon, GlIcon, GlSearchBoxByType, GlLink } from '@gitlab/ui'; +import { GlDeprecatedButton, GlLoadingIcon, GlIcon, GlSearchBoxByType, GlLink } from '@gitlab/ui'; import { UP_KEY_CODE, DOWN_KEY_CODE, ENTER_KEY_CODE, ESC_KEY_CODE } from '~/lib/utils/keycodes'; import DropdownContentsLabelsView from '~/vue_shared/components/sidebar/labels_select_vue/dropdown_contents_labels_view.vue'; @@ -199,7 +199,7 @@ describe('DropdownContentsLabelsView', () => { }); it('renders dropdown close button element', () => { - const closeButtonEl = wrapper.find('.dropdown-title').find(GlButton); + const closeButtonEl = wrapper.find('.dropdown-title').find(GlDeprecatedButton); expect(closeButtonEl.exists()).toBe(true); expect(closeButtonEl.find(GlIcon).exists()).toBe(true); @@ -253,7 +253,7 @@ describe('DropdownContentsLabelsView', () => { }); it('renders footer list items', () => { - const createLabelBtn = wrapper.find('.dropdown-footer').find(GlButton); + const createLabelBtn = wrapper.find('.dropdown-footer').find(GlDeprecatedButton); const manageLabelsLink = wrapper.find('.dropdown-footer').find(GlLink); expect(createLabelBtn.exists()).toBe(true); diff --git a/spec/frontend/vue_shared/components/sidebar/labels_select_vue/dropdown_title_spec.js b/spec/frontend/vue_shared/components/sidebar/labels_select_vue/dropdown_title_spec.js index c1d9be7393c..0717fd829a0 100644 --- a/spec/frontend/vue_shared/components/sidebar/labels_select_vue/dropdown_title_spec.js +++ b/spec/frontend/vue_shared/components/sidebar/labels_select_vue/dropdown_title_spec.js @@ -1,7 +1,7 @@ import Vuex from 'vuex'; import { shallowMount, createLocalVue } from '@vue/test-utils'; -import { GlButton, GlLoadingIcon } from '@gitlab/ui'; +import { GlDeprecatedButton, GlLoadingIcon } from '@gitlab/ui'; import DropdownTitle from '~/vue_shared/components/sidebar/labels_select_vue/dropdown_title.vue'; import labelsSelectModule from '~/vue_shared/components/sidebar/labels_select_vue/store'; @@ -42,7 +42,7 @@ describe('DropdownTitle', () => { }); it('renders edit link', () => { - const editBtnEl = wrapper.find(GlButton); + const editBtnEl = wrapper.find(GlDeprecatedButton); expect(editBtnEl.exists()).toBe(true); expect(editBtnEl.text()).toBe('Edit'); diff --git a/spec/frontend/vue_shared/components/user_avatar/user_avatar_list_spec.js b/spec/frontend/vue_shared/components/user_avatar/user_avatar_list_spec.js index 6f66d1cafb9..1db1114f9ba 100644 --- a/spec/frontend/vue_shared/components/user_avatar/user_avatar_list_spec.js +++ b/spec/frontend/vue_shared/components/user_avatar/user_avatar_list_spec.js @@ -1,5 +1,5 @@ import { shallowMount } from '@vue/test-utils'; -import { GlButton } from '@gitlab/ui'; +import { GlDeprecatedButton } from '@gitlab/ui'; import { TEST_HOST } from 'spec/test_constants'; import UserAvatarList from '~/vue_shared/components/user_avatar/user_avatar_list.vue'; import UserAvatarLink from '~/vue_shared/components/user_avatar/user_avatar_link.vue'; @@ -37,7 +37,7 @@ describe('UserAvatarList', () => { }; const clickButton = () => { - const button = wrapper.find(GlButton); + const button = wrapper.find(GlDeprecatedButton); button.vm.$emit('click'); }; @@ -112,7 +112,7 @@ describe('UserAvatarList', () => { it('does not show button', () => { factory(); - expect(wrapper.find(GlButton).exists()).toBe(false); + expect(wrapper.find(GlDeprecatedButton).exists()).toBe(false); }); }); |