diff options
Diffstat (limited to 'spec/frontend/projects/settings_service_desk')
4 files changed, 111 insertions, 59 deletions
diff --git a/spec/frontend/projects/settings_service_desk/components/mock_data.js b/spec/frontend/projects/settings_service_desk/components/mock_data.js new file mode 100644 index 00000000000..934778ff601 --- /dev/null +++ b/spec/frontend/projects/settings_service_desk/components/mock_data.js @@ -0,0 +1,8 @@ +export const TEMPLATES = [ + 'Project #1', + [ + { name: 'Bug', project_id: 1 }, + { name: 'Documentation', project_id: 1 }, + { name: 'Security release', project_id: 1 }, + ], +]; diff --git a/spec/frontend/projects/settings_service_desk/components/service_desk_root_spec.js b/spec/frontend/projects/settings_service_desk/components/service_desk_root_spec.js index 8acf2376860..62224612387 100644 --- a/spec/frontend/projects/settings_service_desk/components/service_desk_root_spec.js +++ b/spec/frontend/projects/settings_service_desk/components/service_desk_root_spec.js @@ -21,6 +21,7 @@ describe('ServiceDeskRoot', () => { outgoingName: 'GitLab Support Bot', projectKey: 'key', selectedTemplate: 'Bug', + selectedFileTemplateProjectId: 42, templates: ['Bug', 'Documentation'], }; @@ -52,6 +53,7 @@ describe('ServiceDeskRoot', () => { initialOutgoingName: provideData.outgoingName, initialProjectKey: provideData.projectKey, initialSelectedTemplate: provideData.selectedTemplate, + initialSelectedFileTemplateProjectId: provideData.selectedFileTemplateProjectId, isEnabled: provideData.initialIsEnabled, isTemplateSaving: false, templates: provideData.templates, diff --git a/spec/frontend/projects/settings_service_desk/components/service_desk_setting_spec.js b/spec/frontend/projects/settings_service_desk/components/service_desk_setting_spec.js index eacf858f22c..0fd3e7446da 100644 --- a/spec/frontend/projects/settings_service_desk/components/service_desk_setting_spec.js +++ b/spec/frontend/projects/settings_service_desk/components/service_desk_setting_spec.js @@ -1,4 +1,4 @@ -import { GlButton, GlFormSelect, GlLoadingIcon, GlToggle } from '@gitlab/ui'; +import { GlButton, GlDropdown, GlLoadingIcon, GlToggle } from '@gitlab/ui'; import { shallowMount, mount } from '@vue/test-utils'; import { nextTick } from 'vue'; import { extendedWrapper } from 'helpers/vue_test_utils_helper'; @@ -13,7 +13,7 @@ describe('ServiceDeskSetting', () => { const findIncomingEmail = () => wrapper.findByTestId('incoming-email'); const findIncomingEmailLabel = () => wrapper.findByTestId('incoming-email-describer'); const findLoadingIcon = () => wrapper.find(GlLoadingIcon); - const findTemplateDropdown = () => wrapper.find(GlFormSelect); + const findTemplateDropdown = () => wrapper.find(GlDropdown); const findToggle = () => wrapper.find(GlToggle); const createComponent = ({ props = {}, mountFunction = shallowMount } = {}) => @@ -128,6 +128,23 @@ describe('ServiceDeskSetting', () => { expect(input.exists()).toBe(true); expect(input.attributes('disabled')).toBeUndefined(); }); + + it('shows error when value contains uppercase or special chars', async () => { + wrapper = createComponent({ + props: { customEmailEnabled: true }, + mountFunction: mount, + }); + + const input = wrapper.findByTestId('project-suffix'); + + input.setValue('abc_A.'); + input.trigger('blur'); + + await wrapper.vm.$nextTick(); + + const errorText = wrapper.find('.text-danger'); + expect(errorText.exists()).toBe(true); + }); }); describe('customEmail is the same as incomingEmail', () => { @@ -144,63 +161,6 @@ describe('ServiceDeskSetting', () => { }); }); }); - - describe('templates dropdown', () => { - it('renders a dropdown to choose a template', () => { - wrapper = createComponent(); - - expect(findTemplateDropdown().exists()).toBe(true); - }); - - it('renders a dropdown with a default value of ""', () => { - wrapper = createComponent({ mountFunction: mount }); - - expect(findTemplateDropdown().element.value).toEqual(''); - }); - - it('renders a dropdown with a value of "Bug" when it is the initial value', () => { - const templates = ['Bug', 'Documentation', 'Security release']; - - wrapper = createComponent({ - props: { initialSelectedTemplate: 'Bug', templates }, - mountFunction: mount, - }); - - expect(findTemplateDropdown().element.value).toEqual('Bug'); - }); - - it('renders a dropdown with no options when the project has no templates', () => { - wrapper = createComponent({ - props: { templates: [] }, - mountFunction: mount, - }); - - // The dropdown by default has one empty option - expect(findTemplateDropdown().element.children).toHaveLength(1); - }); - - it('renders a dropdown with options when the project has templates', () => { - const templates = ['Bug', 'Documentation', 'Security release']; - - wrapper = createComponent({ - props: { templates }, - mountFunction: mount, - }); - - // An empty-named template is prepended so the user can select no template - const expectedTemplates = [''].concat(templates); - - const dropdown = findTemplateDropdown(); - const dropdownList = Array.from(dropdown.element.children).map( - (option) => option.innerText, - ); - - expect(dropdown.element.children).toHaveLength(expectedTemplates.length); - expect(dropdownList.includes('Bug')).toEqual(true); - expect(dropdownList.includes('Documentation')).toEqual(true); - expect(dropdownList.includes('Security release')).toEqual(true); - }); - }); }); describe('save button', () => { @@ -214,6 +174,7 @@ describe('ServiceDeskSetting', () => { wrapper = createComponent({ props: { initialSelectedTemplate: 'Bug', + initialSelectedFileTemplateProjectId: 42, initialOutgoingName: 'GitLab Support Bot', initialProjectKey: 'key', }, @@ -225,6 +186,7 @@ describe('ServiceDeskSetting', () => { const payload = { selectedTemplate: 'Bug', + fileTemplateProjectId: 42, outgoingName: 'GitLab Support Bot', projectKey: 'key', }; diff --git a/spec/frontend/projects/settings_service_desk/components/service_desk_template_dropdown_spec.js b/spec/frontend/projects/settings_service_desk/components/service_desk_template_dropdown_spec.js new file mode 100644 index 00000000000..cdb355f5a9b --- /dev/null +++ b/spec/frontend/projects/settings_service_desk/components/service_desk_template_dropdown_spec.js @@ -0,0 +1,80 @@ +import { GlDropdown, GlDropdownSectionHeader, GlDropdownItem } from '@gitlab/ui'; +import { mount } from '@vue/test-utils'; +import { extendedWrapper } from 'helpers/vue_test_utils_helper'; +import ServiceDeskTemplateDropdown from '~/projects/settings_service_desk/components/service_desk_setting.vue'; +import { TEMPLATES } from './mock_data'; + +describe('ServiceDeskTemplateDropdown', () => { + let wrapper; + + const findTemplateDropdown = () => wrapper.find(GlDropdown); + + const createComponent = ({ props = {} } = {}) => + extendedWrapper( + mount(ServiceDeskTemplateDropdown, { + propsData: { + isEnabled: true, + ...props, + }, + }), + ); + + afterEach(() => { + if (wrapper) { + wrapper.destroy(); + } + }); + + describe('templates dropdown', () => { + it('renders a dropdown to choose a template', () => { + wrapper = createComponent(); + + expect(findTemplateDropdown().exists()).toBe(true); + }); + + it('renders a dropdown with a default value of "Choose a template"', () => { + wrapper = createComponent(); + + expect(findTemplateDropdown().props('text')).toEqual('Choose a template'); + }); + + it('renders a dropdown with a value of "Bug" when it is the initial value', () => { + const templates = TEMPLATES; + + wrapper = createComponent({ + props: { initialSelectedTemplate: 'Bug', initialSelectedTemplateProjectId: 1, templates }, + }); + + expect(findTemplateDropdown().props('text')).toEqual('Bug'); + }); + + it('renders a dropdown with header items', () => { + wrapper = createComponent({ + props: { templates: TEMPLATES }, + }); + + const headerItems = wrapper.findAll(GlDropdownSectionHeader); + + expect(headerItems).toHaveLength(1); + expect(headerItems.at(0).text()).toBe(TEMPLATES[0]); + }); + + it('renders a dropdown with options when the project has templates', () => { + const templates = TEMPLATES; + + wrapper = createComponent({ + props: { templates }, + }); + + const expectedTemplates = templates[1]; + + const items = wrapper.findAll(GlDropdownItem); + const dropdownList = expectedTemplates.map((_, index) => items.at(index).text()); + + expect(items).toHaveLength(expectedTemplates.length); + expect(dropdownList.includes('Bug')).toEqual(true); + expect(dropdownList.includes('Documentation')).toEqual(true); + expect(dropdownList.includes('Security release')).toEqual(true); + }); + }); +}); |