Add latest changes from gitlab-org/gitlab@master

15 files changed, 2017 insertions, 169 deletions

diff --git a/spec/features/admin/admin_sees_background_migrations_spec.rb b/spec/features/admin/admin_sees_background_migrations_spec.rb
index f6048ad2515..8edddcf9a9b 100644
--- a/spec/features/admin/admin_sees_background_migrations_spec.rb
+++ b/spec/features/admin/admin_sees_background_migrations_spec.rb
@@ -54,6 +54,19 @@ RSpec.describe "Admin > Admin sees background migrations" do
     end
   end
 
+  it 'can click on a specific job' do
+    job = create(:batched_background_migration_job, :failed, batched_migration: failed_migration)
+
+    visit admin_background_migration_path(failed_migration)
+
+    within '#content-body' do
+      tab = find_link job.id
+      tab.click
+
+      expect(page).to have_current_path admin_background_migration_batched_job_path(id: job.id, background_migration_id: failed_migration.id)
+    end
+  end
+
   context 'when there are no failed jobs' do
     it 'dos not display failed jobs' do
       visit admin_background_migration_path(active_migration)
diff --git a/spec/features/dashboard/issues_filter_spec.rb b/spec/features/dashboard/issues_filter_spec.rb
index 4d59e1ded3d..3c774f8b269 100644
--- a/spec/features/dashboard/issues_filter_spec.rb
+++ b/spec/features/dashboard/issues_filter_spec.rb
@@ -78,14 +78,14 @@ RSpec.describe 'Dashboard Issues filtering', :js do
     end
 
     it 'remembers last sorting value' do
-      sort_by('Created date')
+      pajamas_sort_by(s_('SortOptions|Created date'))
       visit_issues(assignee_username: user.username)
 
       expect(page).to have_button('Created date')
     end
 
     it 'keeps sorting issues after visiting Projects Issues page' do
-      sort_by('Created date')
+      pajamas_sort_by(s_('SortOptions|Created date'))
       visit project_issues_path(project)
 
       expect(page).to have_button('Created date')
diff --git a/spec/features/dashboard/merge_requests_spec.rb b/spec/features/dashboard/merge_requests_spec.rb
index 38bef5c6143..fd580b679ad 100644
--- a/spec/features/dashboard/merge_requests_spec.rb
+++ b/spec/features/dashboard/merge_requests_spec.rb
@@ -115,6 +115,9 @@ RSpec.describe 'Dashboard Merge Requests' do
       within("span[aria-label='#{n_("%d merge request", "%d merge requests", 0) % 0}']") do
         expect(page).to have_content('0')
       end
+
+      find('.dashboard-shortcuts-merge_requests').click
+
       expect(find('.js-assigned-mr-count')).to have_content('2')
       expect(find('.js-reviewer-mr-count')).to have_content('1')
     end
@@ -165,16 +168,16 @@ RSpec.describe 'Dashboard Merge Requests' do
       expect(page).to have_content('Please select at least one filter to see results')
     end
 
-    it 'shows sorted merge requests' do
-      sort_by('Created date')
+    it 'shows sorted merge requests', :js do
+      pajamas_sort_by(s_('SortOptions|Created date'))
 
       visit merge_requests_dashboard_path(assignee_username: current_user.username)
 
       expect(find('.issues-filters')).to have_content('Created date')
     end
 
-    it 'keeps sorting merge requests after visiting Projects MR page' do
-      sort_by('Created date')
+    it 'keeps sorting merge requests after visiting Projects MR page', :js do
+      pajamas_sort_by(s_('SortOptions|Created date'))
 
       visit project_merge_requests_path(project)
 
diff --git a/spec/features/issuables/sorting_list_spec.rb b/spec/features/issuables/sorting_list_spec.rb
index bc40fb713ac..53723b39d5b 100644
--- a/spec/features/issuables/sorting_list_spec.rb
+++ b/spec/features/issuables/sorting_list_spec.rb
@@ -88,14 +88,14 @@ RSpec.describe 'Sort Issuable List' do
       end
     end
 
-    context 'custom sorting' do
+    context 'custom sorting', :js do
       let(:issuable_type) { :merge_request }
 
       it 'supports sorting in asc and desc order' do
         visit_merge_requests_with_state(project, 'open')
 
         click_button('Created date')
-        click_link('Updated date')
+        find('.dropdown-item', text: 'Updated date').click
 
         expect(first_merge_request).to include(last_updated_issuable.title)
         expect(last_merge_request).to include(first_updated_issuable.title)
diff --git a/spec/features/issues/create_issue_for_discussions_in_merge_request_spec.rb b/spec/features/issues/create_issue_for_discussions_in_merge_request_spec.rb
index b87ac743d02..1e8b9b6b60b 100644
--- a/spec/features/issues/create_issue_for_discussions_in_merge_request_spec.rb
+++ b/spec/features/issues/create_issue_for_discussions_in_merge_request_spec.rb
@@ -26,7 +26,7 @@ RSpec.describe 'Resolving all open threads in a merge request from an issue', :j
     end
 
     it 'shows a button to resolve all threads by creating a new issue' do
-      within('.line-resolve-all-container') do
+      within('.discussions-counter') do
         expect(page).to have_selector resolve_all_discussions_link_selector( title: "Create issue to resolve all threads" )
       end
     end
diff --git a/spec/features/merge_request/batch_comments_spec.rb b/spec/features/merge_request/batch_comments_spec.rb
index 2d8d4064efd..9b54d95be6b 100644
--- a/spec/features/merge_request/batch_comments_spec.rb
+++ b/spec/features/merge_request/batch_comments_spec.rb
@@ -172,9 +172,8 @@ RSpec.describe 'Merge request > Batch comments', :js do
 
         write_reply_to_discussion(button_text: 'Add comment now', resolve: true)
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('All threads resolved')
-          expect(page).to have_selector('.line-resolve-btn.is-active')
         end
       end
 
@@ -189,9 +188,8 @@ RSpec.describe 'Merge request > Batch comments', :js do
 
         wait_for_requests
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('All threads resolved')
-          expect(page).to have_selector('.line-resolve-btn.is-active')
         end
       end
     end
@@ -212,9 +210,8 @@ RSpec.describe 'Merge request > Batch comments', :js do
 
         write_reply_to_discussion(button_text: 'Add comment now', unresolve: true)
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('1 unresolved thread')
-          expect(page).not_to have_selector('.line-resolve-btn.is-active')
         end
       end
 
@@ -231,9 +228,8 @@ RSpec.describe 'Merge request > Batch comments', :js do
 
         wait_for_requests
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('1 unresolved thread')
-          expect(page).not_to have_selector('.line-resolve-btn.is-active')
         end
       end
     end
diff --git a/spec/features/merge_request/user_resolves_diff_notes_and_discussions_resolve_spec.rb b/spec/features/merge_request/user_resolves_diff_notes_and_discussions_resolve_spec.rb
index 231722c166d..e09ec11f095 100644
--- a/spec/features/merge_request/user_resolves_diff_notes_and_discussions_resolve_spec.rb
+++ b/spec/features/merge_request/user_resolves_diff_notes_and_discussions_resolve_spec.rb
@@ -38,7 +38,7 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
 
     context 'single thread' do
       it 'shows text with how many threads' do
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('1 unresolved thread')
         end
       end
@@ -55,9 +55,8 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           expect(page).to have_selector('.btn', text: 'Unresolve thread')
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('All threads resolved')
-          expect(page).to have_selector('.line-resolve-btn.is-active')
         end
       end
 
@@ -72,9 +71,8 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           expect(page).to have_selector('.line-resolve-btn.is-active')
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('All threads resolved')
-          expect(page).to have_selector('.line-resolve-btn.is-active')
         end
       end
 
@@ -84,7 +82,7 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           click_button 'Unresolve thread'
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('1 unresolved thread')
         end
       end
@@ -155,7 +153,7 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
               wait_for_requests
             end
 
-            page.within '.line-resolve-all-container' do
+            page.within '.discussions-counter' do
               expect(page).to have_content('All threads resolved')
             end
           end
@@ -167,9 +165,8 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
               wait_for_requests
             end
 
-            page.within '.line-resolve-all-container' do
+            page.within '.discussions-counter' do
               expect(page).to have_content('1 unresolved thread')
-              expect(page).not_to have_selector('.line-resolve-btn.is-active')
             end
           end
 
@@ -184,7 +181,7 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
               wait_for_requests
             end
 
-            page.within '.line-resolve-all-container' do
+            page.within '.discussions-counter' do
               expect(page).to have_content('1 unresolved thread')
             end
           end
@@ -196,9 +193,8 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           find('button[data-qa-selector="resolve_discussion_button"]').click # rubocop:disable QA/SelectorUsage
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('All threads resolved')
-          expect(page).to have_selector('.line-resolve-btn.is-active')
         end
       end
 
@@ -213,14 +209,13 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           click_button 'Add comment now'
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('All threads resolved')
-          expect(page).to have_selector('.line-resolve-btn.is-active')
         end
       end
 
       it 'allows user to quickly scroll to next unresolved thread' do
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           page.find('.discussion-next-btn').click
         end
 
@@ -269,7 +264,7 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           expect(first('.line-resolve-btn')['aria-label']).to eq("Resolved by #{user.name}")
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('All threads resolved')
         end
       end
@@ -286,7 +281,7 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           expect(button['aria-label']).to eq("Resolved by #{user.name}")
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('All threads resolved')
         end
       end
@@ -299,7 +294,7 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
       end
 
       it 'shows text with how many threads' do
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('2 unresolved threads')
         end
       end
@@ -307,7 +302,7 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
       it 'allows user to mark a single note as resolved' do
         click_button('Resolve thread', match: :first)
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('1 unresolved thread')
         end
       end
@@ -317,9 +312,8 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           btn.click
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('All threads resolved')
-          expect(page).to have_selector('.line-resolve-btn.is-active')
         end
       end
 
@@ -330,9 +324,8 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           end
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('All threads resolved')
-          expect(page).to have_selector('.line-resolve-btn.is-active')
         end
       end
 
@@ -341,7 +334,7 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           find('button[data-qa-selector="resolve_discussion_button"]').click # rubocop:disable QA/SelectorUsage
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           page.find('.discussion-next-btn').click
         end
 
@@ -370,7 +363,7 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           expect(page).not_to have_selector('.btn', text: 'Resolve thread')
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           page.find('.discussion-next-btn').click
         end
 
@@ -386,7 +379,7 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
 
     context 'changes tab' do
       it 'shows text with how many threads' do
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('1 unresolved thread')
         end
       end
@@ -402,9 +395,8 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           expect(page).to have_selector('.btn', text: 'Unresolve thread')
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('All threads resolved')
-          expect(page).to have_selector('.line-resolve-btn.is-active')
         end
       end
 
