diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2019-10-14 09:07:54 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2019-10-14 09:07:54 +0000 |
commit | 5ff1b520badaa2da217416964709f49f3ede350a (patch) | |
tree | 821ddbc4062a56fd2a7f26a0776457da3e074859 /spec/frontend/vue_mr_widget/components/mr_collapsible_extension_spec.js | |
parent | eccfaf7c242ab8afec22cdaf68865763e780fdeb (diff) | |
download | gitlab-ce-5ff1b520badaa2da217416964709f49f3ede350a.tar.gz |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend/vue_mr_widget/components/mr_collapsible_extension_spec.js')
-rw-r--r-- | spec/frontend/vue_mr_widget/components/mr_collapsible_extension_spec.js | 105 |
1 files changed, 105 insertions, 0 deletions
diff --git a/spec/frontend/vue_mr_widget/components/mr_collapsible_extension_spec.js b/spec/frontend/vue_mr_widget/components/mr_collapsible_extension_spec.js new file mode 100644 index 00000000000..4c9507223a1 --- /dev/null +++ b/spec/frontend/vue_mr_widget/components/mr_collapsible_extension_spec.js @@ -0,0 +1,105 @@ +import { mount } from '@vue/test-utils'; +import MrCollapsibleSection from '~/vue_merge_request_widget/components/mr_collapsible_extension.vue'; +import { GlLoadingIcon } from '@gitlab/ui'; + +describe('Merge Request Collapsible Extension', () => { + let wrapper; + const data = { + title: 'View artifacts', + }; + + const mountComponent = props => { + wrapper = mount(MrCollapsibleSection, { + propsData: { + ...props, + }, + slots: { + default: '<div class="js-slot">Foo</div>', + }, + }); + }; + + const findTitle = () => wrapper.find('.js-title'); + + afterEach(() => { + wrapper.destroy(); + }); + + describe('while collapsed', () => { + beforeEach(() => { + mountComponent(data); + }); + + it('renders provided title', () => { + expect(findTitle().text()).toBe(data.title); + }); + + it('renders angle-right icon', () => { + expect(wrapper.vm.arrowIconName).toBe('angle-right'); + }); + + describe('onClick', () => { + beforeEach(() => { + wrapper.find('button').trigger('click'); + }); + + it('rendes the provided slot', () => { + expect(wrapper.find('.js-slot').isVisible()).toBe(true); + }); + + it('renders `Collapse` as the title', () => { + expect(findTitle().text()).toBe('Collapse'); + }); + + it('renders angle-down icon', () => { + expect(wrapper.vm.arrowIconName).toBe('angle-down'); + }); + }); + }); + + describe('while loading', () => { + beforeEach(() => { + mountComponent(Object.assign({}, data, { isLoading: true })); + }); + + it('renders the buttons disabled', () => { + expect( + wrapper + .findAll('button') + .at(0) + .attributes('disabled'), + ).toEqual('disabled'); + expect( + wrapper + .findAll('button') + .at(1) + .attributes('disabled'), + ).toEqual('disabled'); + }); + + it('renders loading spinner', () => { + expect(wrapper.find(GlLoadingIcon).isVisible()).toBe(true); + }); + }); + + describe('with error', () => { + beforeEach(() => { + mountComponent(Object.assign({}, data, { hasError: true })); + }); + + it('renders the buttons disabled', () => { + expect( + wrapper + .findAll('button') + .at(0) + .attributes('disabled'), + ).toEqual('disabled'); + expect( + wrapper + .findAll('button') + .at(1) + .attributes('disabled'), + ).toEqual('disabled'); + }); + }); +}); |