diff options
Diffstat (limited to 'spec/frontend/alerts_settings/components')
4 files changed, 180 insertions, 2 deletions
diff --git a/spec/frontend/alerts_settings/components/__snapshots__/alerts_form_spec.js.snap b/spec/frontend/alerts_settings/components/__snapshots__/alerts_form_spec.js.snap new file mode 100644 index 00000000000..3a374084dbc --- /dev/null +++ b/spec/frontend/alerts_settings/components/__snapshots__/alerts_form_spec.js.snap @@ -0,0 +1,119 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Alert integration settings form default state should match the default snapshot 1`] = ` +<div> + <p> + <gl-sprintf-stub + message="Action to take when receiving an alert. %{docsLink}" + /> + </p> + + <form> + <gl-form-group-stub + class="gl-pl-0" + labeldescription="" + > + <gl-form-checkbox-stub + checked="true" + data-qa-selector="create_issue_checkbox" + > + <span> + Create an incident. Incidents are created for each alert triggered. + </span> + </gl-form-checkbox-stub> + </gl-form-group-stub> + + <gl-form-group-stub + class="col-8 col-md-9 gl-px-6" + label-for="alert-integration-settings-issue-template" + label-size="sm" + labeldescription="" + > + <label + class="gl-display-inline-flex" + for="alert-integration-settings-issue-template" + > + + Incident template (optional). + + <gl-link-stub + href="/help/user/project/description_templates#create-an-issue-template" + target="_blank" + > + <span + class="gl-font-weight-normal gl-pl-2" + > + Learn more. + </span> + </gl-link-stub> + </label> + + <gl-dropdown-stub + block="true" + category="primary" + data-qa-selector="incident_templates_dropdown" + headertext="" + hideheaderborder="true" + id="alert-integration-settings-issue-template" + size="medium" + text="selecte_tmpl" + variant="default" + > + <gl-dropdown-item-stub + avatarurl="" + data-qa-selector="incident_templates_item" + iconcolor="" + iconname="" + iconrightarialabel="" + iconrightname="" + ischeckitem="true" + secondarytext="" + > + + No template selected + + </gl-dropdown-item-stub> + </gl-dropdown-stub> + </gl-form-group-stub> + + <gl-form-group-stub + class="gl-pl-0 gl-mb-5" + labeldescription="" + > + <gl-form-checkbox-stub> + <span> + Send a single email notification to Owners and Maintainers for new alerts. + </span> + </gl-form-checkbox-stub> + </gl-form-group-stub> + + <gl-form-group-stub + class="gl-pl-0 gl-mb-5" + labeldescription="" + > + <gl-form-checkbox-stub + checked="true" + > + <span> + Automatically close associated incident when a recovery alert notification resolves an alert + </span> + </gl-form-checkbox-stub> + </gl-form-group-stub> + + <gl-button-stub + buttontextclasses="" + category="primary" + class="js-no-auto-disable" + data-qa-selector="save_changes_button" + icon="" + size="medium" + type="submit" + variant="confirm" + > + + Save changes + + </gl-button-stub> + </form> +</div> +`; diff --git a/spec/frontend/alerts_settings/components/alerts_form_spec.js b/spec/frontend/alerts_settings/components/alerts_form_spec.js new file mode 100644 index 00000000000..a045954dfb8 --- /dev/null +++ b/spec/frontend/alerts_settings/components/alerts_form_spec.js @@ -0,0 +1,50 @@ +import { shallowMount } from '@vue/test-utils'; +import AlertsSettingsForm from '~/alerts_settings/components/alerts_form.vue'; + +describe('Alert integration settings form', () => { + let wrapper; + const service = { updateSettings: jest.fn().mockResolvedValue() }; + + const findForm = () => wrapper.find({ ref: 'settingsForm' }); + + beforeEach(() => { + wrapper = shallowMount(AlertsSettingsForm, { + provide: { + service, + alertSettings: { + issueTemplateKey: 'selecte_tmpl', + createIssue: true, + sendEmail: false, + templates: [], + autoCloseIncident: true, + }, + }, + }); + }); + + afterEach(() => { + if (wrapper) { + wrapper.destroy(); + } + }); + + describe('default state', () => { + it('should match the default snapshot', () => { + expect(wrapper.element).toMatchSnapshot(); + }); + }); + + describe('form', () => { + it('should call service `updateSettings` on submit', () => { + findForm().trigger('submit'); + expect(service.updateSettings).toHaveBeenCalledWith( + expect.objectContaining({ + create_issue: wrapper.vm.createIssueEnabled, + issue_template_key: wrapper.vm.issueTemplate, + send_email: wrapper.vm.sendEmailEnabled, + auto_close_incident: wrapper.vm.autoCloseIncident, + }), + ); + }); + }); +}); diff --git a/spec/frontend/alerts_settings/components/alerts_integrations_list_spec.js b/spec/frontend/alerts_settings/components/alerts_integrations_list_spec.js index c43d78a1cf3..3ffbb7ab60a 100644 --- a/spec/frontend/alerts_settings/components/alerts_integrations_list_spec.js +++ b/spec/frontend/alerts_settings/components/alerts_integrations_list_spec.js @@ -80,7 +80,7 @@ describe('AlertIntegrationsList', () => { const cell = finsStatusCell().at(0); const activatedIcon = cell.find(GlIcon); expect(cell.text()).toBe(i18n.status.enabled.name); - expect(activatedIcon.attributes('name')).toBe('check-circle-filled'); + expect(activatedIcon.attributes('name')).toBe('check'); expect(activatedIcon.attributes('title')).toBe(i18n.status.enabled.tooltip); }); diff --git a/spec/frontend/alerts_settings/components/alerts_settings_wrapper_spec.js b/spec/frontend/alerts_settings/components/alerts_settings_wrapper_spec.js index 595c3f1a289..1c4dde39585 100644 --- a/spec/frontend/alerts_settings/components/alerts_settings_wrapper_spec.js +++ b/spec/frontend/alerts_settings/components/alerts_settings_wrapper_spec.js @@ -95,6 +95,10 @@ describe('AlertsSettingsWrapper', () => { }, provide: { ...provide, + alertSettings: { + templates: [], + }, + service: {}, }, mocks: { $apollo: { @@ -129,12 +133,17 @@ describe('AlertsSettingsWrapper', () => { wrapper = mount(AlertsSettingsWrapper, { localVue, apolloProvider: fakeApollo, + provide: { + alertSettings: { + templates: [], + }, + service: {}, + }, }); } afterEach(() => { wrapper.destroy(); - wrapper = null; }); describe('template', () => { |