diff options
Diffstat (limited to 'spec/frontend/pages/projects/forks/new/components/project_namespace_spec.js')
-rw-r--r-- | spec/frontend/pages/projects/forks/new/components/project_namespace_spec.js | 42 |
1 files changed, 14 insertions, 28 deletions
diff --git a/spec/frontend/pages/projects/forks/new/components/project_namespace_spec.js b/spec/frontend/pages/projects/forks/new/components/project_namespace_spec.js index f6d3957115f..82f451ed6ef 100644 --- a/spec/frontend/pages/projects/forks/new/components/project_namespace_spec.js +++ b/spec/frontend/pages/projects/forks/new/components/project_namespace_spec.js @@ -1,11 +1,4 @@ -import { - GlButton, - GlDropdown, - GlDropdownItem, - GlDropdownSectionHeader, - GlSearchBoxByType, - GlTruncate, -} from '@gitlab/ui'; +import { GlButton, GlListboxItem, GlCollapsibleListbox } from '@gitlab/ui'; import { mount, shallowMount } from '@vue/test-utils'; import Vue, { nextTick } from 'vue'; import VueApollo from 'vue-apollo'; @@ -80,17 +73,16 @@ describe('ProjectNamespace component', () => { }; const findButtonLabel = () => wrapper.findComponent(GlButton); - const findDropdown = () => wrapper.findComponent(GlDropdown); - const findDropdownText = () => wrapper.findComponent(GlTruncate); - const findInput = () => wrapper.findComponent(GlSearchBoxByType); + const findListBox = () => wrapper.findComponent(GlCollapsibleListbox); + const findListBoxText = () => findListBox().props('toggleText'); - const clickDropdownItem = async () => { - wrapper.findComponent(GlDropdownItem).vm.$emit('click'); + const clickListBoxItem = async (value = '') => { + wrapper.findComponent(GlListboxItem).vm.$emit('select', value); await nextTick(); }; const showDropdown = () => { - findDropdown().vm.$emit('shown'); + findListBox().vm.$emit('shown'); }; beforeAll(() => { @@ -115,7 +107,7 @@ describe('ProjectNamespace component', () => { }); it('renders placeholder text', () => { - expect(findDropdownText().props('text')).toBe('Select a namespace'); + expect(findListBoxText()).toBe('Select a namespace'); }); }); @@ -127,24 +119,18 @@ describe('ProjectNamespace component', () => { showDropdown(); }); - it('focuses on the input when the dropdown is opened', () => { - const spy = jest.spyOn(findInput().vm, 'focusInput'); - showDropdown(); - expect(spy).toHaveBeenCalledTimes(1); - }); - it('displays fetched namespaces', () => { const listItems = wrapper.findAll('li'); - expect(listItems).toHaveLength(3); - expect(listItems.at(0).findComponent(GlDropdownSectionHeader).text()).toBe('Namespaces'); - expect(listItems.at(1).text()).toBe(data.project.forkTargets.nodes[0].fullPath); - expect(listItems.at(2).text()).toBe(data.project.forkTargets.nodes[1].fullPath); + expect(listItems).toHaveLength(2); + expect(listItems.at(0).text()).toBe(data.project.forkTargets.nodes[0].fullPath); + expect(listItems.at(1).text()).toBe(data.project.forkTargets.nodes[1].fullPath); }); it('sets the selected namespace', async () => { const { fullPath } = data.project.forkTargets.nodes[0]; - await clickDropdownItem(); - expect(findDropdownText().props('text')).toBe(fullPath); + await clickListBoxItem(fullPath); + + expect(findListBoxText()).toBe(fullPath); }); }); @@ -155,7 +141,7 @@ describe('ProjectNamespace component', () => { }); it('renders `No matches found`', () => { - expect(wrapper.find('li').text()).toBe('No matches found'); + expect(findListBox().text()).toContain('No matches found'); }); }); |