diff options
Diffstat (limited to 'spec/frontend/members/components/table')
7 files changed, 43 insertions, 40 deletions
diff --git a/spec/frontend/members/components/table/created_at_spec.js b/spec/frontend/members/components/table/created_at_spec.js index a9f809cd805..dc1f62722ab 100644 --- a/spec/frontend/members/components/table/created_at_spec.js +++ b/spec/frontend/members/components/table/created_at_spec.js @@ -13,7 +13,7 @@ describe('CreatedAt', () => { let wrapper; - const createComponent = propsData => { + const createComponent = (propsData) => { wrapper = mount(CreatedAt, { propsData: { date, diff --git a/spec/frontend/members/components/table/expiration_datepicker_spec.js b/spec/frontend/members/components/table/expiration_datepicker_spec.js index ba1b2256e76..0caaafb8d7b 100644 --- a/spec/frontend/members/components/table/expiration_datepicker_spec.js +++ b/spec/frontend/members/components/table/expiration_datepicker_spec.js @@ -25,7 +25,7 @@ describe('ExpirationDatepicker', () => { actions = { updateMemberExpiration: jest.fn( () => - new Promise(resolve => { + new Promise((resolve) => { resolveUpdateMemberExpiration = resolve; }), ), @@ -72,11 +72,9 @@ describe('ExpirationDatepicker', () => { }); it('sets `minDate` prop as tomorrow', () => { - expect( - findDatepicker() - .props('minDate') - .toISOString(), - ).toBe(new Date('2020-3-16').toISOString()); + expect(findDatepicker().props('minDate').toISOString()).toBe( + new Date('2020-3-16').toISOString(), + ); }); it('sets `target` prop as `null` so datepicker opens on focus', () => { diff --git a/spec/frontend/members/components/table/expires_at_spec.js b/spec/frontend/members/components/table/expires_at_spec.js index cf0fc78656e..321008727cd 100644 --- a/spec/frontend/members/components/table/expires_at_spec.js +++ b/spec/frontend/members/components/table/expires_at_spec.js @@ -10,7 +10,7 @@ describe('ExpiresAt', () => { let wrapper; - const createComponent = propsData => { + const createComponent = (propsData) => { wrapper = mount(ExpiresAt, { propsData, directives: { @@ -22,7 +22,7 @@ describe('ExpiresAt', () => { const getByText = (text, options) => createWrapper(within(wrapper.element).getByText(text, options)); - const getTooltipDirective = elementWrapper => getBinding(elementWrapper.element, 'gl-tooltip'); + const getTooltipDirective = (elementWrapper) => getBinding(elementWrapper.element, 'gl-tooltip'); afterEach(() => { wrapper.destroy(); diff --git a/spec/frontend/members/components/table/member_avatar_spec.js b/spec/frontend/members/components/table/member_avatar_spec.js index 98177893c18..4341dfbbaf9 100644 --- a/spec/frontend/members/components/table/member_avatar_spec.js +++ b/spec/frontend/members/components/table/member_avatar_spec.js @@ -9,7 +9,7 @@ import InviteAvatar from '~/members/components/avatars/invite_avatar.vue'; describe('MemberList', () => { let wrapper; - const createComponent = propsData => { + const createComponent = (propsData) => { wrapper = shallowMount(MemberAvatar, { propsData: { isCurrentUser: false, diff --git a/spec/frontend/members/components/table/member_source_spec.js b/spec/frontend/members/components/table/member_source_spec.js index 48ac06f32f6..95547090aed 100644 --- a/spec/frontend/members/components/table/member_source_spec.js +++ b/spec/frontend/members/components/table/member_source_spec.js @@ -6,12 +6,12 @@ import MemberSource from '~/members/components/table/member_source.vue'; describe('MemberSource', () => { let wrapper; - const createComponent = propsData => { + const createComponent = (propsData) => { wrapper = mount(MemberSource, { propsData: { memberSource: { id: 102, - name: 'Foo bar', + fullName: 'Foo bar', webUrl: 'https://gitlab.com/groups/foo-bar', }, ...propsData, @@ -25,7 +25,7 @@ describe('MemberSource', () => { const getByText = (text, options) => createWrapper(getByTextHelper(wrapper.element, text, options)); - const getTooltipDirective = elementWrapper => getBinding(elementWrapper.element, 'gl-tooltip'); + const getTooltipDirective = (elementWrapper) => getBinding(elementWrapper.element, 'gl-tooltip'); afterEach(() => { wrapper.destroy(); diff --git a/spec/frontend/members/components/table/members_table_spec.js b/spec/frontend/members/components/table/members_table_spec.js index 9945cc7ee57..dbaccde069c 100644 --- a/spec/frontend/members/components/table/members_table_spec.js +++ b/spec/frontend/members/components/table/members_table_spec.js @@ -39,7 +39,7 @@ describe('MembersTable', () => { }); }; - const createComponent = state => { + const createComponent = (state) => { wrapper = mount(MembersTable, { localVue, store: createStore(state), @@ -63,6 +63,10 @@ describe('MembersTable', () => { createWrapper(getByTestIdHelper(wrapper.element, id, options)); const findTable = () => wrapper.find(GlTable); + const findTableCellByMemberId = (tableCellLabel, memberId) => + getByTestId(`members-table-row-${memberId}`).find( + `[data-label="${tableCellLabel}"][role="cell"]`, + ); afterEach(() => { wrapper.destroy(); @@ -100,10 +104,7 @@ describe('MembersTable', () => { if (expectedComponent) { expect( - wrapper - .find(`[data-label="${label}"][role="cell"]`) - .find(expectedComponent) - .exists(), + wrapper.find(`[data-label="${label}"][role="cell"]`).find(expectedComponent).exists(), ).toBe(true); } }); @@ -117,10 +118,7 @@ describe('MembersTable', () => { expect(actionField.exists()).toBe(true); expect(actionField.classes('gl-sr-only')).toBe(true); expect( - wrapper - .find(`[data-label="Actions"][role="cell"]`) - .find(MemberActionButtons) - .exists(), + wrapper.find(`[data-label="Actions"][role="cell"]`).find(MemberActionButtons).exists(), ).toBe(true); }); @@ -137,16 +135,30 @@ describe('MembersTable', () => { canRemove: true, }; + const memberNoPermissions = { + ...memberMock, + id: 2, + }; + describe.each` permission | members - ${'canUpdate'} | ${[memberCanUpdate]} - ${'canRemove'} | ${[memberCanRemove]} - ${'canResend'} | ${[invite]} + ${'canUpdate'} | ${[memberNoPermissions, memberCanUpdate]} + ${'canRemove'} | ${[memberNoPermissions, memberCanRemove]} + ${'canResend'} | ${[memberNoPermissions, invite]} `('when one of the members has $permission permissions', ({ members }) => { it('renders the "Actions" field', () => { createComponent({ members, tableFields: ['actions'] }); expect(getByTestId('col-actions').exists()).toBe(true); + + expect(findTableCellByMemberId('Actions', members[0].id).classes()).toStrictEqual([ + 'col-actions', + 'gl-display-none!', + 'gl-display-lg-table-cell!', + ]); + expect(findTableCellByMemberId('Actions', members[1].id).classes()).toStrictEqual([ + 'col-actions', + ]); }); }); @@ -177,12 +189,9 @@ describe('MembersTable', () => { it('renders badge in "Max role" field', () => { createComponent({ members: [memberMock], tableFields: ['maxRole'] }); - expect( - wrapper - .find(`[data-label="Max role"][role="cell"]`) - .find(GlBadge) - .text(), - ).toBe(memberMock.accessLevel.stringValue); + expect(wrapper.find(`[data-label="Max role"][role="cell"]`).find(GlBadge).text()).toBe( + memberMock.accessLevel.stringValue, + ); }); }); @@ -203,10 +212,6 @@ describe('MembersTable', () => { it('adds QA selector to table row', () => { createComponent(); - expect( - findTable() - .find('tbody tr') - .attributes('data-qa-selector'), - ).toBe('member_row'); + expect(findTable().find('tbody tr').attributes('data-qa-selector')).toBe('member_row'); }); }); diff --git a/spec/frontend/members/components/table/role_dropdown_spec.js b/spec/frontend/members/components/table/role_dropdown_spec.js index 6c6abf35bd7..96a388614f3 100644 --- a/spec/frontend/members/components/table/role_dropdown_spec.js +++ b/spec/frontend/members/components/table/role_dropdown_spec.js @@ -44,7 +44,7 @@ describe('RoleDropdown', () => { const getDropdownMenu = () => within(wrapper.element).getByRole('menu'); const getByTextInDropdownMenu = (text, options = {}) => createWrapper(within(getDropdownMenu()).getByText(text, options)); - const getDropdownItemByText = text => + const getDropdownItemByText = (text) => createWrapper( within(getDropdownMenu()) .getByText(text, { selector: '[role="menuitem"] p' }) @@ -53,7 +53,7 @@ describe('RoleDropdown', () => { const getCheckedDropdownItem = () => wrapper .findAll(GlDropdownItem) - .wrappers.find(dropdownItemWrapper => dropdownItemWrapper.props('isChecked')); + .wrappers.find((dropdownItemWrapper) => dropdownItemWrapper.props('isChecked')); const findDropdownToggle = () => wrapper.find('button[aria-haspopup="true"]'); const findDropdown = () => wrapper.find(GlDropdown); @@ -63,7 +63,7 @@ describe('RoleDropdown', () => { }); describe('when dropdown is open', () => { - beforeEach(done => { + beforeEach((done) => { createComponent(); findDropdownToggle().trigger('click'); @@ -73,7 +73,7 @@ describe('RoleDropdown', () => { }); it('renders all valid roles', () => { - Object.keys(member.validRoles).forEach(role => { + Object.keys(member.validRoles).forEach((role) => { expect(getDropdownItemByText(role).exists()).toBe(true); }); }); |