diff options
Diffstat (limited to 'spec/frontend/merge_request/components/status_box_spec.js')
-rw-r--r-- | spec/frontend/merge_request/components/status_box_spec.js | 81 |
1 files changed, 81 insertions, 0 deletions
diff --git a/spec/frontend/merge_request/components/status_box_spec.js b/spec/frontend/merge_request/components/status_box_spec.js new file mode 100644 index 00000000000..e6b6512476b --- /dev/null +++ b/spec/frontend/merge_request/components/status_box_spec.js @@ -0,0 +1,81 @@ +import { nextTick } from 'vue'; +import { shallowMount } from '@vue/test-utils'; +import { GlSprintf } from '@gitlab/ui'; +import StatusBox from '~/merge_request/components/status_box.vue'; +import mrEventHub from '~/merge_request/eventhub'; + +let wrapper; + +function factory(propsData) { + wrapper = shallowMount(StatusBox, { propsData, stubs: { GlSprintf } }); +} + +const testCases = [ + { + name: 'Open', + state: 'opened', + class: 'status-box-open', + icon: 'issue-open-m', + }, + { + name: 'Closed', + state: 'closed', + class: 'status-box-mr-closed', + icon: 'close', + }, + { + name: 'Merged', + state: 'merged', + class: 'status-box-mr-merged', + icon: 'git-merge', + }, +]; + +describe('Merge request status box component', () => { + afterEach(() => { + wrapper.destroy(); + wrapper = null; + }); + + testCases.forEach((testCase) => { + describe(`when merge request is ${testCase.name}`, () => { + it('renders human readable test', () => { + factory({ + initialState: testCase.state, + }); + + expect(wrapper.text()).toContain(testCase.name); + }); + + it('sets css class', () => { + factory({ + initialState: testCase.state, + }); + + expect(wrapper.classes()).toContain(testCase.class); + }); + + it('renders icon', () => { + factory({ + initialState: testCase.state, + }); + + expect(wrapper.find('[data-testid="status-icon"]').props('name')).toBe(testCase.icon); + }); + }); + }); + + it('updates with eventhub event', async () => { + factory({ + initialState: 'opened', + }); + + expect(wrapper.text()).toContain('Open'); + + mrEventHub.$emit('mr.state.updated', { state: 'closed' }); + + await nextTick(); + + expect(wrapper.text()).toContain('Closed'); + }); +}); |