@@ -417,9 +409,8 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           expect(page).to have_selector('.line-resolve-btn.is-active')
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('All threads resolved')
-          expect(page).to have_selector('.line-resolve-btn.is-active')
         end
       end
 
@@ -429,7 +420,7 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           click_button 'Unresolve thread'
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('1 unresolved thread')
         end
       end
@@ -445,9 +436,8 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           click_button 'Add comment now'
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('All threads resolved')
-          expect(page).to have_selector('.line-resolve-btn.is-active')
         end
       end
 
@@ -462,7 +452,7 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           click_button 'Add comment now'
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('1 unresolved thread')
         end
       end
@@ -485,7 +475,7 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           expect(page).not_to have_selector('.line-resolve-btn')
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('1 unresolved thread')
         end
       end
@@ -515,9 +505,8 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           expect(page).to have_selector('.btn', text: 'Unresolve thread')
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('All threads resolved')
-          expect(page).to have_selector('.line-resolve-btn.is-active')
         end
       end
     end
@@ -534,32 +523,11 @@ RSpec.describe 'Merge request > User resolves diff notes and threads', :js do
           expect(page).not_to have_selector('.line-resolve-btn')
         end
 
-        page.within '.line-resolve-all-container' do
+        page.within '.discussions-counter' do
           expect(page).to have_content('1 unresolved thread')
         end
       end
     end
-
-    context 'resolved comment' do
-      before do
-        note.resolve!(user)
-        visit_merge_request
-      end
-
-      it 'shows resolved icon' do
-        expect(page).to have_content 'All threads resolved'
-
-        click_button _('Show thread')
-        expect(page).to have_selector('.line-resolve-btn.is-active')
-      end
-
-      it 'does not allow user to click resolve button' do
-        expect(page).to have_selector('.line-resolve-btn.is-active')
-        click_button _('Show thread')
-
-        expect(page).to have_selector('.line-resolve-btn.is-active')
-      end
-    end
   end
 
   def visit_merge_request(mr = nil)
diff --git a/spec/features/merge_requests/user_lists_merge_requests_spec.rb b/spec/features/merge_requests/user_lists_merge_requests_spec.rb
index 8c1d9dd38b0..2743f7e8ed4 100644
--- a/spec/features/merge_requests/user_lists_merge_requests_spec.rb
+++ b/spec/features/merge_requests/user_lists_merge_requests_spec.rb
@@ -109,7 +109,7 @@ RSpec.describe 'Merge requests > User lists merge requests' do
     expect(count_merge_requests).to eq(4)
   end
 
-  it 'sorts by milestone' do
+  it 'sorts by milestone due date' do
     visit_merge_requests(project, sort: sort_value_milestone)
 
     expect(first_merge_request).to include('fix')
@@ -130,12 +130,12 @@ RSpec.describe 'Merge requests > User lists merge requests' do
     expect(count_merge_requests).to eq(4)
   end
 
-  it 'filters on one label and sorts by due date' do
+  it 'filters on one label and sorts by milestone due date' do
     label = create(:label, project: project)
     create(:label_link, label: label, target: @fix)
 
     visit_merge_requests(project, label_name: [label.name],
-                                  sort: sort_value_due_date)
+                                  sort: sort_value_milestone)
 
     expect(first_merge_request).to include('fix')
     expect(count_merge_requests).to eq(1)
@@ -150,19 +150,19 @@ RSpec.describe 'Merge requests > User lists merge requests' do
       create(:label_link, label: label2, target: @fix)
     end
 
-    it 'sorts by due date' do
+    it 'sorts by milestone due date' do
       visit_merge_requests(project, label_name: [label.name, label2.name],
-                                    sort: sort_value_due_date)
+                                    sort: sort_value_milestone)
 
       expect(first_merge_request).to include('fix')
       expect(count_merge_requests).to eq(1)
     end
 
     context 'filter on assignee and' do
-      it 'sorts by due soon' do
+      it 'sorts by milestone due date' do
         visit_merge_requests(project, label_name: [label.name, label2.name],
                                       assignee_id: user.id,
-                                      sort: sort_value_due_date)
+                                      sort: sort_value_milestone)
 
         expect(first_merge_request).to include('fix')
         expect(count_merge_requests).to eq(1)
diff --git a/spec/features/merge_requests/user_mass_updates_spec.rb b/spec/features/merge_requests/user_mass_updates_spec.rb
index a15b6072e70..fa866beb773 100644
--- a/spec/features/merge_requests/user_mass_updates_spec.rb
+++ b/spec/features/merge_requests/user_mass_updates_spec.rb
@@ -5,12 +5,14 @@ require 'spec_helper'
 RSpec.describe 'Merge requests > User mass updates', :js do
   let(:project) { create(:project, :repository) }
   let(:user)    { project.creator }
+  let(:user2) { create(:user) }
   let!(:merge_request) { create(:merge_request, source_project: project, target_project: project) }
 
   before do
     stub_feature_flags(mr_attention_requests: false)
 
     project.add_maintainer(user)
+    project.add_maintainer(user2)
     sign_in(user)
   end
 
@@ -68,9 +70,9 @@ RSpec.describe 'Merge requests > User mass updates', :js do
         end
 
         it 'updates merge request with assignee' do
-          change_assignee(user.name)
+          change_assignee(user2.name)
 
-          expect(find('.issuable-meta a.author-link')[:title]).to eq "Attention requested from assignee #{user.name}"
+          expect(find('.issuable-meta a.author-link')[:title]).to eq "Attention requested from assignee #{user2.name}"
         end
       end
     end
diff --git a/spec/features/merge_requests/user_sorts_merge_requests_spec.rb b/spec/features/merge_requests/user_sorts_merge_requests_spec.rb
index fba7facaa1f..459145d3ef0 100644
--- a/spec/features/merge_requests/user_sorts_merge_requests_spec.rb
+++ b/spec/features/merge_requests/user_sorts_merge_requests_spec.rb
@@ -2,8 +2,9 @@
 
 require 'spec_helper'
 
-RSpec.describe 'User sorts merge requests' do
+RSpec.describe 'User sorts merge requests', :js do
   include CookieHelper
+  include Spec::Support::Helpers::Features::SortingHelpers
 
   let!(:merge_request) { create(:merge_request, source_project: project, target_project: project) }
   let!(:merge_request2) do
@@ -24,23 +25,19 @@ RSpec.describe 'User sorts merge requests' do
   end
 
   it 'keeps the sort option' do
-    find('.filter-dropdown-container .dropdown').click
-
-    page.within('ul.dropdown-menu.dropdown-menu-right li') do
-      click_link('Milestone')
-    end
+    pajamas_sort_by(s_('SortOptions|Milestone'))
 
     visit(merge_requests_dashboard_path(assignee_username: user.username))
 
-    expect(find('.issues-filters a.is-active')).to have_content('Milestone')
+    expect(find('.filter-dropdown-container button.dropdown-toggle')).to have_content('Milestone')
 
     visit(project_merge_requests_path(project))
 
-    expect(find('.issues-filters a.is-active')).to have_content('Milestone')
+    expect(find('.filter-dropdown-container button.dropdown-toggle')).to have_content('Milestone')
 
     visit(merge_requests_group_path(group))
 
-    expect(find('.issues-filters a.is-active')).to have_content('Milestone')
+    expect(find('.filter-dropdown-container button.dropdown-toggle')).to have_content('Milestone')
   end
 
   it 'fallbacks to issuable_sort cookie key when remembering the sorting option' do
@@ -48,17 +45,13 @@ RSpec.describe 'User sorts merge requests' do
 
     visit(merge_requests_dashboard_path(assignee_username: user.username))
 
-    expect(find('.issues-filters a.is-active')).to have_content('Milestone')
+    expect(find('.filter-dropdown-container button.dropdown-toggle')).to have_content('Milestone')
   end
 
   it 'separates remember sorting with issues', :js do
     create(:issue, project: project)
 
-    find('.filter-dropdown-container .dropdown').click
-
-    page.within('ul.dropdown-menu.dropdown-menu-right li') do
-      click_link('Milestone')
-    end
+    pajamas_sort_by(s_('SortOptions|Milestone'))
 
     visit(project_issues_path(project))
 
@@ -75,11 +68,7 @@ RSpec.describe 'User sorts merge requests' do
     end
 
     it 'sorts by popularity' do
-      find('.filter-dropdown-container .dropdown').click
-
-      page.within('ul.dropdown-menu.dropdown-menu-right li') do
-        click_link('Popularity')
-      end
+      pajamas_sort_by(s_('SortOptions|Popularity'))
 
       page.within('.mr-list') do
         page.within('li.merge-request:nth-child(1)') do
