diff options
Diffstat (limited to 'spec/frontend/members/components/action_dropdowns/remove_member_dropdown_item_spec.js')
-rw-r--r-- | spec/frontend/members/components/action_dropdowns/remove_member_dropdown_item_spec.js | 77 |
1 files changed, 77 insertions, 0 deletions
diff --git a/spec/frontend/members/components/action_dropdowns/remove_member_dropdown_item_spec.js b/spec/frontend/members/components/action_dropdowns/remove_member_dropdown_item_spec.js new file mode 100644 index 00000000000..e1c498249d7 --- /dev/null +++ b/spec/frontend/members/components/action_dropdowns/remove_member_dropdown_item_spec.js @@ -0,0 +1,77 @@ +import { GlDropdownItem } from '@gitlab/ui'; +import { shallowMount } from '@vue/test-utils'; +import Vue from 'vue'; +import Vuex from 'vuex'; +import { modalData } from 'jest/members/mock_data'; +import RemoveMemberDropdownItem from '~/members/components/action_dropdowns/remove_member_dropdown_item.vue'; +import { MEMBER_TYPES, MEMBER_MODEL_TYPE_GROUP_MEMBER } from '~/members/constants'; + +Vue.use(Vuex); + +describe('RemoveMemberDropdownItem', () => { + let wrapper; + const text = 'dummy'; + + const actions = { + showRemoveMemberModal: jest.fn(), + }; + + const createStore = (state = {}) => { + return new Vuex.Store({ + modules: { + [MEMBER_TYPES.user]: { + namespaced: true, + state: { + memberPath: '/groups/foo-bar/-/group_members/:id', + ...state, + }, + actions, + }, + }, + }); + }; + + const createComponent = (propsData = {}, state) => { + wrapper = shallowMount(RemoveMemberDropdownItem, { + store: createStore(state), + provide: { + namespace: MEMBER_TYPES.user, + }, + propsData: { + memberId: 1, + memberModelType: MEMBER_MODEL_TYPE_GROUP_MEMBER, + modalMessage: 'Are you sure you want to remove John Smith?', + isAccessRequest: true, + isInvite: true, + userDeletionObstacles: { name: 'user', obstacles: [] }, + ...propsData, + }, + slots: { + default: text, + }, + }); + }; + + const findDropdownItem = () => wrapper.findComponent(GlDropdownItem); + + beforeEach(() => { + createComponent(); + }); + + afterEach(() => { + wrapper.destroy(); + }); + + it('renders a slot with red text', () => { + expect(findDropdownItem().html()).toContain(`<span class="gl-text-red-500">${text}</span>`); + }); + + it('calls Vuex action to show `remove member` modal when clicked', () => { + findDropdownItem().vm.$emit('click'); + + expect(actions.showRemoveMemberModal).toHaveBeenCalledWith(expect.any(Object), { + ...modalData, + preventRemoval: false, + }); + }); +}); |