diff options
Diffstat (limited to 'spec/frontend/packages_and_registries/package_registry/components/list/packages_list_spec.js')
-rw-r--r-- | spec/frontend/packages_and_registries/package_registry/components/list/packages_list_spec.js | 156 |
1 files changed, 101 insertions, 55 deletions
diff --git a/spec/frontend/packages_and_registries/package_registry/components/list/packages_list_spec.js b/spec/frontend/packages_and_registries/package_registry/components/list/packages_list_spec.js index 7cc5bea0f7a..5e9cb8fbb0b 100644 --- a/spec/frontend/packages_and_registries/package_registry/components/list/packages_list_spec.js +++ b/spec/frontend/packages_and_registries/package_registry/components/list/packages_list_spec.js @@ -1,14 +1,19 @@ import { GlAlert, GlSprintf } from '@gitlab/ui'; import { nextTick } from 'vue'; import { shallowMountExtended } from 'helpers/vue_test_utils_helper'; +import { stubComponent } from 'helpers/stub_component'; import PackagesListRow from '~/packages_and_registries/package_registry/components/list/package_list_row.vue'; import PackagesListLoader from '~/packages_and_registries/shared/components/packages_list_loader.vue'; import DeletePackageModal from '~/packages_and_registries/shared/components/delete_package_modal.vue'; +import DeleteModal from '~/packages_and_registries/package_registry/components/delete_modal.vue'; import RegistryList from '~/packages_and_registries/shared/components/registry_list.vue'; import { DELETE_PACKAGE_TRACKING_ACTION, + DELETE_PACKAGES_TRACKING_ACTION, REQUEST_DELETE_PACKAGE_TRACKING_ACTION, + REQUEST_DELETE_PACKAGES_TRACKING_ACTION, CANCEL_DELETE_PACKAGE_TRACKING_ACTION, + CANCEL_DELETE_PACKAGES_TRACKING_ACTION, } from '~/packages_and_registries/package_registry/constants'; import PackagesList from '~/packages_and_registries/package_registry/components/list/packages_list.vue'; import Tracking from '~/tracking'; @@ -44,6 +49,7 @@ describe('packages_list', () => { const findRegistryList = () => wrapper.findComponent(RegistryList); const findPackagesListRow = () => wrapper.findComponent(PackagesListRow); const findErrorPackageAlert = () => wrapper.findComponent(GlAlert); + const findDeletePackagesModal = () => wrapper.findComponent(DeleteModal); const mountComponent = (props) => { wrapper = shallowMountExtended(PackagesList, { @@ -53,6 +59,11 @@ describe('packages_list', () => { }, stubs: { DeletePackageModal, + DeleteModal: stubComponent(DeleteModal, { + methods: { + show: jest.fn(), + }, + }), GlSprintf, RegistryList, }, @@ -125,20 +136,48 @@ describe('packages_list', () => { }); }); - describe('when the user can destroy the package', () => { - beforeEach(async () => { + describe.each` + description | finderFunction | deletePayload + ${'when the user can destroy the package'} | ${findPackagesListRow} | ${firstPackage} + ${'when the user can bulk destroy packages and deletes only one package'} | ${findRegistryList} | ${[firstPackage]} + `('$description', ({ finderFunction, deletePayload }) => { + let eventSpy; + const category = 'UI::NpmPackages'; + + beforeEach(() => { + eventSpy = jest.spyOn(Tracking, 'event'); mountComponent(); - await findPackagesListRow().vm.$emit('delete', firstPackage); + finderFunction().vm.$emit('delete', deletePayload); }); it('passes itemToBeDeleted to the modal', () => { expect(findPackageListDeleteModal().props('itemToBeDeleted')).toStrictEqual(firstPackage); }); - it('emits package:delete when modal confirms', async () => { - await findPackageListDeleteModal().vm.$emit('ok'); + it('requesting delete tracks the right action', () => { + expect(eventSpy).toHaveBeenCalledWith( + category, + REQUEST_DELETE_PACKAGE_TRACKING_ACTION, + expect.any(Object), + ); + }); + + describe('when modal confirms', () => { + beforeEach(() => { + findPackageListDeleteModal().vm.$emit('ok'); + }); + + it('emits package:delete when modal confirms', () => { + expect(wrapper.emitted('package:delete')[0]).toEqual([firstPackage]); + }); - expect(wrapper.emitted('package:delete')[0]).toEqual([firstPackage]); + it('tracks the right action', () => { + expect(eventSpy).toHaveBeenCalledWith( + category, + DELETE_PACKAGE_TRACKING_ACTION, + expect.any(Object), + ); + }); }); it.each(['ok', 'cancel'])('resets itemToBeDeleted when modal emits %s', async (event) => { @@ -146,26 +185,73 @@ describe('packages_list', () => { expect(findPackageListDeleteModal().props('itemToBeDeleted')).toBeNull(); }); + + it('canceling delete tracks the right action', () => { + findPackageListDeleteModal().vm.$emit('cancel'); + + expect(eventSpy).toHaveBeenCalledWith( + category, + CANCEL_DELETE_PACKAGE_TRACKING_ACTION, + expect.any(Object), + ); + }); }); describe('when the user can bulk destroy packages', () => { + let eventSpy; + const items = [firstPackage, secondPackage]; + beforeEach(() => { + eventSpy = jest.spyOn(Tracking, 'event'); mountComponent(); + findRegistryList().vm.$emit('delete', items); }); - it('passes itemToBeDeleted to the modal when there is only one package', async () => { - await findRegistryList().vm.$emit('delete', [firstPackage]); - - expect(findPackageListDeleteModal().props('itemToBeDeleted')).toStrictEqual(firstPackage); + it('passes itemsToBeDeleted to the modal', () => { + expect(findDeletePackagesModal().props('itemsToBeDeleted')).toStrictEqual(items); expect(wrapper.emitted('delete')).toBeUndefined(); }); - it('emits delete when there is more than one package', () => { - const items = [firstPackage, secondPackage]; - findRegistryList().vm.$emit('delete', items); + it('requesting delete tracks the right action', () => { + expect(eventSpy).toHaveBeenCalledWith( + undefined, + REQUEST_DELETE_PACKAGES_TRACKING_ACTION, + expect.any(Object), + ); + }); + + describe('when modal confirms', () => { + beforeEach(() => { + findDeletePackagesModal().vm.$emit('confirm'); + }); + + it('emits delete event', () => { + expect(wrapper.emitted('delete')[0]).toEqual([items]); + }); + + it('tracks the right action', () => { + expect(eventSpy).toHaveBeenCalledWith( + undefined, + DELETE_PACKAGES_TRACKING_ACTION, + expect.any(Object), + ); + }); + }); + + it.each(['confirm', 'cancel'])('resets itemsToBeDeleted when modal emits %s', async (event) => { + await findDeletePackagesModal().vm.$emit(event); - expect(wrapper.emitted('delete')).toHaveLength(1); - expect(wrapper.emitted('delete')[0]).toEqual([items]); + expect(findDeletePackagesModal().props('itemsToBeDeleted')).toHaveLength(0); + }); + + it('canceling delete tracks the right action', () => { + findDeletePackagesModal().vm.$emit('cancel'); + + expect(eventSpy).toHaveBeenCalledWith( + undefined, + CANCEL_DELETE_PACKAGES_TRACKING_ACTION, + expect.any(Object), + ); }); }); @@ -223,44 +309,4 @@ describe('packages_list', () => { expect(wrapper.emitted('next-page')).toHaveLength(1); }); }); - - describe('tracking', () => { - let eventSpy; - const category = 'UI::NpmPackages'; - - beforeEach(() => { - eventSpy = jest.spyOn(Tracking, 'event'); - mountComponent(); - findPackagesListRow().vm.$emit('delete', firstPackage); - return nextTick(); - }); - - it('requesting the delete tracks the right action', () => { - expect(eventSpy).toHaveBeenCalledWith( - category, - REQUEST_DELETE_PACKAGE_TRACKING_ACTION, - expect.any(Object), - ); - }); - - it('confirming delete tracks the right action', () => { - findPackageListDeleteModal().vm.$emit('ok'); - - expect(eventSpy).toHaveBeenCalledWith( - category, - DELETE_PACKAGE_TRACKING_ACTION, - expect.any(Object), - ); - }); - - it('canceling delete tracks the right action', () => { - findPackageListDeleteModal().vm.$emit('cancel'); - - expect(eventSpy).toHaveBeenCalledWith( - category, - CANCEL_DELETE_PACKAGE_TRACKING_ACTION, - expect.any(Object), - ); - }); - }); }); |