diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-06-14 21:08:38 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-06-14 21:08:38 +0300 |
commit | 14160fad80415337f8c08755af53ee994b4a7518 (patch) | |
tree | bfe1bf6bad8cda3e3bbf905c9d8ac742420dd8a3 /spec/frontend/vue_shared | |
parent | 7a33080fff9a735cbe77968d67b13ffa92c0ffae (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend/vue_shared')
-rw-r--r-- | spec/frontend/vue_shared/components/__snapshots__/clone_dropdown_spec.js.snap | 100 | ||||
-rw-r--r-- | spec/frontend/vue_shared/components/clone_dropdown/clone_dropdown_item_spec.js | 52 | ||||
-rw-r--r-- | spec/frontend/vue_shared/components/clone_dropdown/clone_dropdown_spec.js (renamed from spec/frontend/vue_shared/components/clone_dropdown_spec.js) | 32 |
3 files changed, 68 insertions, 116 deletions
diff --git a/spec/frontend/vue_shared/components/__snapshots__/clone_dropdown_spec.js.snap b/spec/frontend/vue_shared/components/__snapshots__/clone_dropdown_spec.js.snap deleted file mode 100644 index 0d0e45b64b2..00000000000 --- a/spec/frontend/vue_shared/components/__snapshots__/clone_dropdown_spec.js.snap +++ /dev/null @@ -1,100 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`Clone Dropdown Button rendering matches the snapshot 1`] = ` -<gl-disclosure-dropdown-stub - autoclose="true" - category="primary" - icon="" - items="" - placement="right" - positioningstrategy="absolute" - size="medium" - toggleid="dropdown-toggle-btn-2" - toggletext="Clone" - variant="confirm" -> - <gl-disclosure-dropdown-item-stub> - <gl-form-group-stub - class="gl-px-3 gl-my-3" - label="Clone with SSH" - labeldescription="" - optionaltext="(optional)" - > - <b-input-group-stub - readonly="" - tag="div" - > - <!----> - - <b-form-input-stub - class="gl-form-input" - debounce="0" - formatter="[Function]" - readonly="true" - type="text" - value="ssh://foo.bar" - /> - - <b-input-group-append-stub - tag="div" - > - <gl-button-stub - aria-label="Copy URL" - buttontextclasses="" - category="primary" - class="gl-display-inline-flex" - data-clipboard-text="ssh://foo.bar" - data-qa-selector="copy_ssh_url_button" - icon="copy-to-clipboard" - size="medium" - title="Copy URL" - variant="default" - /> - </b-input-group-append-stub> - </b-input-group-stub> - </gl-form-group-stub> - </gl-disclosure-dropdown-item-stub> - - <gl-disclosure-dropdown-item-stub> - <gl-form-group-stub - class="gl-px-3 gl-mb-3" - label="Clone with HTTP" - labeldescription="" - optionaltext="(optional)" - > - <b-input-group-stub - readonly="" - tag="div" - > - <!----> - - <b-form-input-stub - class="gl-form-input" - debounce="0" - formatter="[Function]" - readonly="true" - type="text" - value="http://foo.bar" - /> - - <b-input-group-append-stub - tag="div" - > - <gl-button-stub - aria-label="Copy URL" - buttontextclasses="" - category="primary" - class="gl-display-inline-flex" - data-clipboard-text="http://foo.bar" - data-qa-selector="copy_http_url_button" - icon="copy-to-clipboard" - size="medium" - title="Copy URL" - variant="default" - /> - </b-input-group-append-stub> - </b-input-group-stub> - </gl-form-group-stub> - </gl-disclosure-dropdown-item-stub> -</gl-disclosure-dropdown-stub> -`; diff --git a/spec/frontend/vue_shared/components/clone_dropdown/clone_dropdown_item_spec.js b/spec/frontend/vue_shared/components/clone_dropdown/clone_dropdown_item_spec.js new file mode 100644 index 00000000000..e0dfa084f3e --- /dev/null +++ b/spec/frontend/vue_shared/components/clone_dropdown/clone_dropdown_item_spec.js @@ -0,0 +1,52 @@ +import { GlButton, GlFormGroup, GlFormInputGroup } from '@gitlab/ui'; +import { shallowMount } from '@vue/test-utils'; +import CloneDropdownItem from '~/vue_shared/components/clone_dropdown/clone_dropdown_item.vue'; + +describe('Clone Dropdown Button', () => { + let wrapper; + const link = 'ssh://foo.bar'; + const label = 'SSH'; + const qaSelector = 'some-selector'; + const defaultPropsData = { + link, + label, + qaSelector, + }; + + const findCopyButton = () => wrapper.findComponent(GlButton); + + const createComponent = (propsData = defaultPropsData) => { + wrapper = shallowMount(CloneDropdownItem, { + propsData, + stubs: { + GlFormInputGroup, + }, + }); + }; + + beforeEach(() => { + createComponent(); + }); + + describe('default', () => { + it('sets form group label', () => { + expect(wrapper.findComponent(GlFormGroup).attributes('label')).toBe(label); + }); + + it('sets form input group link', () => { + expect(wrapper.findComponent(GlFormInputGroup).props('value')).toBe(link); + }); + + it('sets the copy tooltip text', () => { + expect(findCopyButton().attributes('title')).toBe('Copy URL'); + }); + + it('sets the copy tooltip link', () => { + expect(findCopyButton().attributes('data-clipboard-text')).toBe(link); + }); + + it('sets the qa selector', () => { + expect(findCopyButton().attributes('data-qa-selector')).toBe(qaSelector); + }); + }); +}); diff --git a/spec/frontend/vue_shared/components/clone_dropdown_spec.js b/spec/frontend/vue_shared/components/clone_dropdown/clone_dropdown_spec.js index bcc1a4352d8..48c158d6fa2 100644 --- a/spec/frontend/vue_shared/components/clone_dropdown_spec.js +++ b/spec/frontend/vue_shared/components/clone_dropdown/clone_dropdown_spec.js @@ -1,6 +1,7 @@ -import { GlFormGroup, GlFormInputGroup } from '@gitlab/ui'; +import { GlFormInputGroup } from '@gitlab/ui'; import { shallowMount } from '@vue/test-utils'; -import CloneDropdown from '~/vue_shared/components/clone_dropdown.vue'; +import CloneDropdown from '~/vue_shared/components/clone_dropdown/clone_dropdown.vue'; +import CloneDropdownItem from '~/vue_shared/components/clone_dropdown/clone_dropdown_item.vue'; describe('Clone Dropdown Button', () => { let wrapper; @@ -12,30 +13,28 @@ describe('Clone Dropdown Button', () => { httpLink, }; + const findCloneDropdownItems = () => wrapper.findAllComponents(CloneDropdownItem); + const findCloneDropdownItemAtIndex = (index) => findCloneDropdownItems().at(index); + const createComponent = (propsData = defaultPropsData) => { wrapper = shallowMount(CloneDropdown, { propsData, stubs: { - 'gl-form-input-group': GlFormInputGroup, + GlFormInputGroup, }, }); }; describe('rendering', () => { - it('matches the snapshot', () => { - createComponent(); - expect(wrapper.element).toMatchSnapshot(); - }); - it.each` - name | index | value + name | index | link ${'SSH'} | ${0} | ${sshLink} ${'HTTP'} | ${1} | ${httpLink} - `('renders correct link and a copy-button for $name', ({ index, value }) => { + `('renders correct link and a copy-button for $name', ({ index, link }) => { createComponent(); - const group = wrapper.findAllComponents(GlFormInputGroup).at(index); - expect(group.props('value')).toBe(value); - expect(group.findComponent(GlFormInputGroup).exists()).toBe(true); + + const group = findCloneDropdownItemAtIndex(index); + expect(group.props('link')).toBe(link); }); it.each` @@ -45,7 +44,7 @@ describe('Clone Dropdown Button', () => { `('does not fail if only $name is set', ({ name, value }) => { createComponent({ [name]: value }); - expect(wrapper.findComponent(GlFormInputGroup).props('value')).toBe(value); + expect(findCloneDropdownItemAtIndex(0).props('link')).toBe(value); }); }); @@ -57,12 +56,13 @@ describe('Clone Dropdown Button', () => { `('allows null values for the props', ({ name, value }) => { createComponent({ ...defaultPropsData, [name]: value }); - expect(wrapper.findAllComponents(GlFormGroup).length).toBe(1); + expect(findCloneDropdownItems().length).toBe(1); }); it('correctly calculates httpLabel for HTTPS protocol', () => { createComponent({ httpLink: httpsLink }); - expect(wrapper.findComponent(GlFormGroup).attributes('label')).toContain('HTTPS'); + + expect(findCloneDropdownItemAtIndex(0).attributes('label')).toContain('HTTPS'); }); }); }); |