diff --git a/spec/features/projects/pipelines/legacy_pipeline_spec.rb b/spec/features/projects/pipelines/legacy_pipeline_spec.rb
new file mode 100644
index 00000000000..a29cef393a8
--- /dev/null
+++ b/spec/features/projects/pipelines/legacy_pipeline_spec.rb
@@ -0,0 +1,1073 @@
+# frozen_string_literal: true
+
+require 'spec_helper'
+
+RSpec.describe 'Pipeline', :js do
+  include RoutesHelpers
+  include ProjectForksHelper
+  include ::ExclusiveLeaseHelpers
+
+  let_it_be(:project) { create(:project) }
+
+  let(:user) { create(:user) }
+  let(:role) { :developer }
+
+  before do
+    sign_in(user)
+    project.add_role(user, role)
+    stub_feature_flags(pipeline_tabs_vue: false)
+  end
+
+  shared_context 'pipeline builds' do
+    let!(:build_passed) do
+      create(:ci_build, :success,
+             pipeline: pipeline, stage: 'build', stage_idx: 0, name: 'build')
+    end
+
+    let!(:build_failed) do
+      create(:ci_build, :failed,
+             pipeline: pipeline, stage: 'test', stage_idx: 1, name: 'test')
+    end
+
+    let!(:build_preparing) do
+      create(:ci_build, :preparing,
+             pipeline: pipeline, stage: 'deploy', stage_idx: 2, name: 'prepare')
+    end
+
+    let!(:build_running) do
+      create(:ci_build, :running,
+             pipeline: pipeline, stage: 'deploy', stage_idx: 3, name: 'deploy')
+    end
+
+    let!(:build_manual) do
+      create(:ci_build, :manual,
+             pipeline: pipeline, stage: 'deploy', stage_idx: 3, name: 'manual-build')
+    end
+
+    let!(:build_scheduled) do
+      create(:ci_build, :scheduled,
+             pipeline: pipeline, stage: 'deploy', stage_idx: 3, name: 'delayed-job')
+    end
+
+    let!(:build_external) do
+      create(:generic_commit_status, status: 'success',
+                                     pipeline: pipeline,
+                                     name: 'jenkins',
+                                     stage: 'external',
+                                     ref: 'master',
+                                     target_url: 'http://gitlab.com/status')
+    end
+  end
+
+  describe 'GET /:project/-/pipelines/:id' do
+    include_context 'pipeline builds'
+
+    let_it_be(:group) { create(:group) }
+    let_it_be(:project, reload: true) { create(:project, :repository, group: group) }
+
+    let(:pipeline) { create(:ci_pipeline, project: project, ref: 'master', sha: project.commit.id, user: user) }
+
+    subject(:visit_pipeline) { visit project_pipeline_path(project, pipeline) }
+
+    it 'shows the pipeline graph' do
+      visit_pipeline
+
+      expect(page).to have_selector('.js-pipeline-graph')
+      expect(page).to have_content('Build')
+      expect(page).to have_content('Test')
+      expect(page).to have_content('Deploy')
+      expect(page).to have_content('Retry')
+      expect(page).to have_content('Cancel running')
+    end
+
+    it 'shows Pipeline tab pane as active' do
+      visit_pipeline
+
+      expect(page).to have_css('#js-tab-pipeline.active')
+    end
+
+    it 'shows link to the pipeline ref' do
+      visit_pipeline
+
+      expect(page).to have_link(pipeline.ref)
+    end
+
+    it 'shows the pipeline information' do
+      visit_pipeline
+
+      within '.pipeline-info' do
+        expect(page).to have_content("#{pipeline.statuses.count} jobs " \
+                                      "for #{pipeline.ref}")
+        expect(page).to have_link(pipeline.ref,
+          href: project_commits_path(pipeline.project, pipeline.ref))
+      end
+    end
+
+    describe 'related merge requests' do
+      context 'when there are no related merge requests' do
+        it 'shows a "no related merge requests" message' do
+          visit_pipeline
+
+          within '.related-merge-request-info' do
+            expect(page).to have_content('No related merge requests found.')
+          end
+        end
+      end
+
+      context 'when there is one related merge request' do
+        let!(:merge_request) do
+          create(:merge_request,
+            source_project: project,
+            source_branch: pipeline.ref)
+        end
+
+        it 'shows a link to the merge request' do
+          visit_pipeline
+
+          within '.related-merge-requests' do
+            expect(page).to have_content('1 related merge request: ')
+            expect(page).to have_selector('.js-truncated-mr-list')
+            expect(page).to have_link("#{merge_request.to_reference} #{merge_request.title}")
+
+            expect(page).not_to have_selector('.js-full-mr-list')
+            expect(page).not_to have_selector('.text-expander')
+          end
+        end
+      end
+
+      context 'when there are two related merge requests' do
+        let!(:merge_request1) do
+          create(:merge_request,
+            source_project: project,
+            source_branch: pipeline.ref)
+        end
+
+        let!(:merge_request2) do
+          create(:merge_request,
+            source_project: project,
+            source_branch: pipeline.ref,
+            target_branch: 'fix')
+        end
+
+        it 'links to the most recent related merge request' do
+          visit_pipeline
+
+          within '.related-merge-requests' do
+            expect(page).to have_content('2 related merge requests: ')
+            expect(page).to have_link("#{merge_request2.to_reference} #{merge_request2.title}")
+            expect(page).to have_selector('.text-expander')
+            expect(page).to have_selector('.js-full-mr-list', visible: false)
+          end
+        end
+
+        it 'expands to show links to all related merge requests' do
+          visit_pipeline
+
+          within '.related-merge-requests' do
+            find('.text-expander').click
+
+            expect(page).to have_selector('.js-full-mr-list', visible: true)
+
+            pipeline.all_merge_requests.map do |merge_request|
+              expect(page).to have_link(href: project_merge_request_path(project, merge_request))
+            end
+          end
+        end
+      end
+    end
+
+    describe 'pipelines details view' do
+      let!(:status) { create(:user_status, user: pipeline.user, emoji: 'smirk', message: 'Authoring this object') }
+
+      it 'pipeline header shows the user status and emoji' do
+        visit project_pipeline_path(project, pipeline)
+
+        within '[data-testid="ci-header-content"]' do
+          expect(page).to have_selector("[data-testid='#{status.message}']")
+          expect(page).to have_selector("[data-name='#{status.emoji}']")
+        end
+      end
+    end
+
+    describe 'pipeline graph' do
+      before do
+        visit_pipeline
+      end
+
+      context 'when pipeline has running builds' do
+        it 'shows a running icon and a cancel action for the running build' do
+          page.within('#ci-badge-deploy') do
+            expect(page).to have_selector('.js-ci-status-icon-running')
+            expect(page).to have_selector('.js-icon-cancel')
+            expect(page).to have_content('deploy')
+          end
+        end
+
+        it 'cancels the running build and shows retry button', :sidekiq_might_not_need_inline do
+          find('#ci-badge-deploy .ci-action-icon-container').click
+
+          page.within('#ci-badge-deploy') do
+            expect(page).to have_css('.js-icon-retry')
+          end
+        end
+      end
+
+      context 'when pipeline has preparing builds' do
+        it 'shows a preparing icon and a cancel action' do
+          page.within('#ci-badge-prepare') do
+            expect(page).to have_selector('.js-ci-status-icon-preparing')
+            expect(page).to have_selector('.js-icon-cancel')
+            expect(page).to have_content('prepare')
+          end
+        end
+
+        it 'cancels the preparing build and shows retry button', :sidekiq_might_not_need_inline do
+          find('#ci-badge-deploy .ci-action-icon-container').click
+
+          page.within('#ci-badge-deploy') do
+            expect(page).to have_css('.js-icon-retry')
+          end
+        end
+      end
+
+      context 'when pipeline has successful builds' do
+        it 'shows the success icon and a retry action for the successful build' do
+          page.within('#ci-badge-build') do
+            expect(page).to have_selector('.js-ci-status-icon-success')
+            expect(page).to have_content('build')
+          end
+
+          page.within('#ci-badge-build .ci-action-icon-container.js-icon-retry') do
+            expect(page).to have_selector('svg')
+          end
+        end
+
+        it 'is possible to retry the success job', :sidekiq_might_not_need_inline do
+          find('#ci-badge-build .ci-action-icon-container').click
+          wait_for_requests
+
+          expect(page).not_to have_content('Retry job')
+          within('.js-pipeline-header-container') do
+            expect(page).to have_selector('.js-ci-status-icon-running')
+          end
+        end
+      end
+
+      context 'when pipeline has a delayed job' do
+        let(:project) { create(:project, :repository, group: group) }
+
+        it 'shows the scheduled icon and an unschedule action for the delayed job' do
+          page.within('#ci-badge-delayed-job') do
+            expect(page).to have_selector('.js-ci-status-icon-scheduled')
+            expect(page).to have_content('delayed-job')
+          end
+
+          page.within('#ci-badge-delayed-job .ci-action-icon-container.js-icon-time-out') do
+            expect(page).to have_selector('svg')
+          end
+        end
+
+        it 'unschedules the delayed job and shows play button as a manual job', :sidekiq_might_not_need_inline do
+          find('#ci-badge-delayed-job .ci-action-icon-container').click
+
+          page.within('#ci-badge-delayed-job') do
+            expect(page).to have_css('.js-icon-play')
+          end
+        end
+      end
+
+      context 'when pipeline has failed builds' do
+        it 'shows the failed icon and a retry action for the failed build' do
+          page.within('#ci-badge-test') do
+            expect(page).to have_selector('.js-ci-status-icon-failed')
+            expect(page).to have_content('test')
+          end
+
+          page.within('#ci-badge-test .ci-action-icon-container.js-icon-retry') do
+            expect(page).to have_selector('svg')
+          end
+        end
+
+        it 'is possible to retry the failed build', :sidekiq_might_not_need_inline do
+          find('#ci-badge-test .ci-action-icon-container').click
+          wait_for_requests
+
+          expect(page).not_to have_content('Retry job')
+          within('.js-pipeline-header-container') do
+            expect(page).to have_selector('.js-ci-status-icon-running')
+          end
+        end
+
+        it 'includes the failure reason' do
+          page.within('#ci-badge-test') do
+            build_link = page.find('.js-pipeline-graph-job-link')
+            expect(build_link['title']).to eq('test - failed - (unknown failure)')
+          end
+        end
+      end
+
+      context 'when pipeline has manual jobs' do
+        it 'shows the skipped icon and a play action for the manual build' do
+          page.within('#ci-badge-manual-build') do
+            expect(page).to have_selector('.js-ci-status-icon-manual')
+            expect(page).to have_content('manual')
+          end
+
+          page.within('#ci-badge-manual-build .ci-action-icon-container.js-icon-play') do
+            expect(page).to have_selector('svg')
+          end
+        end
+
+        it 'is possible to play the manual job', :sidekiq_might_not_need_inline do
+          find('#ci-badge-manual-build .ci-action-icon-container').click
+          wait_for_requests
+
+          expect(page).not_to have_content('Play job')
+          within('.js-pipeline-header-container') do
+            expect(page).to have_selector('.js-ci-status-icon-running')
+          end
+        end
+      end
+
+      context 'when pipeline has external job' do
+        it 'shows the success icon and the generic comit status build' do
+          expect(page).to have_selector('.js-ci-status-icon-success')
+          expect(page).to have_content('jenkins')
+          expect(page).to have_link('jenkins', href: 'http://gitlab.com/status')
+        end
+      end
+    end
+
+    context 'when the pipeline has manual stage' do
+      before do
+        create(:ci_build, :manual, pipeline: pipeline, stage_idx: 10, stage: 'publish', name: 'CentOS')
+        create(:ci_build, :manual, pipeline: pipeline, stage_idx: 10, stage: 'publish', name: 'Debian')
+        create(:ci_build, :manual, pipeline: pipeline, stage_idx: 10, stage: 'publish', name: 'OpenSUDE')
+
+        # force to update stages statuses
+        Ci::ProcessPipelineService.new(pipeline).execute
+
+        visit_pipeline
+      end
+
+      it 'displays play all button' do
+        expect(page).to have_selector('.js-stage-action')
+      end
+    end
+
+    context 'page tabs' do
+      before do
+        visit_pipeline
+      end
+
+      it 'shows Pipeline, Jobs, DAG and Failed Jobs tabs with link' do
+        expect(page).to have_link('Pipeline')
+        expect(page).to have_link('Jobs')
+        expect(page).to have_link('Needs')
+        expect(page).to have_link('Failed Jobs')
+      end
+
+      it 'shows counter in Jobs tab' do
+        expect(page.find('.js-builds-counter').text).to eq(pipeline.total_size.to_s)
+      end
+
+      it 'shows Pipeline tab as active' do
+        expect(page).to have_css('.js-pipeline-tab-link .active')
+      end
+
+      context 'without permission to access builds' do
+        let(:project) { create(:project, :public, :repository, public_builds: false) }
+        let(:role) { :guest }
+
+        it 'does not show the pipeline details page' do
+          expect(page).to have_content('Not Found')
+        end
+      end
+    end
+
+    context 'retrying jobs' do
+      before do
+        visit_pipeline
+      end
+
+      it { expect(page).not_to have_content('retried') }
+
+      context 'when retrying' do
+        before do
+          find('[data-testid="retryPipeline"]').click
+          wait_for_requests
+        end
+
+        it 'does not show a "Retry" button', :sidekiq_might_not_need_inline do
+          expect(page).not_to have_content('Retry')
+        end
+
+        it 'shows running status in pipeline header', :sidekiq_might_not_need_inline do
+          within('.js-pipeline-header-container') do
+            expect(page).to have_selector('.js-ci-status-icon-running')
+          end
+        end
+      end
+    end
+
+    context 'canceling jobs' do
+      before do
+        visit_pipeline
+      end
+
+      it { expect(page).not_to have_selector('.ci-canceled') }
+
+      context 'when canceling' do
+        before do
+          click_on 'Cancel running'
+        end
+
+        it 'does not show a "Cancel running" button', :sidekiq_might_not_need_inline do
+          expect(page).not_to have_content('Cancel running')
+        end
+      end
+    end
+
+    context 'when user can not delete' do
+      before do
+        visit_pipeline
+      end
+
+      it { expect(page).not_to have_button('Delete') }
+    end
+
+    context 'when deleting' do
+      before do
+        group.add_owner(user)
+
+        visit_pipeline
+
+        click_button 'Delete'
+        click_button 'Delete pipeline'
+      end
+
+      it 'redirects to pipeline overview page', :sidekiq_inline do
+        expect(page).to have_content('The pipeline has been deleted')
+        expect(page).to have_current_path(project_pipelines_path(project), ignore_query: true)
+      end
+    end
+
+    context 'when pipeline ref does not exist in repository anymore' do
+      let(:pipeline) do
+        create(:ci_empty_pipeline, project: project,
+                                   ref: 'non-existent',
+                                   sha: project.commit.id,
+                                   user: user)
+      end
+
+      before do
+        visit_pipeline
+      end
+
+      it 'does not render link to the pipeline ref' do
+        expect(page).not_to have_link(pipeline.ref)
+        expect(page).to have_content(pipeline.ref)
+      end
+
+      it 'does not render render raw HTML to the pipeline ref' do
+        page.within '.pipeline-info' do
+          expect(page).not_to have_content('<span class="ref-name"')
+        end
+      end
+    end
+
+    context 'when pipeline is detached merge request pipeline' do
+      let(:source_project) { project }
+      let(:target_project) { project }
+
+      let(:merge_request) do
+        create(:merge_request,
+          :with_detached_merge_request_pipeline,
+          source_project: source_project,
+          target_project: target_project)
+      end
+
+      let(:pipeline) do
+        merge_request.all_pipelines.last
+      end
+
+      it 'shows the pipeline information' do
+        visit_pipeline
+
+        within '.pipeline-info' do
+          expect(page).to have_content("#{pipeline.statuses.count} jobs " \
+                                       "for !#{merge_request.iid} " \
+                                       "with #{merge_request.source_branch}")
+          expect(page).to have_link("!#{merge_request.iid}",
+            href: project_merge_request_path(project, merge_request))
+          expect(page).to have_link(merge_request.source_branch,
+            href: project_commits_path(merge_request.source_project, merge_request.source_branch))
+        end
+      end
+
+      context 'when source branch does not exist' do
+        before do
+          project.repository.rm_branch(user, merge_request.source_branch)
+        end
+
+        it 'does not link to the source branch commit path' do
+          visit_pipeline
+
+          within '.pipeline-info' do
+            expect(page).not_to have_link(merge_request.source_branch)
+            expect(page).to have_content(merge_request.source_branch)
+          end
+        end
+      end
+
+      context 'when source project is a forked project' do
+        let(:source_project) { fork_project(project, user, repository: true) }
+
+        before do
+          visit project_pipeline_path(source_project, pipeline)
+        end
+
+        it 'shows the pipeline information', :sidekiq_might_not_need_inline do
+          within '.pipeline-info' do
+            expect(page).to have_content("#{pipeline.statuses.count} jobs " \
+                                         "for !#{merge_request.iid} " \
+                                         "with #{merge_request.source_branch}")
+            expect(page).to have_link("!#{merge_request.iid}",
+              href: project_merge_request_path(project, merge_request))
+            expect(page).to have_link(merge_request.source_branch,
+              href: project_commits_path(merge_request.source_project, merge_request.source_branch))
+          end
+        end
+      end
+    end
+
+    context 'when pipeline is merge request pipeline' do
+      let(:project) { create(:project, :repository, group: group) }
+      let(:source_project) { project }
+      let(:target_project) { project }
+
+      let(:merge_request) do
+        create(:merge_request,
+          :with_merge_request_pipeline,
+          source_project: source_project,
+          target_project: target_project,
+          merge_sha: project.commit.id)
+      end
+
+      let(:pipeline) do
+        merge_request.all_pipelines.last
+      end
+
+      before do
+        pipeline.update!(user: user)
+      end
+
+      it 'shows the pipeline information' do
+        visit_pipeline
+
+        within '.pipeline-info' do
+          expect(page).to have_content("#{pipeline.statuses.count} jobs " \
+                                       "for !#{merge_request.iid} " \
+                                       "with #{merge_request.source_branch} " \
+                                       "into #{merge_request.target_branch}")
+          expect(page).to have_link("!#{merge_request.iid}",
+            href: project_merge_request_path(project, merge_request))
+          expect(page).to have_link(merge_request.source_branch,
+            href: project_commits_path(merge_request.source_project, merge_request.source_branch))
+          expect(page).to have_link(merge_request.target_branch,
+            href: project_commits_path(merge_request.target_project, merge_request.target_branch))
+        end
+      end
+
+      context 'when target branch does not exist' do
+        before do
+          project.repository.rm_branch(user, merge_request.target_branch)
+        end
+
+        it 'does not link to the target branch commit path' do
+          visit_pipeline
+
+          within '.pipeline-info' do
+            expect(page).not_to have_link(merge_request.target_branch)
+            expect(page).to have_content(merge_request.target_branch)
+          end
+        end
+      end
+
+      context 'when source project is a forked project' do
+        let(:source_project) { fork_project(project, user, repository: true) }
+
+        before do
+          visit project_pipeline_path(source_project, pipeline)
+        end
+
+        it 'shows the pipeline information', :sidekiq_might_not_need_inline do
+          within '.pipeline-info' do
+            expect(page).to have_content("#{pipeline.statuses.count} jobs " \
+                                       "for !#{merge_request.iid} " \
+                                       "with #{merge_request.source_branch} " \
+                                       "into #{merge_request.target_branch}")
+            expect(page).to have_link("!#{merge_request.iid}",
+              href: project_merge_request_path(project, merge_request))
+            expect(page).to have_link(merge_request.source_branch,
+              href: project_commits_path(merge_request.source_project, merge_request.source_branch))
+            expect(page).to have_link(merge_request.target_branch,
+              href: project_commits_path(merge_request.target_project, merge_request.target_branch))
+          end
+        end
+      end
+    end
+  end
+
+  context 'when user does not have access to read jobs' do
+    before do
+      project.update!(public_builds: false)
+    end
+
+    describe 'GET /:project/-/pipelines/:id' do
+      include_context 'pipeline builds'
+
+      let_it_be(:project) { create(:project, :repository) }
+
+      let(:pipeline) { create(:ci_pipeline, project: project, ref: 'master', sha: project.commit.id, user: user) }
+
+      before do
+        visit project_pipeline_path(project, pipeline)
+      end
+
+      it 'shows the pipeline graph' do
+        expect(page).to have_selector('.js-pipeline-graph')
+        expect(page).to have_content('Build')
+        expect(page).to have_content('Test')
+        expect(page).to have_content('Deploy')
+        expect(page).to have_content('Retry')
+        expect(page).to have_content('Cancel running')
+      end
+
+      it 'does not link to job' do
+        expect(page).not_to have_selector('.js-pipeline-graph-job-link')
+      end
+    end
+  end
+
+  context 'when a bridge job exists' do
+    include_context 'pipeline builds'
+
+    let(:project) { create(:project, :repository) }
+    let(:downstream) { create(:project, :repository) }
+
+    let(:pipeline) do
+      create(:ci_pipeline, project: project,
+                           ref: 'master',
+                           sha: project.commit.id,
+                           user: user)
+    end
+
+    let!(:bridge) do
+      create(:ci_bridge, pipeline: pipeline,
+                         name: 'cross-build',
+                         user: user,
+                         downstream: downstream)
+    end
+
+    describe 'GET /:project/-/pipelines/:id' do
+      before do
+        visit project_pipeline_path(project, pipeline)
+      end
+
+      it 'shows the pipeline with a bridge job' do
+        expect(page).to have_selector('.js-pipeline-graph')
+        expect(page).to have_content('cross-build')
+      end
+
+      context 'when a scheduled pipeline is created by a blocked user' do
+        let(:project)  { create(:project, :repository) }
+
+        let(:schedule) do
+          create(:ci_pipeline_schedule,
+            project: project,
+            owner: project.first_owner,
+            description: 'blocked user schedule'
+          ).tap do |schedule|
+            schedule.update_column(:next_run_at, 1.minute.ago)
+          end
+        end
+
+        before do
+          schedule.owner.block!
+
+          begin
+            PipelineScheduleWorker.new.perform
+          rescue Ci::CreatePipelineService::CreateError
+            # Do nothing, assert view code after the Pipeline failed to create.
+          end
+        end
+
+        it 'displays the PipelineSchedule in an inactive state' do
+          visit project_pipeline_schedules_path(project)
+          page.click_link('Inactive')
+
+          expect(page).to have_selector('table.ci-table > tbody > tr > td', text: 'blocked user schedule')
+        end
+
+        it 'does not create a new Pipeline' do
+          visit project_pipelines_path(project)
+
+          expect(page).not_to have_selector('.ci-table')
+          expect(schedule.last_pipeline).to be_nil
+        end
+      end
+    end
+
+    describe 'GET /:project/-/pipelines/:id/builds' do
+      before do
+        visit builds_project_pipeline_path(project, pipeline)
+      end
+
+      it 'shows a bridge job on a list' do
+        expect(page).to have_content('cross-build')
+        expect(page).to have_content(bridge.id)
+      end
+    end
+  end
+
+  context 'when build requires resource', :sidekiq_inline do
+    let_it_be(:project) { create(:project, :repository) }
+
+    let(:pipeline) { create(:ci_pipeline, project: project) }
+    let(:resource_group) { create(:ci_resource_group, project: project) }
+
+    let!(:test_job) do
+      create(:ci_build, :pending, stage: 'test', name: 'test',
+        stage_idx: 1, pipeline: pipeline, project: project)
+    end
+
+    let!(:deploy_job) do
+      create(:ci_build, :created, stage: 'deploy', name: 'deploy',
+        stage_idx: 2, pipeline: pipeline, project: project, resource_group: resource_group)
+    end
+
+    describe 'GET /:project/-/pipelines/:id' do
+      subject { visit project_pipeline_path(project, pipeline) }
+
+      it 'shows deploy job as created' do
+        subject
+
+        within('.js-pipeline-header-container') do
+          expect(page).to have_content('pending')
+        end
+
+        within('.js-pipeline-graph') do
+          within(all('[data-testid="stage-column"]')[0]) do
+            expect(page).to have_content('test')
+            expect(page).to have_css('.ci-status-icon-pending')
+          end
+
+          within(all('[data-testid="stage-column"]')[1]) do
+            expect(page).to have_content('deploy')
+            expect(page).to have_css('.ci-status-icon-created')
+          end
+        end
+      end
+
+      context 'when test job succeeded' do
+        before do
+          test_job.success!
+        end
+
+        it 'shows deploy job as pending' do
+          subject
+
+          within('.js-pipeline-header-container') do
+            expect(page).to have_content('running')
+          end
+
+          within('.js-pipeline-graph') do
+            within(all('[data-testid="stage-column"]')[0]) do
+              expect(page).to have_content('test')
+              expect(page).to have_css('.ci-status-icon-success')
+            end
+
+            within(all('[data-testid="stage-column"]')[1]) do
+              expect(page).to have_content('deploy')
+              expect(page).to have_css('.ci-status-icon-pending')
+            end
+          end
+        end
+      end
+
+      context 'when test job succeeded but there are no available resources' do
+        let(:another_job) { create(:ci_build, :running, project: project, resource_group: resource_group) }
+
+        before do
+          resource_group.assign_resource_to(another_job)
+          test_job.success!
+        end
+
+        it 'shows deploy job as waiting for resource' do
+          subject
+
+          within('.js-pipeline-header-container') do
+            expect(page).to have_content('waiting')
+          end
+
+          within('.js-pipeline-graph') do
+            within(all('[data-testid="stage-column"]')[1]) do
+              expect(page).to have_content('deploy')
+              expect(page).to have_css('.ci-status-icon-waiting-for-resource')
+            end
+          end
+        end
+
+        context 'when resource is released from another job' do
+          before do
+            another_job.success!
+          end
+
+          it 'shows deploy job as pending' do
+            subject
+
+            within('.js-pipeline-header-container') do
+              expect(page).to have_content('running')
+            end
+
+            within('.js-pipeline-graph') do
+              within(all('[data-testid="stage-column"]')[1]) do
+                expect(page).to have_content('deploy')
+                expect(page).to have_css('.ci-status-icon-pending')
+              end
+            end
+          end
+        end
+
+        context 'when deploy job is a bridge to trigger a downstream pipeline' do
+          let!(:deploy_job) do
+            create(:ci_bridge, :created, stage: 'deploy', name: 'deploy',
+              stage_idx: 2, pipeline: pipeline, project: project, resource_group: resource_group)
+          end
+
+          it 'shows deploy job as waiting for resource' do
+            subject
+
+            within('.js-pipeline-header-container') do
+              expect(page).to have_content('waiting')
+            end
+
+            within('.js-pipeline-graph') do
+              within(all('[data-testid="stage-column"]')[1]) do
+                expect(page).to have_content('deploy')
+                expect(page).to have_css('.ci-status-icon-waiting-for-resource')
+              end
+            end
+          end
+        end
+
+        context 'when deploy job is a bridge to trigger a downstream pipeline' do
+          let!(:deploy_job) do
+            create(:ci_bridge, :created, stage: 'deploy', name: 'deploy',
+              stage_idx: 2, pipeline: pipeline, project: project, resource_group: resource_group)
+          end
+
+          it 'shows deploy job as waiting for resource' do
+            subject
+
+            within('.js-pipeline-header-container') do
+              expect(page).to have_content('waiting')
+            end
+
+            within('.js-pipeline-graph') do
+              within(all('[data-testid="stage-column"]')[1]) do
+                expect(page).to have_content('deploy')
+                expect(page).to have_css('.ci-status-icon-waiting-for-resource')
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+
+  describe 'GET /:project/-/pipelines/:id/dag' do
+    include_context 'pipeline builds'
+
+    let_it_be(:project) { create(:project, :repository) }
+
+    let(:pipeline) { create(:ci_pipeline, project: project, ref: 'master', sha: project.commit.id) }
+
+    before do
+      visit dag_project_pipeline_path(project, pipeline)
+    end
+
+    it 'shows DAG tab pane as active' do
+      expect(page).to have_css('#js-tab-dag.active', visible: false)
+    end
+
+    context 'page tabs' do
+      it 'shows Pipeline, Jobs and DAG tabs with link' do
+        expect(page).to have_link('Pipeline')
+        expect(page).to have_link('Jobs')
+        expect(page).to have_link('DAG')
+      end
+
+      it 'shows counter in Jobs tab' do
+        expect(page.find('.js-builds-counter').text).to eq(pipeline.total_size.to_s)
+      end
+
+      it 'shows DAG tab as active' do
+        expect(page).to have_css('li.js-dag-tab-link .active')
+      end
+    end
+  end
+
+  context 'when user sees pipeline flags in a pipeline detail page' do
+    let_it_be(:project) { create(:project, :repository) }
+
+    context 'when pipeline is latest' do
+      include_context 'pipeline builds'
+
+      let(:pipeline) do
+        create(:ci_pipeline,
+               project: project,
+               ref: 'master',
+               sha: project.commit.id,
+               user: user)
+      end
+
+      before do
+        visit project_pipeline_path(project, pipeline)
+      end
+
+      it 'contains badge that indicates it is the latest build' do
+        page.within(all('.well-segment')[1]) do
+          expect(page).to have_content 'latest'
+        end
+      end
+    end
+
+    context 'when pipeline has configuration errors' do
+      let(:pipeline) do
+        create(:ci_pipeline,
+               :invalid,
+               project: project,
+               ref: 'master',
+               sha: project.commit.id,
+               user: user)
+      end
+
+      before do
+        visit project_pipeline_path(project, pipeline)
+      end
+
+      it 'contains badge that indicates errors' do
+        page.within(all('.well-segment')[1]) do
+          expect(page).to have_content 'yaml invalid'
+        end
+      end
+
+      it 'contains badge with tooltip which contains error' do
+        expect(pipeline).to have_yaml_errors
+
+        page.within(all('.well-segment')[1]) do
+          expect(page).to have_selector(
+            %Q{span[title="#{pipeline.yaml_errors}"]})
+        end
+      end
+
+      it 'contains badge that indicates failure reason' do
+        expect(page).to have_content 'error'
+      end
+
+      it 'contains badge with tooltip which contains failure reason' do
+        expect(pipeline.failure_reason?).to eq true
+
+        page.within(all('.well-segment')[1]) do
+          expect(page).to have_selector(
+            %Q{span[title="#{pipeline.present.failure_reason}"]})
+        end
+      end
+
+      it 'contains a pipeline header with title' do
+        expect(page).to have_content "Pipeline ##{pipeline.id}"
+      end
+    end
+
+    context 'when pipeline is stuck' do
+      include_context 'pipeline builds'
+
+      let(:pipeline) do
+        create(:ci_pipeline,
+               project: project,
+               ref: 'master',
+               sha: project.commit.id,
+               user: user)
+      end
+
+      before do
+        create(:ci_build, :pending, pipeline: pipeline)
+        visit project_pipeline_path(project, pipeline)
+      end
+
+      it 'contains badge that indicates being stuck' do
+        page.within(all('.well-segment')[1]) do
+          expect(page).to have_content 'stuck'
+        end
+      end
+    end
+
+    context 'when pipeline uses auto devops' do
+      include_context 'pipeline builds'
+
+      let(:project) { create(:project, :repository, auto_devops_attributes: { enabled: true }) }
+      let(:pipeline) do
+        create(:ci_pipeline,
+               :auto_devops_source,
+               project: project,
+               ref: 'master',
+               sha: project.commit.id,
+               user: user)
+      end
+
+      before do
+        visit project_pipeline_path(project, pipeline)
+      end
+
+      it 'contains badge that indicates using auto devops' do
+        page.within(all('.well-segment')[1]) do
+          expect(page).to have_content 'Auto DevOps'
+        end
+      end
+    end
+
+    context 'when pipeline runs in a merge request context' do
+      include_context 'pipeline builds'
+
+      let(:pipeline) do
+        create(:ci_pipeline,
+               source: :merge_request_event,
+               project: merge_request.source_project,
+               ref: 'feature',
+               sha: merge_request.diff_head_sha,
+               user: user,
+               merge_request: merge_request)
+      end
+
+      let(:merge_request) do
+        create(:merge_request,
+               source_project: project,
+               source_branch: 'feature',
+               target_project: project,
+               target_branch: 'master')
+      end
+
+      before do
+        visit project_pipeline_path(project, pipeline)
+      end
+
+      it 'contains badge that indicates detached merge request pipeline' do
+        page.within(all('.well-segment')[1]) do
+          expect(page).to have_content 'merge request'
+        end
+      end
+    end
+  end
+end
diff --git a/spec/features/projects/pipelines/legacy_pipelines_spec.rb b/spec/features/projects/pipelines/legacy_pipelines_spec.rb
new file mode 100644
index 00000000000..3f89e344c51
--- /dev/null
+++ b/spec/features/projects/pipelines/legacy_pipelines_spec.rb
@@ -0,0 +1,847 @@
+# frozen_string_literal: true
+
+require 'spec_helper'
+
+RSpec.describe 'Pipelines', :js do
+  include ProjectForksHelper
+  include Spec::Support::Helpers::ModalHelpers
+
+  let(:project) { create(:project) }
+  let(:expected_detached_mr_tag) {'merge request'}
+
+  context 'when user is logged in' do
+    let(:user) { create(:user) }
+
+    before do
+      sign_in(user)
+
+      project.add_developer(user)
+      project.update!(auto_devops_attributes: { enabled: false })
+
+      stub_feature_flags(pipeline_tabs_vue: false)
+    end
+
+    describe 'GET /:project/-/pipelines' do
+      let(:project) { create(:project, :repository) }
+
+      let!(:pipeline) do
+        create(
+          :ci_empty_pipeline,
+          project: project,
+          ref: 'master',
+          status: 'running',
+          sha: project.commit.id
+        )
+      end
+
+      context 'scope' do
+        before do
+          create(:ci_empty_pipeline, status: 'pending', project: project, sha: project.commit.id, ref: 'master')
+          create(:ci_empty_pipeline, status: 'running', project: project, sha: project.commit.id, ref: 'master')
+          create(:ci_empty_pipeline, status: 'created', project: project, sha: project.commit.id, ref: 'master')
+          create(:ci_empty_pipeline, status: 'success', project: project, sha: project.commit.id, ref: 'master')
+        end
+
+        [:all, :running, :pending, :finished, :branches].each do |scope|
+          context "when displaying #{scope}" do
+            before do
+              visit_project_pipelines(scope: scope)
+            end
+
+            it 'contains pipeline commit short SHA' do
+              expect(page).to have_content(pipeline.short_sha)
+            end
+
+            it 'contains branch name' do
+              expect(page).to have_content(pipeline.ref)
+            end
+          end
+        end
+      end
+
+      context 'header tabs' do
+        before do
+          visit project_pipelines_path(project)
+          wait_for_requests
+        end
+
+        it 'shows a tab for All pipelines and count' do
+          expect(page.find('.js-pipelines-tab-all').text).to include('All')
+          expect(page.find('.js-pipelines-tab-all .badge').text).to include('1')
+        end
+
+        it 'shows a tab for Finished pipelines and count' do
+          expect(page.find('.js-pipelines-tab-finished').text).to include('Finished')
+        end
+
+        it 'shows a tab for Branches' do
+          expect(page.find('.js-pipelines-tab-branches').text).to include('Branches')
+        end
+
+        it 'shows a tab for Tags' do
+          expect(page.find('.js-pipelines-tab-tags').text).to include('Tags')
+        end
+
+        it 'updates content when tab is clicked' do
+          page.find('.js-pipelines-tab-finished').click
+          wait_for_requests
+          expect(page).to have_content('There are currently no finished pipelines.')
+        end
+      end
+
+      context 'navigation links' do
+        before do
+          visit project_pipelines_path(project)
+          wait_for_requests
+        end
+
+        it 'renders "CI lint" link' do
+          expect(page).to have_link('CI lint')
+        end
+
+        it 'renders "Run pipeline" link' do
+          expect(page).to have_link('Run pipeline')
+        end
+      end
+
+      context 'when pipeline is cancelable' do
+        let!(:build) do
+          create(:ci_build, pipeline: pipeline,
+                            stage: 'test')
+        end
+
+        before do
+          build.run
+          visit_project_pipelines
+        end
+
+        it 'indicates that pipeline can be canceled' do
+          expect(page).to have_selector('.js-pipelines-cancel-button')
+          expect(page).to have_selector('.ci-running')
+        end
+
+        context 'when canceling' do
+          before do
+            find('.js-pipelines-cancel-button').click
+            click_button 'Stop pipeline'
+            wait_for_requests
+          end
+
+          it 'indicated that pipelines was canceled', :sidekiq_might_not_need_inline do
+            expect(page).not_to have_selector('.js-pipelines-cancel-button')
+            expect(page).to have_selector('.ci-canceled')
+          end
+        end
+      end
+
+      context 'when pipeline is retryable', :sidekiq_might_not_need_inline do
+        let!(:build) do
+          create(:ci_build, pipeline: pipeline,
+                            stage: 'test')
+        end
+
+        before do
+          build.drop
+          visit_project_pipelines
+        end
+
+        it 'indicates that pipeline can be retried' do
+          expect(page).to have_selector('.js-pipelines-retry-button')
+          expect(page).to have_selector('.ci-failed')
+        end
+
+        context 'when retrying' do
+          before do
+            find('.js-pipelines-retry-button').click
+            wait_for_requests
+          end
+
+          it 'shows running pipeline that is not retryable' do
+            expect(page).not_to have_selector('.js-pipelines-retry-button')
+            expect(page).to have_selector('.ci-running')
+          end
+        end
+      end
+
+      context 'when pipeline is detached merge request pipeline' do
+        let(:merge_request) do
+          create(:merge_request,
+                 :with_detached_merge_request_pipeline,
+                 source_project: source_project,
+                 target_project: target_project)
+        end
+
+        let!(:pipeline) { merge_request.all_pipelines.first }
+        let(:source_project) { project }
+        let(:target_project) { project }
+
+        before do
+          visit project_pipelines_path(source_project)
+        end
+
+        shared_examples_for 'detached merge request pipeline' do
+          it 'shows pipeline information without pipeline ref', :sidekiq_might_not_need_inline do
+            within '.pipeline-tags' do
+              expect(page).to have_content(expected_detached_mr_tag)
+
+              expect(page).to have_link(merge_request.iid,
+                                        href: project_merge_request_path(project, merge_request))
+
+              expect(page).not_to have_link(pipeline.ref)
+            end
+          end
+        end
+
+        it_behaves_like 'detached merge request pipeline'
+
+        context 'when source project is a forked project' do
+          let(:source_project) { fork_project(project, user, repository: true) }
+
+          it_behaves_like 'detached merge request pipeline'
+        end
+      end
+
+      context 'when pipeline is merge request pipeline' do
+        let(:merge_request) do
+          create(:merge_request,
+                 :with_merge_request_pipeline,
+                 source_project: source_project,
+                 target_project: target_project,
+                 merge_sha: target_project.commit.sha)
+        end
+
+        let!(:pipeline) { merge_request.all_pipelines.first }
+        let(:source_project) { project }
+        let(:target_project) { project }
+
+        before do
+          visit project_pipelines_path(source_project)
+        end
+
+        shared_examples_for 'Correct merge request pipeline information' do
+          it 'does not show detached tag for the pipeline, and shows the link of the merge request' \
+             'and does not show the ref of the pipeline', :sidekiq_might_not_need_inline do
+            within '.pipeline-tags' do
+              expect(page).not_to have_content(expected_detached_mr_tag)
+
+              expect(page).to have_link(merge_request.iid,
+                                        href: project_merge_request_path(project, merge_request))
+
+              expect(page).not_to have_link(pipeline.ref)
+            end
+          end
+        end
+
+        it_behaves_like 'Correct merge request pipeline information'
+
+        context 'when source project is a forked project' do
+          let(:source_project) { fork_project(project, user, repository: true) }
+
+          it_behaves_like 'Correct merge request pipeline information'
+        end
+      end
+
+      context 'when pipeline has configuration errors' do
+        let(:pipeline) do
+          create(:ci_pipeline, :invalid, project: project)
+        end
+
+        before do
+          visit_project_pipelines
+        end
+
+        it 'contains badge that indicates errors' do
+          expect(page).to have_content 'yaml invalid'
+        end
+
+        it 'contains badge with tooltip which contains error' do
+          expect(pipeline).to have_yaml_errors
+          expect(page).to have_selector(
+            %Q{span[title="#{pipeline.yaml_errors}"]})
+        end
+
+        it 'contains badge that indicates failure reason' do
+          expect(page).to have_content 'error'
+        end
+
+        it 'contains badge with tooltip which contains failure reason' do
+          expect(pipeline.failure_reason?).to eq true
+          expect(page).to have_selector(
+            %Q{span[title="#{pipeline.present.failure_reason}"]})
+        end
+      end
+
+      context 'with manual actions' do
+        let!(:manual) do
+          create(:ci_build, :manual,
+            pipeline: pipeline,
+            name: 'manual build',
+            stage: 'test')
+        end
+
+        before do
+          visit_project_pipelines
+        end
+
+        it 'has a dropdown with play button' do
+          expect(page).to have_selector('[data-testid="pipelines-manual-actions-dropdown"] [data-testid="play-icon"]')
+        end
+
+        it 'has link to the manual action' do
+          find('[data-testid="pipelines-manual-actions-dropdown"]').click
+
+          expect(page).to have_button('manual build')
+        end
+
+        context 'when manual action was played' do
+          before do
+            find('[data-testid="pipelines-manual-actions-dropdown"]').click
+            click_button('manual build')
+          end
+
+          it 'enqueues manual action job' do
+            expect(page).to have_selector(
+              '[data-testid="pipelines-manual-actions-dropdown"] .gl-dropdown-toggle:disabled'
+            )
+          end
+        end
+      end
+
+      context 'when there is a delayed job' do
+        let!(:delayed_job) do
+          create(:ci_build, :scheduled,
+            pipeline: pipeline,
+            name: 'delayed job 1',
+            stage: 'test')
+        end
+
+        before do
+          stub_feature_flags(bootstrap_confirmation_modals: false)
+          visit_project_pipelines
+        end
+
+        it 'has a dropdown for actionable jobs' do
+          expect(page).to have_selector('[data-testid="pipelines-manual-actions-dropdown"] [data-testid="play-icon"]')
+        end
+
+        it "has link to the delayed job's action" do
+          find('[data-testid="pipelines-manual-actions-dropdown"]').click
+
+          time_diff = [0, delayed_job.scheduled_at - Time.zone.now].max
+          expect(page).to have_button('delayed job 1')
+          expect(page).to have_content(Time.at(time_diff).utc.strftime("%H:%M:%S"))
+        end
+
+        context 'when delayed job is expired already' do
+          let!(:delayed_job) do
+            create(:ci_build, :expired_scheduled,
+              pipeline: pipeline,
+              name: 'delayed job 1',
+              stage: 'test')
+          end
+
+          it "shows 00:00:00 as the remaining time" do
+            find('[data-testid="pipelines-manual-actions-dropdown"]').click
+
+            expect(page).to have_content("00:00:00")
+          end
+        end
+
+        context 'when user played a delayed job immediately' do
+          before do
+            find('[data-testid="pipelines-manual-actions-dropdown"]').click
+            accept_gl_confirm do
+              click_button 'delayed job 1'
+            end
+            wait_for_requests
+          end
+
+          it 'enqueues the delayed job', :js do
+            expect(delayed_job.reload).to be_pending
+          end
+        end
+      end
+
+      context 'for generic statuses' do
+        context 'when preparing' do
+          let!(:pipeline) do
+            create(:ci_empty_pipeline,
+              status: 'preparing', project: project)
+          end
+
+          let!(:status) do
+            create(:generic_commit_status,
+              :preparing, pipeline: pipeline)
+          end
+
+          before do
+            visit_project_pipelines
+          end
+
+          it 'is cancelable' do
+            expect(page).to have_selector('.js-pipelines-cancel-button')
+          end
+
+          it 'shows the pipeline as preparing' do
+            expect(page).to have_selector('.ci-preparing')
+          end
+        end
+
+        context 'when running' do
+          let!(:running) do
+            create(:generic_commit_status,
+              status: 'running',
+              pipeline: pipeline,
+              stage: 'test')
+          end
+
+          before do
+            visit_project_pipelines
+          end
+
+          it 'is cancelable' do
+            expect(page).to have_selector('.js-pipelines-cancel-button')
+          end
+
+          it 'has pipeline running' do
+            expect(page).to have_selector('.ci-running')
+          end
+
+          context 'when canceling' do
+            before do
+              find('.js-pipelines-cancel-button').click
+              click_button 'Stop pipeline'
+            end
+
+            it 'indicates that pipeline was canceled', :sidekiq_might_not_need_inline do
+              expect(page).not_to have_selector('.js-pipelines-cancel-button')
+              expect(page).to have_selector('.ci-canceled')
+            end
+          end
+        end
+
+        context 'when failed' do
+          let!(:status) do
+            create(:generic_commit_status, :pending,
+              pipeline: pipeline,
+              stage: 'test')
+          end
+
+          before do
+            status.drop
+            visit_project_pipelines
+          end
+
+          it 'is not retryable' do
+            expect(page).not_to have_selector('.js-pipelines-retry-button')
+          end
+
+          it 'has failed pipeline', :sidekiq_might_not_need_inline do
+            expect(page).to have_selector('.ci-failed')
+          end
+        end
+      end
+
+      context 'downloadable pipelines' do
+        context 'with artifacts' do
+          let!(:with_artifacts) do
+            build = create(:ci_build, :success,
+              pipeline: pipeline,
+              name: 'rspec tests',
+              stage: 'test')
+
+            create(:ci_job_artifact, :codequality, job: build)
+          end
+
+          before do
+            visit_project_pipelines
+          end
+
+          it 'has artifacts dropdown' do
+            expect(page).to have_selector('[data-testid="pipeline-multi-actions-dropdown"]')
+          end
+        end
+
+        context 'with artifacts expired' do
+          let!(:with_artifacts_expired) do
+            create(:ci_build, :expired, :success,
+              pipeline: pipeline,
+              name: 'rspec',
+              stage: 'test')
+          end
+
+          before do
+            visit_project_pipelines
+          end
+
+          it { expect(page).not_to have_selector('[data-testid="artifact-item"]') }
+        end
+
+        context 'without artifacts' do
+          let!(:without_artifacts) do
+            create(:ci_build, :success,
+              pipeline: pipeline,
+              name: 'rspec',
+              stage: 'test')
+          end
+
+          before do
+            visit_project_pipelines
+          end
+
+          it { expect(page).not_to have_selector('[data-testid="artifact-item"]') }
+        end
+
+        context 'with trace artifact' do
+          before do
+            create(:ci_build, :success, :trace_artifact, pipeline: pipeline)
+
+            visit_project_pipelines
+          end
+
+          it 'does not show trace artifact as artifacts' do
+            expect(page).not_to have_selector('[data-testid="artifact-item"]')
+          end
+        end
+      end
+
+      context 'mini pipeline graph' do
+        let!(:build) do
+          create(:ci_build, :pending, pipeline: pipeline,
+                                      stage: 'build',
+                                      name: 'build')
+        end
+
+        dropdown_selector = '[data-testid="mini-pipeline-graph-dropdown"]'
+
+        before do
+          visit_project_pipelines
+        end
+
+        it 'renders a mini pipeline graph' do
+          expect(page).to have_selector('[data-testid="pipeline-mini-graph"]')
+          expect(page).to have_selector(dropdown_selector)
+        end
+
+        context 'when clicking a stage badge' do
+          it 'opens a dropdown' do
+            find(dropdown_selector).click
+
+            expect(page).to have_link build.name
+          end
+
+          it 'is possible to cancel pending build' do
+            find(dropdown_selector).click
+            find('.js-ci-action').click
+            wait_for_requests
+
+            expect(build.reload).to be_canceled
+          end
+        end
+
+        context 'for a failed pipeline' do
+          let!(:build) do
+            create(:ci_build, :failed, pipeline: pipeline,
+                                      stage: 'build',
+                                      name: 'build')
+          end
+
+          it 'displays the failure reason' do
+            find(dropdown_selector).click
+
+            within('.js-builds-dropdown-list') do
+              build_element = page.find('.mini-pipeline-graph-dropdown-item')
+              expect(build_element['title']).to eq('build - failed - (unknown failure)')
+            end
+          end
+        end
+      end
+
+      context 'with pagination' do
+        before do
+          allow(Ci::Pipeline).to receive(:default_per_page).and_return(1)
+          create(:ci_empty_pipeline, project: project)
+        end
+
+        it 'renders pagination' do
+          visit project_pipelines_path(project)
+          wait_for_requests
+
+          expect(page).to have_selector('.gl-pagination')
+        end
+
+        it 'renders second page of pipelines' do
+          visit project_pipelines_path(project, page: '2')
+          wait_for_requests
+
+          expect(page).to have_selector('.gl-pagination .page-link', count: 4)
+        end
+
+        it 'shows updated content' do
+          visit project_pipelines_path(project)
+          wait_for_requests
+          page.find('.page-link.next-page-item').click
+
+          expect(page).to have_selector('.gl-pagination .page-link', count: 4)
+        end
+      end
+
+      context 'with pipeline key selection' do
+        before do
+          visit project_pipelines_path(project)
+          wait_for_requests
+        end
+
+        it 'changes the Pipeline ID column for Pipeline IID' do
+          page.find('[data-testid="pipeline-key-dropdown"]').click
+
+          within '.gl-new-dropdown-contents' do
+            dropdown_options = page.find_all '.gl-new-dropdown-item'
+
+            dropdown_options[1].click
+          end
+
+          expect(page.find('[data-testid="pipeline-th"]')).to have_content 'Pipeline'
+          expect(page.find('[data-testid="pipeline-url-link"]')).to have_content "##{pipeline.iid}"
+        end
+      end
+    end
+
+    describe 'GET /:project/-/pipelines/show' do
+      let(:project) { create(:project, :repository) }
+
+      let(:pipeline) do
+        create(:ci_empty_pipeline,
+              project: project,
+              sha: project.commit.id,
+              user: user)
+      end
+
+      before do
+        create_build('build', 0, 'build', :success)
+        create_build('test', 1, 'rspec 0:2', :pending)
+        create_build('test', 1, 'rspec 1:2', :running)
+        create_build('test', 1, 'spinach 0:2', :created)
+        create_build('test', 1, 'spinach 1:2', :created)
+        create_build('test', 1, 'audit', :created)
+        create_build('deploy', 2, 'production', :created)
+
+        create(
+          :generic_commit_status,
+          pipeline: pipeline,
+          stage: 'external',
+          name: 'jenkins',
+          stage_idx: 3,
+          ref: 'master'
+        )
+
+        visit project_pipeline_path(project, pipeline)
+        wait_for_requests
+      end
+
+      it 'shows a graph with grouped stages' do
+        expect(page).to have_css('.js-pipeline-graph')
+
+        # header
+        expect(page).to have_text("##{pipeline.id}")
+        expect(page).to have_selector(%Q(img[src="#{pipeline.user.avatar_url}"]))
+        expect(page).to have_link(pipeline.user.name, href: user_path(pipeline.user))
+
+        # stages
+        expect(page).to have_text('Build')
+        expect(page).to have_text('Test')
+        expect(page).to have_text('Deploy')
+        expect(page).to have_text('External')
+
+        # builds
+        expect(page).to have_text('rspec')
+        expect(page).to have_text('spinach')
+        expect(page).to have_text('rspec')
+        expect(page).to have_text('production')
+        expect(page).to have_text('jenkins')
+      end
+
+      def create_build(stage, stage_idx, name, status)
+        create(:ci_build, pipeline: pipeline, stage: stage, stage_idx: stage_idx, name: name, status: status)
+      end
+    end
+
+    describe 'POST /:project/-/pipelines' do
+      let(:project) { create(:project, :repository) }
+
+      before do
+        visit new_project_pipeline_path(project)
+      end
+
+      context 'for valid commit', :js do
+        before do
+          click_button project.default_branch
+          wait_for_requests
+
+          find('p', text: 'master').click
+          wait_for_requests
+        end
+
+        context 'with gitlab-ci.yml', :js do
+          before do
+            stub_ci_pipeline_to_return_yaml_file
+          end
+
+          it 'creates a new pipeline' do
+            expect do
+              click_on 'Run pipeline'
+              wait_for_requests
+            end
+              .to change { Ci::Pipeline.count }.by(1)
+
+            expect(Ci::Pipeline.last).to be_web
+          end
+
+          context 'when variables are specified' do
+            it 'creates a new pipeline with variables' do
+              page.within(find("[data-testid='ci-variable-row']")) do
+                find("[data-testid='pipeline-form-ci-variable-key']").set('key_name')
+                find("[data-testid='pipeline-form-ci-variable-value']").set('value')
+              end
+
+              expect do
+                click_on 'Run pipeline'
+                wait_for_requests
+              end
+                .to change { Ci::Pipeline.count }.by(1)
+
+              expect(Ci::Pipeline.last.variables.map { |var| var.slice(:key, :secret_value) })
+                .to eq [{ key: "key_name", secret_value: "value" }.with_indifferent_access]
+            end
+          end
+        end
+
+        context 'without gitlab-ci.yml' do
+          before do
+            click_on 'Run pipeline'
+            wait_for_requests
+          end
+
+          it { expect(page).to have_content('Missing CI config file') }
+          it 'creates a pipeline after first request failed and a valid gitlab-ci.yml file' \
+            'is available when trying again' do
+            stub_ci_pipeline_to_return_yaml_file
+
+            expect do
+              click_on 'Run pipeline'
+              wait_for_requests
+            end
+              .to change { Ci::Pipeline.count }.by(1)
+          end
+        end
+      end
+    end
+
+    describe 'Reset runner caches' do
+      let(:project) { create(:project, :repository) }
+
+      before do
+        create(:ci_empty_pipeline, status: 'success', project: project, sha: project.commit.id, ref: 'master')
+        project.add_maintainer(user)
+        visit project_pipelines_path(project)
+      end
+
+      it 'has a clear caches button' do
+        expect(page).to have_button 'Clear runner caches'
+      end
+
+      describe 'user clicks the button' do
+        context 'when project already has jobs_cache_index' do
+          before do
+            project.update!(jobs_cache_index: 1)
+          end
+
+          it 'increments jobs_cache_index' do
+            click_button 'Clear runner caches'
+            wait_for_requests
+            expect(page.find('[data-testid="alert-info"]')).to have_content 'Project cache successfully reset.'
+          end
+        end
+
+        context 'when project does not have jobs_cache_index' do
+          it 'sets jobs_cache_index to 1' do
+            click_button 'Clear runner caches'
+            wait_for_requests
+            expect(page.find('[data-testid="alert-info"]')).to have_content 'Project cache successfully reset.'
+          end
+        end
+      end
+    end
+
+    describe 'Run Pipelines' do
+      let(:project) { create(:project, :repository) }
+
+      before do
+        visit new_project_pipeline_path(project)
+      end
+
+      describe 'new pipeline page' do
+        it 'has field to add a new pipeline' do
+          expect(page).to have_selector('[data-testid="ref-select"]')
+          expect(find('[data-testid="ref-select"]')).to have_content project.default_branch
+          expect(page).to have_content('Run for')
+        end
+      end
+
+      describe 'find pipelines' do
+        it 'shows filtered pipelines', :js do
+          click_button project.default_branch
+
+          page.within '[data-testid="ref-select"]' do
+            find('[data-testid="search-refs"]').native.send_keys('fix')
+
+            page.within '.gl-new-dropdown-contents' do
+              expect(page).to have_content('fix')
+            end
+          end
+        end
+      end
+    end
+
+    describe 'Empty State' do
+      let(:project) { create(:project, :repository) }
+
+      before do
+        visit project_pipelines_path(project)
+      end
+
+      it 'renders empty state' do
+        expect(page).to have_content 'Try test template'
+      end
+    end
+  end
+
+  context 'when user is not logged in' do
+    before do
+      project.update!(auto_devops_attributes: { enabled: false })
+      visit project_pipelines_path(project)
+    end
+
+    context 'when project is public' do
+      let(:project) { create(:project, :public, :repository) }
+
+      context 'without pipelines' do
+        it { expect(page).to have_content 'This project is not currently set up to run pipelines.' }
+      end
+    end
+
+    context 'when project is private' do
+      let(:project) { create(:project, :private, :repository) }
+
+      it 'redirects the user to sign_in and displays the flash alert' do
+        expect(page).to have_content 'You need to sign in'
+        expect(page).to have_current_path("/users/sign_in")
+      end
+    end
+  end
+
+  def visit_project_pipelines(**query)
+    visit project_pipelines_path(project, query)
+    wait_for_requests
+  end
+end
diff --git a/spec/features/projects/pipelines/pipeline_spec.rb b/spec/features/projects/pipelines/pipeline_spec.rb
index c6a2ccb3e8c..9eda05f695d 100644
--- a/spec/features/projects/pipelines/pipeline_spec.rb
+++ b/spec/features/projects/pipelines/pipeline_spec.rb
@@ -15,7 +15,6 @@ RSpec.describe 'Pipeline', :js do
   before do
     sign_in(user)
     project.add_role(user, role)
