diff options
Diffstat (limited to 'spec/frontend/admin/users/components/user_actions_spec.js')
-rw-r--r-- | spec/frontend/admin/users/components/user_actions_spec.js | 62 |
1 files changed, 46 insertions, 16 deletions
diff --git a/spec/frontend/admin/users/components/user_actions_spec.js b/spec/frontend/admin/users/components/user_actions_spec.js index debe964e7aa..43313424553 100644 --- a/spec/frontend/admin/users/components/user_actions_spec.js +++ b/spec/frontend/admin/users/components/user_actions_spec.js @@ -1,4 +1,5 @@ import { GlDropdownDivider } from '@gitlab/ui'; +import { createMockDirective, getBinding } from 'helpers/vue_mock_directive'; import { shallowMountExtended } from 'helpers/vue_test_utils_helper'; import Actions from '~/admin/users/components/actions'; import AdminUserActions from '~/admin/users/components/user_actions.vue'; @@ -6,7 +7,7 @@ import { I18N_USER_ACTIONS } from '~/admin/users/constants'; import { generateUserPaths } from '~/admin/users/utils'; import { capitalizeFirstCharacter } from '~/lib/utils/text_utility'; -import { CONFIRMATION_ACTIONS, DELETE_ACTIONS, LINK_ACTIONS, LDAP, EDIT } from '../constants'; +import { CONFIRMATION_ACTIONS, DELETE_ACTIONS, LDAP, EDIT } from '../constants'; import { users, paths } from '../mock_data'; describe('AdminUserActions component', () => { @@ -20,7 +21,7 @@ describe('AdminUserActions component', () => { findUserActions(id).find('[data-testid="dropdown-toggle"]'); const findDropdownDivider = () => wrapper.findComponent(GlDropdownDivider); - const initComponent = ({ actions = [] } = {}) => { + const initComponent = ({ actions = [], showButtonLabels } = {}) => { wrapper = shallowMountExtended(AdminUserActions, { propsData: { user: { @@ -28,6 +29,10 @@ describe('AdminUserActions component', () => { actions, }, paths, + showButtonLabels, + }, + directives: { + GlTooltip: createMockDirective(), }, }); }; @@ -62,7 +67,7 @@ describe('AdminUserActions component', () => { describe('actions dropdown', () => { describe('when there are actions', () => { - const actions = [EDIT, ...LINK_ACTIONS]; + const actions = [EDIT, ...CONFIRMATION_ACTIONS]; beforeEach(() => { initComponent({ actions }); @@ -72,19 +77,6 @@ describe('AdminUserActions component', () => { expect(findActionsDropdown().exists()).toBe(true); }); - describe('when there are actions that should render as links', () => { - beforeEach(() => { - initComponent({ actions: LINK_ACTIONS }); - }); - - it.each(LINK_ACTIONS)('renders an action component item for "%s"', (action) => { - const component = wrapper.find(Actions[capitalizeFirstCharacter(action)]); - - expect(component.props('path')).toBe(userPaths[action]); - expect(component.text()).toBe(I18N_USER_ACTIONS[action]); - }); - }); - describe('when there are actions that require confirmation', () => { beforeEach(() => { initComponent({ actions: CONFIRMATION_ACTIONS }); @@ -157,4 +149,42 @@ describe('AdminUserActions component', () => { }); }); }); + + describe('when `showButtonLabels` prop is `false`', () => { + beforeEach(() => { + initComponent({ actions: [EDIT, ...CONFIRMATION_ACTIONS] }); + }); + + it('does not render "Edit" button label', () => { + const tooltip = getBinding(findEditButton().element, 'gl-tooltip'); + + expect(findEditButton().text()).toBe(''); + expect(findEditButton().attributes('aria-label')).toBe(I18N_USER_ACTIONS.edit); + expect(tooltip).toBeDefined(); + expect(tooltip.value).toBe(I18N_USER_ACTIONS.edit); + }); + + it('does not render "User administration" dropdown button label', () => { + expect(findActionsDropdown().props('text')).toBe(I18N_USER_ACTIONS.userAdministration); + expect(findActionsDropdown().props('textSrOnly')).toBe(true); + }); + }); + + describe('when `showButtonLabels` prop is `true`', () => { + beforeEach(() => { + initComponent({ actions: [EDIT, ...CONFIRMATION_ACTIONS], showButtonLabels: true }); + }); + + it('renders "Edit" button label', () => { + const tooltip = getBinding(findEditButton().element, 'gl-tooltip'); + + expect(findEditButton().text()).toBe(I18N_USER_ACTIONS.edit); + expect(tooltip).not.toBeDefined(); + }); + + it('renders "User administration" dropdown button label', () => { + expect(findActionsDropdown().props('text')).toBe(I18N_USER_ACTIONS.userAdministration); + expect(findActionsDropdown().props('textSrOnly')).toBe(false); + }); + }); }); |