Applying reviewer feedback

ee/app/assets/javascripts/packages/list/components/packages_list.vue

@@ -96,9 +96,9 @@ export default {
     <template v-else>
       <div data-qa-selector="packages-table">
         <packages-list-row
-          v-for="pk in list"
-          :key="pk.id"
-          :package-entity="pk"
+          v-for="packageEntity in list"
+          :key="packageEntity.id"
+          :package-entity="packageEntity"
           @packageToDelete="setItemToBeDeleted"
         />
       </div>

ee/app/assets/javascripts/packages/list/components/packages_list_row.vue

@@ -50,9 +50,10 @@ export default {
   <div class="gl-responsive-table-row" data-qa-selector="packages-row">
     <div class="table-section section-50 d-flex flex-md-column justify-content-between flex-wrap">
       <div class="d-flex align-items-center mr-2">
-        <gl-link :href="packageEntity._links.web_path" class="text-dark font-weight-bold mb-md-1">{{
-          packageEntity.name
-        }}</gl-link>
+        <gl-link :href="packageEntity._links.web_path" class="text-dark font-weight-bold mb-md-1">
+          {{ packageEntity.name }}
+        </gl-link>
+
         <package-tags
           v-if="packageEntity.tags && packageEntity.tags.length"
           class="prepend-left-8"

ee/spec/frontend/packages/list/components/__snapshots__/packages_list_row_spec.js.snap

@@ -15,7 +15,9 @@ exports[`packages_list_row renders 1`] = `
         class="text-dark font-weight-bold mb-md-1"
         href="foo"
       >
+        
         Test package
+      
       </gl-link-stub>
        
       <!---->

ee/spec/frontend/packages/list/components/packages_list_spec.js

@@ -5,6 +5,7 @@ import Tracking from '~/tracking';
 import { mount, createLocalVue } from '@vue/test-utils';
 import PackagesList from 'ee/packages/list/components/packages_list.vue';
 import PackagesListLoader from 'ee/packages/list/components/packages_list_loader.vue';
+import PackagesListRow from 'ee/packages/list/components/packages_list_row.vue';
 import * as SharedUtils from 'ee/packages/shared/utils';
 import { TrackingActions } from 'ee/packages/shared/constants';
 import stubChildren from 'helpers/stub_children';
@@ -24,6 +25,7 @@ describe('packages_list', () => {
   const findPackageListPagination = () => wrapper.find(GlPagination);
   const findPackageListDeleteModal = () => wrapper.find(GlModal);
   const findEmptySlot = () => wrapper.find({ name: 'empty-slot-stub' });
+  const findPackagesListRow = () => wrapper.find(PackagesListRow);
 
   const createStore = (isGroupPage, packages, isLoading) => {
     const state = {
@@ -66,6 +68,7 @@ describe('packages_list', () => {
         ...stubChildren(PackagesList),
         GlTable,
         GlSortingItem,
+        GlModal,
       },
       ...options,
     });
@@ -130,14 +133,14 @@ describe('packages_list', () => {
     });
 
     it('setItemToBeDeleted sets itemToBeDeleted and open the modal', () => {
-      wrapper.vm.$refs.packageListDeleteModal.show = jest.fn();
-
+      const mockModalShow = jest.spyOn(wrapper.vm.$refs.packageListDeleteModal, 'show');
       const item = last(wrapper.vm.list);
-      wrapper.vm.setItemToBeDeleted(item);
+
+      findPackagesListRow().vm.$emit('packageToDelete', item);
 
       return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.vm.itemToBeDeleted).toEqual(item);
-        expect(wrapper.vm.$refs.packageListDeleteModal.show).toHaveBeenCalled();
+        expect(mockModalShow).toHaveBeenCalled();
       });
     });