-    stub_feature_flags(pipeline_tabs_vue: false)
   end
 
   shared_context 'pipeline builds' do
@@ -80,12 +79,6 @@ RSpec.describe 'Pipeline', :js do
       expect(page).to have_content('Cancel running')
     end
 
-    it 'shows Pipeline tab pane as active' do
-      visit_pipeline
-
-      expect(page).to have_css('#js-tab-pipeline.active')
-    end
-
     it 'shows link to the pipeline ref' do
       visit_pipeline
 
@@ -504,7 +497,6 @@ RSpec.describe 'Pipeline', :js do
 
     context 'page tabs' do
       before do
-        stub_feature_flags(pipeline_tabs_vue: false)
         visit_pipeline
       end
 
@@ -516,13 +508,10 @@ RSpec.describe 'Pipeline', :js do
       end
 
       it 'shows counter in Jobs tab' do
+        skip('Enable in jobs `pipeline_tabs_vue` MR')
         expect(page.find('.js-builds-counter').text).to eq(pipeline.total_size.to_s)
       end
 
-      it 'shows Pipeline tab as active' do
-        expect(page).to have_css('.js-pipeline-tab-link .active')
-      end
-
       context 'without permission to access builds' do
         let(:project) { create(:project, :public, :repository, public_builds: false) }
         let(:role) { :guest }
