Merge branch '33905-add-feature-tests-for-vue-packages-list' into 'master'

Add feature tests for the new Vue packages list

See merge request gitlab-org/gitlab!26656

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

@@ -213,6 +213,7 @@ export default {
         :busy="isLoading"
         stacked="md"
         class="package-list-table"
+        data-qa-selector="packages-table"
       >
         <template #table-busy>
           <packages-list-loader :is-group="isGroupPage" />
@@ -246,7 +247,7 @@ export default {
             <gl-link
               v-gl-tooltip.hover
               :title="item.projectPathName"
-              :href="item.project_path"
+              :href="`/${item.project_path}`"
               class="flex-truncate-child"
             >
               {{ item.projectPathName }}

ee/spec/features/groups/packages_spec.rb

@@ -185,15 +185,32 @@ describe 'Group Packages' do
     end
   end
 
-  context 'wtih vue_package_list feature flag enabled' do
+  context 'wtih vue_package_list feature flag enabled', :js do
     before do
-      stub_feature_flags(vue_package_list: true)
       visit_group_packages
     end
 
-    it 'load an empty placeholder' do
-      expect(page.has_selector?('#js-vue-packages-list')).to be_truthy
+    context 'when there are packages' do
+      let_it_be(:second_project) { create(:project, name: 'second-project', group: group) }
+      let_it_be(:conan_package) { create(:conan_package, project: project) }
+      let_it_be(:maven_package) { create(:maven_package, project: second_project) }
+      let_it_be(:packages) { [maven_package, conan_package] }
+
+      it_behaves_like 'packages list', check_project_name: true
+
+      it_behaves_like 'package details link'
+
+      it 'allows you to navigate to the project page' do
+        page.within('[data-qa-selector="packages-table"]') do
+          click_link project.name
+        end
+
+        expect(page).to have_current_path(project_path(project))
+        expect(page).to have_content(project.name)
+      end
     end
+
+    it_behaves_like 'when there are no packages'
   end
 
   def visit_group_packages

ee/spec/features/projects/packages_spec.rb

@@ -5,8 +5,8 @@ require 'spec_helper'
 describe 'Packages' do
   include SortingHelper
 
-  let(:user) { create(:user) }
-  let(:project) { create(:project) }
+  let_it_be(:user) { create(:user) }
+  let_it_be(:project) { create(:project) }
 
   before do
     sign_in(user)
@@ -162,15 +162,35 @@ describe 'Packages' do
     end
   end
 
-  context 'wtih vue_package_list ff enabled' do
+  context 'wtih vue_package_list ff enabled', :js do
     before do
-      stub_feature_flags(vue_package_list: true)
       visit_project_packages
     end
 
-    it 'load an empty placeholder' do
-      expect(page.has_selector?('#js-vue-packages-list')).to be_truthy
+    context 'when there are packages' do
+      let_it_be(:conan_package) { create(:conan_package, project: project) }
+      let_it_be(:maven_package) { create(:maven_package, project: project) }
+      let_it_be(:packages) { [maven_package, conan_package] }
+
+      it_behaves_like 'packages list'
+
+      it_behaves_like 'package details link'
+
+      context 'deleting a package' do
+        let_it_be(:project) { create(:project) }
+        let_it_be(:package) { create(:package, project: project) }
+
+        it 'allows you to delete a package' do
+          first('[title="Remove package"]').click
+          click_button('Delete package')
+
+          expect(page).to have_content 'Package deleted successfully'
+          expect(page).not_to have_content(package.name)
+        end
+      end
     end
+
+    it_behaves_like 'when there are no packages'
   end
 
   def visit_project_packages

ee/spec/support/shared_examples/features/packages_shared_examples.rb

+# frozen_string_literal: true
+
+RSpec.shared_examples 'packages list' do |check_project_name: false|
+  it 'shows a list of packages' do
+    wait_for_requests
+
+    packages.each_with_index do |pkg, index|
+      package_row = package_table_row(index)
+
+      expect(package_row).to have_content(pkg.name)
+      expect(package_row).to have_content(pkg.version)
+      expect(package_row).to have_content(pkg.project.name) if check_project_name
+    end
+  end
+
+  def package_table_row(index)
+    page.all(packages_table_selector)[index].text
+  end
+end
+
+RSpec.shared_examples 'package details link' do |property|
+  let(:package) { packages.first }
+
+  it 'navigates to the correct url' do
+    page.within(packages_table_selector) do
+      click_link package.name
+    end
+
+    expect(page).to have_current_path(project_package_path(package.project, package))
+
+    page.within('.detail-page-header') do
+      expect(page).to have_content(package.name)
+    end
+
+    page.within('[data-qa-selector="package_information_content"]') do
+      expect(page).to have_content('Installation')
+      expect(page).to have_content('Registry Setup')
+    end
+  end
+end
+
+RSpec.shared_examples 'when there are no packages' do
+  it 'displays the empty message' do
+    expect(page).to have_content('There are no packages yet')
+  end
+end
+
+def packages_table_selector
+  '[data-qa-selector="packages-table"] tbody tr'
+end