diff options
Diffstat (limited to 'spec/frontend/monitoring/components')
10 files changed, 10 insertions, 394 deletions
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 47b6c463377..aaa0a91ffe0 100644 --- a/spec/frontend/monitoring/components/__snapshots__/dashboard_template_spec.js.snap +++ b/spec/frontend/monitoring/components/__snapshots__/dashboard_template_spec.js.snap @@ -8,8 +8,6 @@ exports[`Dashboard template matches the default snapshot 1`] = ` metricsdashboardbasepath="/monitoring/monitor-project/-/environments/1/metrics" metricsendpoint="/monitoring/monitor-project/-/environments/1/additional_metrics.json" > - <alerts-deprecation-warning-stub /> - <div class="prometheus-graphs-header d-sm-flex flex-sm-wrap pt-2 pr-1 pb-0 pl-2 border-bottom bg-gray-light" > diff --git a/spec/frontend/monitoring/components/alert_widget_form_spec.js b/spec/frontend/monitoring/components/alert_widget_form_spec.js deleted file mode 100644 index e0ef1040f6b..00000000000 --- a/spec/frontend/monitoring/components/alert_widget_form_spec.js +++ /dev/null @@ -1,242 +0,0 @@ -import { GlLink } from '@gitlab/ui'; -import { shallowMount } from '@vue/test-utils'; -import INVALID_URL from '~/lib/utils/invalid_url'; -import AlertWidgetForm from '~/monitoring/components/alert_widget_form.vue'; -import ModalStub from '../stubs/modal_stub'; - -describe('AlertWidgetForm', () => { - let wrapper; - - const metricId = '8'; - const alertPath = 'alert'; - const relevantQueries = [{ metricId, alert_path: alertPath, label: 'alert-label' }]; - const dataTrackingOptions = { - create: { action: 'click_button', label: 'create_alert' }, - delete: { action: 'click_button', label: 'delete_alert' }, - update: { action: 'click_button', label: 'update_alert' }, - }; - - const defaultProps = { - disabled: false, - relevantQueries, - modalId: 'alert-modal-1', - }; - - const propsWithAlertData = { - ...defaultProps, - alertsToManage: { - alert: { - alert_path: alertPath, - operator: '<', - threshold: 5, - metricId, - runbookUrl: INVALID_URL, - }, - }, - configuredAlert: metricId, - }; - - function createComponent(props = {}) { - const propsData = { - ...defaultProps, - ...props, - }; - - wrapper = shallowMount(AlertWidgetForm, { - propsData, - stubs: { - GlModal: ModalStub, - }, - }); - } - - const modal = () => wrapper.find(ModalStub); - const modalTitle = () => modal().attributes('title'); - const submitButton = () => modal().find(GlLink); - const findRunbookField = () => modal().find('[data-testid="alertRunbookField"]'); - const findThresholdField = () => modal().find('[data-qa-selector="alert_threshold_field"]'); - const submitButtonTrackingOpts = () => - JSON.parse(submitButton().attributes('data-tracking-options')); - const stubEvent = { preventDefault: jest.fn() }; - - afterEach(() => { - if (wrapper) wrapper.destroy(); - }); - - it('disables the form when disabled prop is set', () => { - createComponent({ disabled: true }); - - expect(modal().attributes('ok-disabled')).toBe('true'); - }); - - it('disables the form if no query is selected', () => { - createComponent(); - - expect(modal().attributes('ok-disabled')).toBe('true'); - }); - - it('shows correct title and button text', () => { - createComponent(); - - expect(modalTitle()).toBe('Add alert'); - expect(submitButton().text()).toBe('Add'); - }); - - it('sets tracking options for create alert', () => { - createComponent(); - - expect(submitButtonTrackingOpts()).toEqual(dataTrackingOptions.create); - }); - - it('emits a "create" event when form submitted without existing alert', async () => { - createComponent(defaultProps); - - modal().vm.$emit('shown'); - - findThresholdField().vm.$emit('input', 900); - findRunbookField().vm.$emit('input', INVALID_URL); - - modal().vm.$emit('ok', stubEvent); - - expect(wrapper.emitted().create[0]).toEqual([ - { - alert: undefined, - operator: '>', - threshold: 900, - prometheus_metric_id: '8', - runbookUrl: INVALID_URL, - }, - ]); - }); - - it('resets form when modal is dismissed (hidden)', () => { - createComponent(defaultProps); - - modal().vm.$emit('shown'); - - findThresholdField().vm.$emit('input', 800); - findRunbookField().vm.$emit('input', INVALID_URL); - - modal().vm.$emit('hidden'); - - expect(wrapper.vm.selectedAlert).toEqual({}); - expect(wrapper.vm.operator).toBe(null); - expect(wrapper.vm.threshold).toBe(null); - expect(wrapper.vm.prometheusMetricId).toBe(null); - expect(wrapper.vm.runbookUrl).toBe(null); - }); - - it('sets selectedAlert to the provided configuredAlert on modal show', () => { - createComponent(propsWithAlertData); - - modal().vm.$emit('shown'); - - expect(wrapper.vm.selectedAlert).toEqual(propsWithAlertData.alertsToManage[alertPath]); - }); - - it('sets selectedAlert to the first relevantQueries if there is only one option on modal show', () => { - createComponent({ - ...propsWithAlertData, - configuredAlert: '', - }); - - modal().vm.$emit('shown'); - - expect(wrapper.vm.selectedAlert).toEqual(propsWithAlertData.alertsToManage[alertPath]); - }); - - it('does not set selectedAlert to the first relevantQueries if there is more than one option on modal show', () => { - createComponent({ - relevantQueries: [ - { - metricId: '8', - alertPath: 'alert', - label: 'alert-label', - }, - { - metricId: '9', - alertPath: 'alert', - label: 'alert-label', - }, - ], - }); - - modal().vm.$emit('shown'); - - expect(wrapper.vm.selectedAlert).toEqual({}); - }); - - describe('with existing alert', () => { - beforeEach(() => { - createComponent(propsWithAlertData); - - modal().vm.$emit('shown'); - }); - - it('sets tracking options for delete alert', () => { - expect(submitButtonTrackingOpts()).toEqual(dataTrackingOptions.delete); - }); - - it('updates button text', () => { - expect(modalTitle()).toBe('Edit alert'); - expect(submitButton().text()).toBe('Delete'); - }); - - it('emits "delete" event when form values unchanged', () => { - modal().vm.$emit('ok', stubEvent); - - expect(wrapper.emitted().delete[0]).toEqual([ - { - alert: 'alert', - operator: '<', - threshold: 5, - prometheus_metric_id: '8', - runbookUrl: INVALID_URL, - }, - ]); - }); - }); - - it('emits "update" event when form changed', () => { - const updatedRunbookUrl = `${INVALID_URL}/test`; - - createComponent(propsWithAlertData); - - modal().vm.$emit('shown'); - - findRunbookField().vm.$emit('input', updatedRunbookUrl); - findThresholdField().vm.$emit('input', 11); - - modal().vm.$emit('ok', stubEvent); - - expect(wrapper.emitted().update[0]).toEqual([ - { - alert: 'alert', - operator: '<', - threshold: 11, - prometheus_metric_id: '8', - runbookUrl: updatedRunbookUrl, - }, - ]); - }); - - it('sets tracking options for update alert', async () => { - createComponent(propsWithAlertData); - - modal().vm.$emit('shown'); - - findThresholdField().vm.$emit('input', 11); - - await wrapper.vm.$nextTick(); - - expect(submitButtonTrackingOpts()).toEqual(dataTrackingOptions.update); - }); - - describe('alert runbooks', () => { - it('shows the runbook field', () => { - createComponent(); - - expect(findRunbookField().exists()).toBe(true); - }); - }); -}); diff --git a/spec/frontend/monitoring/components/charts/anomaly_spec.js b/spec/frontend/monitoring/components/charts/anomaly_spec.js index c44fd8dce33..8dc6132709e 100644 --- a/spec/frontend/monitoring/components/charts/anomaly_spec.js +++ b/spec/frontend/monitoring/components/charts/anomaly_spec.js @@ -159,10 +159,6 @@ describe('Anomaly chart component', () => { const { deploymentData } = getTimeSeriesProps(); expect(deploymentData).toEqual(anomalyDeploymentData); }); - it('"thresholds" keeps the same value', () => { - const { thresholds } = getTimeSeriesProps(); - expect(thresholds).toEqual(inputThresholds); - }); it('"projectPath" keeps the same value', () => { const { projectPath } = getTimeSeriesProps(); expect(projectPath).toEqual(mockProjectPath); diff --git a/spec/frontend/monitoring/components/charts/time_series_spec.js b/spec/frontend/monitoring/components/charts/time_series_spec.js index ea6e4f4a5ed..27f7489aa49 100644 --- a/spec/frontend/monitoring/components/charts/time_series_spec.js +++ b/spec/frontend/monitoring/components/charts/time_series_spec.js @@ -643,7 +643,6 @@ describe('Time series component', () => { expect(props.data).toBe(wrapper.vm.chartData); expect(props.option).toBe(wrapper.vm.chartOptions); expect(props.formatTooltipText).toBe(wrapper.vm.formatTooltipText); - expect(props.thresholds).toBe(wrapper.vm.thresholds); }); it('receives a tooltip title', () => { diff --git a/spec/frontend/monitoring/components/dashboard_panel_builder_spec.js b/spec/frontend/monitoring/components/dashboard_panel_builder_spec.js index 8af6075a416..400ac2e8f85 100644 --- a/spec/frontend/monitoring/components/dashboard_panel_builder_spec.js +++ b/spec/frontend/monitoring/components/dashboard_panel_builder_spec.js @@ -28,7 +28,6 @@ describe('dashboard invalid url parameters', () => { }, }, options, - provide: { hasManagedPrometheus: false }, }); }; diff --git a/spec/frontend/monitoring/components/dashboard_panel_spec.js b/spec/frontend/monitoring/components/dashboard_panel_spec.js index c8951dff9ed..9a73dc820af 100644 --- a/spec/frontend/monitoring/components/dashboard_panel_spec.js +++ b/spec/frontend/monitoring/components/dashboard_panel_spec.js @@ -5,7 +5,6 @@ import Vuex from 'vuex'; import { setTestTimeout } from 'helpers/timeout'; import axios from '~/lib/utils/axios_utils'; import invalidUrl from '~/lib/utils/invalid_url'; -import AlertWidget from '~/monitoring/components/alert_widget.vue'; import MonitorAnomalyChart from '~/monitoring/components/charts/anomaly.vue'; import MonitorBarChart from '~/monitoring/components/charts/bar.vue'; @@ -28,7 +27,6 @@ import { barGraphData, } from '../graph_data'; import { - mockAlert, mockLogsHref, mockLogsPath, mockNamespace, @@ -56,7 +54,6 @@ describe('Dashboard Panel', () => { const findCtxMenu = () => wrapper.find({ ref: 'contextualMenu' }); const findMenuItems = () => wrapper.findAll(GlDropdownItem); const findMenuItemByText = (text) => findMenuItems().filter((i) => i.text() === text); - const findAlertsWidget = () => wrapper.find(AlertWidget); const createWrapper = (props, { mountFn = shallowMount, ...options } = {}) => { wrapper = mountFn(DashboardPanel, { @@ -80,9 +77,6 @@ describe('Dashboard Panel', () => { }); }; - const setMetricsSavedToDb = (val) => - monitoringDashboard.getters.metricsSavedToDb.mockReturnValue(val); - beforeEach(() => { setTestTimeout(1000); @@ -601,42 +595,6 @@ describe('Dashboard Panel', () => { }); }); - describe('panel alerts', () => { - beforeEach(() => { - mockGetterReturnValue('metricsSavedToDb', []); - - createWrapper(); - }); - - describe.each` - desc | metricsSavedToDb | props | isShown - ${'with permission and no metrics in db'} | ${[]} | ${{}} | ${false} - ${'with permission and related metrics in db'} | ${[graphData.metrics[0].metricId]} | ${{}} | ${true} - ${'without permission and related metrics in db'} | ${[graphData.metrics[0].metricId]} | ${{ prometheusAlertsAvailable: false }} | ${false} - ${'with permission and unrelated metrics in db'} | ${['another_metric_id']} | ${{}} | ${false} - `('$desc', ({ metricsSavedToDb, isShown, props }) => { - const showsDesc = isShown ? 'shows' : 'does not show'; - - beforeEach(() => { - setMetricsSavedToDb(metricsSavedToDb); - createWrapper({ - alertsEndpoint: '/endpoint', - prometheusAlertsAvailable: true, - ...props, - }); - return wrapper.vm.$nextTick(); - }); - - it(`${showsDesc} alert widget`, () => { - expect(findAlertsWidget().exists()).toBe(isShown); - }); - - it(`${showsDesc} alert configuration`, () => { - expect(findMenuItemByText('Alerts').exists()).toBe(isShown); - }); - }); - }); - describe('When graphData contains links', () => { const findManageLinksItem = () => wrapper.find({ ref: 'manageLinksItem' }); const mockLinks = [ @@ -730,13 +688,6 @@ describe('Dashboard Panel', () => { describe('Runbook url', () => { const findRunbookLinks = () => wrapper.findAll('[data-testid="runbookLink"]'); - const { metricId } = graphData.metrics[0]; - const { alert_path: alertPath } = mockAlert; - - const mockRunbookAlert = { - ...mockAlert, - metricId, - }; beforeEach(() => { mockGetterReturnValue('metricsSavedToDb', []); @@ -747,62 +698,5 @@ describe('Dashboard Panel', () => { expect(findRunbookLinks().length).toBe(0); }); - - describe('when alerts are present', () => { - beforeEach(() => { - setMetricsSavedToDb([metricId]); - - createWrapper({ - alertsEndpoint: '/endpoint', - prometheusAlertsAvailable: true, - }); - }); - - it('does not show a runbook link when a runbook is not set', async () => { - findAlertsWidget().vm.$emit('setAlerts', alertPath, { - ...mockRunbookAlert, - runbookUrl: '', - }); - - await wrapper.vm.$nextTick(); - - expect(findRunbookLinks().length).toBe(0); - }); - - it('shows a runbook link when a runbook is set', async () => { - findAlertsWidget().vm.$emit('setAlerts', alertPath, mockRunbookAlert); - - await wrapper.vm.$nextTick(); - - expect(findRunbookLinks().length).toBe(1); - expect(findRunbookLinks().at(0).attributes('href')).toBe(invalidUrl); - }); - }); - - describe('managed alert deprecation feature flag', () => { - beforeEach(() => { - setMetricsSavedToDb([metricId]); - }); - - it('shows alerts when alerts are not deprecated', () => { - createWrapper( - { alertsEndpoint: '/endpoint', prometheusAlertsAvailable: true }, - { provide: { glFeatures: { managedAlertsDeprecation: false } } }, - ); - - expect(findAlertsWidget().exists()).toBe(true); - expect(findMenuItemByText('Alerts').exists()).toBe(true); - }); - - it('hides alerts when alerts are deprecated', () => { - createWrapper( - { alertsEndpoint: '/endpoint', prometheusAlertsAvailable: true }, - { provide: { glFeatures: { managedAlertsDeprecation: true } } }, - ); - - expect(findAlertsWidget().exists()).toBe(false); - expect(findMenuItemByText('Alerts').exists()).toBe(false); - }); - }); }); }); diff --git a/spec/frontend/monitoring/components/dashboard_spec.js b/spec/frontend/monitoring/components/dashboard_spec.js index f899580b3df..9331048bce3 100644 --- a/spec/frontend/monitoring/components/dashboard_spec.js +++ b/spec/frontend/monitoring/components/dashboard_spec.js @@ -46,7 +46,6 @@ describe('Dashboard', () => { stubs: { DashboardHeader, }, - provide: { hasManagedPrometheus: false }, ...options, }); }; @@ -60,9 +59,6 @@ describe('Dashboard', () => { 'dashboard-panel': true, 'dashboard-header': DashboardHeader, }, - provide: { - hasManagedPrometheus: false, - }, ...options, }); }; @@ -412,7 +408,7 @@ describe('Dashboard', () => { }); }); - describe('when all requests have been commited by the store', () => { + describe('when all requests have been committed by the store', () => { beforeEach(() => { store.commit(`monitoringDashboard/${types.SET_INITIAL_STATE}`, { currentEnvironmentName: 'production', @@ -460,7 +456,7 @@ describe('Dashboard', () => { it('shows the links section', () => { expect(wrapper.vm.shouldShowLinksSection).toBe(true); - expect(wrapper.find(LinksSection)).toExist(); + expect(wrapper.findComponent(LinksSection).exists()).toBe(true); }); }); @@ -807,29 +803,4 @@ describe('Dashboard', () => { expect(dashboardPanel.exists()).toBe(true); }); }); - - describe('alerts deprecation', () => { - beforeEach(() => { - setupStoreWithData(store); - }); - - const findDeprecationNotice = () => wrapper.findByTestId('alerts-deprecation-warning'); - - it.each` - managedAlertsDeprecation | hasManagedPrometheus | isVisible - ${false} | ${false} | ${false} - ${false} | ${true} | ${true} - ${true} | ${false} | ${false} - ${true} | ${true} | ${false} - `( - 'when the deprecation feature flag is $managedAlertsDeprecation and has managed prometheus is $hasManagedPrometheus', - ({ hasManagedPrometheus, managedAlertsDeprecation, isVisible }) => { - createMountedWrapper( - {}, - { provide: { hasManagedPrometheus, glFeatures: { managedAlertsDeprecation } } }, - ); - expect(findDeprecationNotice().exists()).toBe(isVisible); - }, - ); - }); }); diff --git a/spec/frontend/monitoring/components/dashboard_url_time_spec.js b/spec/frontend/monitoring/components/dashboard_url_time_spec.js index bea263f143a..e6785f34597 100644 --- a/spec/frontend/monitoring/components/dashboard_url_time_spec.js +++ b/spec/frontend/monitoring/components/dashboard_url_time_spec.js @@ -31,7 +31,6 @@ describe('dashboard invalid url parameters', () => { store, stubs: { 'graph-group': true, 'dashboard-panel': true, 'dashboard-header': DashboardHeader }, ...options, - provide: { hasManagedPrometheus: false }, }); }; diff --git a/spec/frontend/monitoring/components/links_section_spec.js b/spec/frontend/monitoring/components/links_section_spec.js index 8fc287c50e4..e37abf6722a 100644 --- a/spec/frontend/monitoring/components/links_section_spec.js +++ b/spec/frontend/monitoring/components/links_section_spec.js @@ -1,5 +1,7 @@ import { GlLink } from '@gitlab/ui'; import { shallowMount } from '@vue/test-utils'; +import { nextTick } from 'vue'; + import LinksSection from '~/monitoring/components/links_section.vue'; import { createStore } from '~/monitoring/stores'; @@ -26,12 +28,12 @@ describe('Links Section component', () => { createShallowWrapper(); }); - it('does not render a section if no links are present', () => { + it('does not render a section if no links are present', async () => { setState(); - return wrapper.vm.$nextTick(() => { - expect(findLinks()).not.toExist(); - }); + await nextTick(); + + expect(findLinks().length).toBe(0); }); it('renders a link inside a section', () => { diff --git a/spec/frontend/monitoring/components/variables/text_field_spec.js b/spec/frontend/monitoring/components/variables/text_field_spec.js index 28e02dff4bf..c879803fddd 100644 --- a/spec/frontend/monitoring/components/variables/text_field_spec.js +++ b/spec/frontend/monitoring/components/variables/text_field_spec.js @@ -15,12 +15,12 @@ describe('Text variable component', () => { }); }; - const findInput = () => wrapper.find(GlFormInput); + const findInput = () => wrapper.findComponent(GlFormInput); it('renders a text input when all props are passed', () => { createShallowWrapper(); - expect(findInput()).toExist(); + expect(findInput().exists()).toBe(true); }); it('always has a default value', () => { |