@@ -900,6 +889,7 @@ RSpec.describe 'Pipeline', :js do
 
     describe 'GET /:project/-/pipelines/:id/builds' do
       before do
+        stub_feature_flags(pipeline_tabs_vue: false)
         visit builds_project_pipeline_path(project, pipeline)
       end
 
@@ -1068,15 +1058,7 @@ RSpec.describe 'Pipeline', :js do
       expect(page).to have_button('Play')
     end
 
-    it 'shows jobs tab pane as active' do
-      expect(page).to have_css('#js-tab-builds.active')
-    end
-
     context 'page tabs' do
-      before do
-        stub_feature_flags(pipeline_tabs_vue: false)
-      end
-
       it 'shows Pipeline, Jobs and DAG tabs with link' do
         expect(page).to have_link('Pipeline')
         expect(page).to have_link('Jobs')
@@ -1084,12 +1066,9 @@ RSpec.describe 'Pipeline', :js do
       end
 
       it 'shows counter in Jobs tab' do
+        skip('unskip when jobs tab is implemented with ff `pipeline_tabs_vue`')
         expect(page.find('.js-builds-counter').text).to eq(pipeline.total_size.to_s)
       end
-
-      it 'shows Jobs tab as active' do
-        expect(page).to have_css('li.js-builds-tab-link .active')
-      end
     end
 
     context 'retrying jobs' do
