diff options
Diffstat (limited to 'spec/frontend/monitoring/components/variables')
-rw-r--r-- | spec/frontend/monitoring/components/variables/dropdown_field_spec.js (renamed from spec/frontend/monitoring/components/variables/custom_variable_spec.js) | 33 | ||||
-rw-r--r-- | spec/frontend/monitoring/components/variables/text_field_spec.js (renamed from spec/frontend/monitoring/components/variables/text_variable_spec.js) | 8 |
2 files changed, 27 insertions, 14 deletions
diff --git a/spec/frontend/monitoring/components/variables/custom_variable_spec.js b/spec/frontend/monitoring/components/variables/dropdown_field_spec.js index 5a2b26219b6..cc384aef231 100644 --- a/spec/frontend/monitoring/components/variables/custom_variable_spec.js +++ b/spec/frontend/monitoring/components/variables/dropdown_field_spec.js @@ -1,18 +1,25 @@ import { shallowMount } from '@vue/test-utils'; import { GlDropdown, GlDropdownItem } from '@gitlab/ui'; -import CustomVariable from '~/monitoring/components/variables/custom_variable.vue'; +import DropdownField from '~/monitoring/components/variables/dropdown_field.vue'; describe('Custom variable component', () => { let wrapper; - const propsData = { + + const defaultProps = { name: 'env', label: 'Select environment', value: 'Production', - options: [{ text: 'Production', value: 'prod' }, { text: 'Canary', value: 'canary' }], + options: { + values: [{ text: 'Production', value: 'prod' }, { text: 'Canary', value: 'canary' }], + }, }; - const createShallowWrapper = () => { - wrapper = shallowMount(CustomVariable, { - propsData, + + const createShallowWrapper = props => { + wrapper = shallowMount(DropdownField, { + propsData: { + ...defaultProps, + ...props, + }, }); }; @@ -22,19 +29,25 @@ describe('Custom variable component', () => { it('renders dropdown element when all necessary props are passed', () => { createShallowWrapper(); - expect(findDropdown()).toExist(); + expect(findDropdown().exists()).toBe(true); }); it('renders dropdown element with a text', () => { createShallowWrapper(); - expect(findDropdown().attributes('text')).toBe(propsData.value); + expect(findDropdown().attributes('text')).toBe(defaultProps.value); }); it('renders all the dropdown items', () => { createShallowWrapper(); - expect(findDropdownItems()).toHaveLength(propsData.options.length); + expect(findDropdownItems()).toHaveLength(defaultProps.options.values.length); + }); + + it('renders dropdown when values are missing', () => { + createShallowWrapper({ options: {} }); + + expect(findDropdown().exists()).toBe(true); }); it('changing dropdown items triggers update', () => { @@ -46,7 +59,7 @@ describe('Custom variable component', () => { .vm.$emit('click'); return wrapper.vm.$nextTick(() => { - expect(wrapper.vm.$emit).toHaveBeenCalledWith('onUpdate', 'env', 'canary'); + expect(wrapper.vm.$emit).toHaveBeenCalledWith('input', 'canary'); }); }); }); diff --git a/spec/frontend/monitoring/components/variables/text_variable_spec.js b/spec/frontend/monitoring/components/variables/text_field_spec.js index f01584ae8bc..99c6facac38 100644 --- a/spec/frontend/monitoring/components/variables/text_variable_spec.js +++ b/spec/frontend/monitoring/components/variables/text_field_spec.js @@ -1,6 +1,6 @@ import { shallowMount } from '@vue/test-utils'; import { GlFormInput } from '@gitlab/ui'; -import TextVariable from '~/monitoring/components/variables/text_variable.vue'; +import TextField from '~/monitoring/components/variables/text_field.vue'; describe('Text variable component', () => { let wrapper; @@ -10,7 +10,7 @@ describe('Text variable component', () => { value: 'test-pod', }; const createShallowWrapper = () => { - wrapper = shallowMount(TextVariable, { + wrapper = shallowMount(TextField, { propsData, }); }; @@ -40,7 +40,7 @@ describe('Text variable component', () => { findInput().trigger('keyup.enter'); return wrapper.vm.$nextTick(() => { - expect(wrapper.vm.$emit).toHaveBeenCalledWith('onUpdate', 'pod', 'prod-pod'); + expect(wrapper.vm.$emit).toHaveBeenCalledWith('input', 'prod-pod'); }); }); @@ -53,7 +53,7 @@ describe('Text variable component', () => { findInput().trigger('blur'); return wrapper.vm.$nextTick(() => { - expect(wrapper.vm.$emit).toHaveBeenCalledWith('onUpdate', 'pod', 'canary-pod'); + expect(wrapper.vm.$emit).toHaveBeenCalledWith('input', 'canary-pod'); }); }); }); |