diff options
Diffstat (limited to 'spec/frontend/work_items_hierarchy/components/hierarchy_spec.js')
-rw-r--r-- | spec/frontend/work_items_hierarchy/components/hierarchy_spec.js | 118 |
1 files changed, 118 insertions, 0 deletions
diff --git a/spec/frontend/work_items_hierarchy/components/hierarchy_spec.js b/spec/frontend/work_items_hierarchy/components/hierarchy_spec.js new file mode 100644 index 00000000000..74774e38d6b --- /dev/null +++ b/spec/frontend/work_items_hierarchy/components/hierarchy_spec.js @@ -0,0 +1,118 @@ +import { createLocalVue, mount } from '@vue/test-utils'; +import VueApollo from 'vue-apollo'; +import { GlBadge } from '@gitlab/ui'; +import Hierarchy from '~/work_items_hierarchy/components/hierarchy.vue'; +import { extendedWrapper } from 'helpers/vue_test_utils_helper'; +import RESPONSE from '~/work_items_hierarchy/static_response'; +import { workItemTypes } from '~/work_items_hierarchy/constants'; + +const localVue = createLocalVue(); +localVue.use(VueApollo); + +describe('WorkItemsHierarchy Hierarchy', () => { + let wrapper; + + const workItemsFromResponse = (response) => { + return response.reduce( + (itemTypes, item) => { + const key = item.available ? 'available' : 'unavailable'; + itemTypes[key].push({ + ...item, + ...workItemTypes[item.type], + nestedTypes: item.nestedTypes + ? item.nestedTypes.map((type) => workItemTypes[type]) + : null, + }); + return itemTypes; + }, + { available: [], unavailable: [] }, + ); + }; + + const createComponent = (props = {}) => { + wrapper = extendedWrapper( + mount(Hierarchy, { + localVue, + propsData: { + workItemTypes: props.workItemTypes, + ...props, + }, + }), + ); + }; + + afterEach(() => { + wrapper.destroy(); + }); + + describe('available structure', () => { + let items = []; + + beforeEach(() => { + items = workItemsFromResponse(RESPONSE.ultimate).available; + createComponent({ workItemTypes: items }); + }); + + it('renders all work items', () => { + expect(wrapper.findAllByTestId('work-item-wrapper')).toHaveLength(items.length); + }); + + it('does not render badges', () => { + expect(wrapper.find(GlBadge).exists()).toBe(false); + }); + }); + + describe('unavailable structure', () => { + let items = []; + + beforeEach(() => { + items = workItemsFromResponse(RESPONSE.premium).unavailable; + createComponent({ workItemTypes: items }); + }); + + it('renders all work items', () => { + expect(wrapper.findAllByTestId('work-item-wrapper')).toHaveLength(items.length); + }); + + it('renders license badges for all work items', () => { + expect(wrapper.findAll(GlBadge)).toHaveLength(items.length); + }); + + it('does not render svg icon for linking', () => { + expect(wrapper.findByTestId('hierarchy-rounded-arrow-tail').exists()).toBe(false); + expect(wrapper.findByTestId('level-up-icon').exists()).toBe(false); + }); + }); + + describe('nested work items', () => { + describe.each` + licensePlan | arrowTailVisible | levelUpIconVisible | arrowDownIconVisible + ${'ultimate'} | ${true} | ${true} | ${true} + ${'premium'} | ${false} | ${false} | ${true} + ${'free'} | ${false} | ${false} | ${false} + `( + 'when $licensePlan license', + ({ licensePlan, arrowTailVisible, levelUpIconVisible, arrowDownIconVisible }) => { + let items = []; + beforeEach(() => { + items = workItemsFromResponse(RESPONSE[licensePlan]).available; + createComponent({ workItemTypes: items }); + }); + + it(`${arrowTailVisible ? 'render' : 'does not render'} arrow tail svg`, () => { + expect(wrapper.findByTestId('hierarchy-rounded-arrow-tail').exists()).toBe( + arrowTailVisible, + ); + }); + + it(`${levelUpIconVisible ? 'render' : 'does not render'} arrow tail svg`, () => { + expect(wrapper.findByTestId('level-up-icon').exists()).toBe(levelUpIconVisible); + }); + + it(`${arrowDownIconVisible ? 'render' : 'does not render'} arrow tail svg`, () => { + expect(wrapper.findByTestId('arrow-down-icon').exists()).toBe(arrowDownIconVisible); + }); + }, + ); + }); +}); |