@@ -1147,14 +1126,14 @@ RSpec.describe 'Pipeline', :js do
   end
 
   describe 'GET /:project/-/pipelines/:id/failures' do
-    before do
-      stub_feature_flags(pipeline_tabs_vue: false)
-    end
-
     let(:pipeline) { create(:ci_pipeline, project: project, ref: 'master', sha: '1234') }
     let(:pipeline_failures_page) { failures_project_pipeline_path(project, pipeline) }
     let!(:failed_build) { create(:ci_build, :failed, pipeline: pipeline) }
 
+    before do
+      stub_feature_flags(pipeline_tabs_vue: false)
+    end
+
     subject { visit pipeline_failures_page }
 
     context 'with failed build' do
@@ -1162,13 +1141,6 @@ RSpec.describe 'Pipeline', :js do
         failed_build.trace.set('4 examples, 1 failure')
       end
 
-      it 'shows jobs tab pane as active' do
-        subject
-
-        expect(page).to have_content('Failed Jobs')
-        expect(page).to have_css('#js-tab-failures.active')
-      end
-
       it 'lists failed builds' do
         subject
 
@@ -1246,13 +1218,6 @@ RSpec.describe 'Pipeline', :js do
     end
 
     context 'when missing build logs' do
-      it 'shows jobs tab pane as active' do
-        subject
-
-        expect(page).to have_content('Failed Jobs')
-        expect(page).to have_css('#js-tab-failures.active')
-      end
-
       it 'lists failed builds' do
         subject
 
