diff options
Diffstat (limited to 'spec/frontend/cascading_settings')
-rw-r--r-- | spec/frontend/cascading_settings/components/lock_popovers_spec.js | 152 |
1 files changed, 152 insertions, 0 deletions
diff --git a/spec/frontend/cascading_settings/components/lock_popovers_spec.js b/spec/frontend/cascading_settings/components/lock_popovers_spec.js new file mode 100644 index 00000000000..585e6ac505b --- /dev/null +++ b/spec/frontend/cascading_settings/components/lock_popovers_spec.js @@ -0,0 +1,152 @@ +import { GlPopover } from '@gitlab/ui'; +import { mountExtended, extendedWrapper } from 'helpers/vue_test_utils_helper'; +import LockPopovers from '~/namespaces/cascading_settings/components/lock_popovers.vue'; + +describe('LockPopovers', () => { + const mockNamespace = { + full_name: 'GitLab Org / GitLab', + path: '/gitlab-org/gitlab/-/edit', + }; + + const createPopoverMountEl = ({ + lockedByApplicationSetting = false, + lockedByAncestor = false, + }) => { + const popoverMountEl = document.createElement('div'); + popoverMountEl.classList.add('js-cascading-settings-lock-popover-target'); + + const popoverData = { + locked_by_application_setting: lockedByApplicationSetting, + locked_by_ancestor: lockedByAncestor, + }; + + if (lockedByApplicationSetting) { + popoverMountEl.setAttribute('data-popover-data', JSON.stringify(popoverData)); + } else if (lockedByAncestor) { + popoverMountEl.setAttribute( + 'data-popover-data', + JSON.stringify({ ...popoverData, ancestor_namespace: mockNamespace }), + ); + } + + document.body.appendChild(popoverMountEl); + + return popoverMountEl; + }; + + let wrapper; + const createWrapper = () => { + wrapper = mountExtended(LockPopovers); + }; + + const findPopover = () => extendedWrapper(wrapper.find(GlPopover)); + const findByTextInPopover = (text, options) => + findPopover().findByText((_, element) => element.textContent === text, options); + + const expectPopoverMessageExists = (message) => { + expect(findByTextInPopover(message).exists()).toBe(true); + }; + const expectCorrectPopoverTarget = (popoverMountEl, popover = findPopover()) => { + expect(popover.props('target')).toEqual(popoverMountEl); + }; + + afterEach(() => { + document.body.innerHTML = ''; + }); + + describe('when setting is locked by an application setting', () => { + let popoverMountEl; + + beforeEach(() => { + popoverMountEl = createPopoverMountEl({ lockedByApplicationSetting: true }); + createWrapper(); + }); + + it('displays correct popover message', () => { + expectPopoverMessageExists('This setting has been enforced by an instance admin.'); + }); + + it('sets `target` prop correctly', () => { + expectCorrectPopoverTarget(popoverMountEl); + }); + }); + + describe('when setting is locked by an ancestor namespace', () => { + let popoverMountEl; + + beforeEach(() => { + popoverMountEl = createPopoverMountEl({ lockedByAncestor: true }); + createWrapper(); + }); + + it('displays correct popover message', () => { + expectPopoverMessageExists( + `This setting has been enforced by an owner of ${mockNamespace.full_name}.`, + ); + }); + + it('displays link to ancestor namespace', () => { + expect( + findByTextInPopover(mockNamespace.full_name, { + selector: `a[href="${mockNamespace.path}"]`, + }).exists(), + ).toBe(true); + }); + + it('sets `target` prop correctly', () => { + expectCorrectPopoverTarget(popoverMountEl); + }); + }); + + describe('when setting is locked by an application setting and an ancestor namespace', () => { + let popoverMountEl; + + beforeEach(() => { + popoverMountEl = createPopoverMountEl({ + lockedByAncestor: true, + lockedByApplicationSetting: true, + }); + createWrapper(); + }); + + it('application setting takes precedence and correct message is shown', () => { + expectPopoverMessageExists('This setting has been enforced by an instance admin.'); + }); + + it('sets `target` prop correctly', () => { + expectCorrectPopoverTarget(popoverMountEl); + }); + }); + + describe('when setting is not locked', () => { + beforeEach(() => { + createPopoverMountEl({ + lockedByAncestor: false, + lockedByApplicationSetting: false, + }); + createWrapper(); + }); + + it('does not render popover', () => { + expect(findPopover().exists()).toBe(false); + }); + }); + + describe('when there are multiple mount elements', () => { + let popoverMountEl1; + let popoverMountEl2; + + beforeEach(() => { + popoverMountEl1 = createPopoverMountEl({ lockedByApplicationSetting: true }); + popoverMountEl2 = createPopoverMountEl({ lockedByAncestor: true }); + createWrapper(); + }); + + it('mounts multiple popovers', () => { + const popovers = wrapper.findAll(GlPopover).wrappers; + + expectCorrectPopoverTarget(popoverMountEl1, popovers[0]); + expectCorrectPopoverTarget(popoverMountEl2, popovers[1]); + }); + }); +}); |