@@ -1289,11 +1254,17 @@ RSpec.describe 'Pipeline', :js do
         failed_build.update!(status: :success)
       end
 
+      it 'does not show the failure tab' do
+        skip('unskip when the failure tab has been implemented in ff `pipeline_tabs_vue`')
+        subject
+
+        expect(page).not_to have_content('Failed Jobs')
+      end
+
       it 'displays the pipeline graph' do
         subject
 
         expect(page).to have_current_path(pipeline_path(pipeline), ignore_query: true)
-        expect(page).not_to have_content('Failed Jobs')
         expect(page).to have_selector('.js-pipeline-graph')
       end
     end
@@ -1307,27 +1278,14 @@ RSpec.describe 'Pipeline', :js do
     let(:pipeline) { create(:ci_pipeline, project: project, ref: 'master', sha: project.commit.id) }
 
     before do
-      stub_feature_flags(pipeline_tabs_vue: false)
       visit dag_project_pipeline_path(project, pipeline)
     end
 
-    it 'shows DAG tab pane as active' do
-      expect(page).to have_css('#js-tab-dag.active', visible: false)
-    end
-
     context 'page tabs' do
       it 'shows Pipeline, Jobs and DAG tabs with link' do
         expect(page).to have_link('Pipeline')
         expect(page).to have_link('Jobs')
-        expect(page).to have_link('DAG')
-      end
-
-      it 'shows counter in Jobs tab' do
-        expect(page.find('.js-builds-counter').text).to eq(pipeline.total_size.to_s)
-      end
-
-      it 'shows DAG tab as active' do
-        expect(page).to have_css('li.js-dag-tab-link .active')
+        expect(page).to have_link('Needs')
       end
     end
   end
diff --git a/spec/features/projects/pipelines/pipelines_spec.rb b/spec/features/projects/pipelines/pipelines_spec.rb
index 99ecb5efe2f..a18bf7c5caf 100644
--- a/spec/features/projects/pipelines/pipelines_spec.rb
+++ b/spec/features/projects/pipelines/pipelines_spec.rb
@@ -623,7 +623,6 @@ RSpec.describe 'Pipelines', :js do
 
         create(:generic_commit_status, pipeline: pipeline, stage: 'external', name: 'jenkins', stage_idx: 3, ref: 'master')
 
-        stub_feature_flags(pipeline_tabs_vue: false)
         visit project_pipeline_path(project, pipeline)
         wait_for_requests
       end
diff --git a/spec/features/user_sorts_things_spec.rb b/spec/features/user_sorts_things_spec.rb
index 9cff08c7f29..bcf3defe9c6 100644
--- a/spec/features/user_sorts_things_spec.rb
+++ b/spec/features/user_sorts_things_spec.rb
@@ -6,7 +6,7 @@ require "spec_helper"
 # to check if the sorting option set by user is being kept persisted while going through pages.
 # The `it`s are named here by convention `starting point -> some pages -> final point`.
 # All those specs are moved out to this spec intentionally to keep them all in one place.
-RSpec.describe "User sorts things" do
+RSpec.describe "User sorts things", :js do
   include Spec::Support::Helpers::Features::SortingHelpers
   include DashboardHelper
 
@@ -22,12 +22,12 @@ RSpec.describe "User sorts things" do
     sign_in(current_user)
   end
 
-  it "issues -> project home page -> issues", :js do
-    sort_option = 'Updated date'
+  it "issues -> project home page -> issues" do
+    sort_option = s_('SortOptions|Updated date')
 
     visit(project_issues_path(project))
 
-    click_button 'Created date'
+    click_button s_('SortOptions|Created date')
     click_button sort_option
 
     visit(project_path(project))
@@ -37,11 +37,11 @@ RSpec.describe "User sorts things" do
   end
 
   it "merge requests -> dashboard merge requests" do
-    sort_option = 'Updated date'
+    sort_option = s_('SortOptions|Updated date')
 
     visit(project_merge_requests_path(project))
 
-    sort_by(sort_option)
+    pajamas_sort_by(sort_option)
 
     visit(assigned_mrs_dashboard_path)