Add latest changes from gitlab-org/gitlab@master

16 files changed, 292 insertions, 207 deletions

diff --git a/spec/components/pajamas/alert_component_spec.rb b/spec/components/pajamas/alert_component_spec.rb
index 1e2845c44a8..c60724c7b78 100644
--- a/spec/components/pajamas/alert_component_spec.rb
+++ b/spec/components/pajamas/alert_component_spec.rb
@@ -14,11 +14,11 @@ RSpec.describe Pajamas::AlertComponent, :aggregate_failures, type: :component do
     end
 
     it 'renders alert body' do
-      expect(rendered_component).to have_content(body)
+      expect(page).to have_content(body)
     end
 
     it 'renders actions' do
-      expect(rendered_component).to have_content(actions)
+      expect(page).to have_content(actions)
     end
   end
 
@@ -28,20 +28,20 @@ RSpec.describe Pajamas::AlertComponent, :aggregate_failures, type: :component do
     end
 
     it 'does not set a title' do
-      expect(rendered_component).not_to have_selector('.gl-alert-title')
-      expect(rendered_component).to have_selector('.gl-alert-icon-no-title')
+      expect(page).not_to have_selector('.gl-alert-title')
+      expect(page).to have_selector('.gl-alert-icon-no-title')
     end
 
     it 'renders the default variant' do
-      expect(rendered_component).to have_selector('.gl-alert-info')
-      expect(rendered_component).to have_selector("[data-testid='information-o-icon']")
-      expect(rendered_component).not_to have_selector('.gl-alert-no-icon')
+      expect(page).to have_selector('.gl-alert-info')
+      expect(page).to have_selector("[data-testid='information-o-icon']")
+      expect(page).not_to have_selector('.gl-alert-no-icon')
     end
 
     it 'renders a dismiss button' do
-      expect(rendered_component).to have_selector('.gl-dismiss-btn.js-close')
-      expect(rendered_component).to have_selector("[data-testid='close-icon']")
-      expect(rendered_component).not_to have_selector('.gl-alert-not-dismissible')
+      expect(page).to have_selector('.gl-dismiss-btn.js-close')
+      expect(page).to have_selector("[data-testid='close-icon']")
+      expect(page).not_to have_selector('.gl-alert-not-dismissible')
     end
   end
 
@@ -61,17 +61,17 @@ RSpec.describe Pajamas::AlertComponent, :aggregate_failures, type: :component do
       end
 
       it 'sets the title' do
-        expect(rendered_component).to have_selector('.gl-alert-title')
-        expect(rendered_component).to have_content('_title_')
-        expect(rendered_component).not_to have_selector('.gl-alert-icon-no-title')
+        expect(page).to have_selector('.gl-alert-title')
+        expect(page).to have_content('_title_')
+        expect(page).not_to have_selector('.gl-alert-icon-no-title')
       end
 
       it 'sets the alert_class' do
-        expect(rendered_component).to have_selector('._alert_class_')
+        expect(page).to have_selector('._alert_class_')
       end
 
       it 'sets the alert_data' do
-        expect(rendered_component).to have_selector('[data-feature-id="_feature_id_"][data-dismiss-endpoint="_dismiss_endpoint_"]')
+        expect(page).to have_selector('[data-feature-id="_feature_id_"][data-dismiss-endpoint="_dismiss_endpoint_"]')
       end
     end
 
@@ -81,12 +81,12 @@ RSpec.describe Pajamas::AlertComponent, :aggregate_failures, type: :component do
       end
 
       it 'has the "not dismissible" class' do
-        expect(rendered_component).to have_selector('.gl-alert-not-dismissible')
+        expect(page).to have_selector('.gl-alert-not-dismissible')
       end
 
       it 'does not render the dismiss button' do
-        expect(rendered_component).not_to have_selector('.gl-dismiss-btn.js-close')
-        expect(rendered_component).not_to have_selector("[data-testid='close-icon']")
+        expect(page).not_to have_selector('.gl-dismiss-btn.js-close')
+        expect(page).not_to have_selector("[data-testid='close-icon']")
       end
     end
 
@@ -96,12 +96,12 @@ RSpec.describe Pajamas::AlertComponent, :aggregate_failures, type: :component do
       end
 
       it 'has the hidden icon class' do
-        expect(rendered_component).to have_selector('.gl-alert-no-icon')
+        expect(page).to have_selector('.gl-alert-no-icon')
       end
 
       it 'does not render the icon' do
-        expect(rendered_component).not_to have_selector('.gl-alert-icon')
-        expect(rendered_component).not_to have_selector("[data-testid='information-o-icon']")
+        expect(page).not_to have_selector('.gl-alert-icon')
+        expect(page).not_to have_selector("[data-testid='information-o-icon']")
       end
     end
 
@@ -118,13 +118,13 @@ RSpec.describe Pajamas::AlertComponent, :aggregate_failures, type: :component do
       end
 
       it 'does not have "not dismissible" class' do
-        expect(rendered_component).not_to have_selector('.gl-alert-not-dismissible')
+        expect(page).not_to have_selector('.gl-alert-not-dismissible')
       end
 
       it 'renders a dismiss button and data' do
-        expect(rendered_component).to have_selector('.gl-dismiss-btn.js-close._close_button_class_')
-        expect(rendered_component).to have_selector("[data-testid='close-icon']")
-        expect(rendered_component).to have_selector('[data-testid="_close_button_testid_"]')
+        expect(page).to have_selector('.gl-dismiss-btn.js-close._close_button_class_')
+        expect(page).to have_selector("[data-testid='close-icon']")
+        expect(page).to have_selector('[data-testid="_close_button_testid_"]')
       end
     end
 
@@ -137,8 +137,8 @@ RSpec.describe Pajamas::AlertComponent, :aggregate_failures, type: :component do
 
       with_them do
         it 'renders the variant' do
-          expect(rendered_component).to have_selector(".gl-alert-#{variant}")
-          expect(rendered_component).to have_selector("[data-testid='#{described_class::ICONS[variant]}-icon']")
+          expect(page).to have_selector(".gl-alert-#{variant}")
+          expect(page).to have_selector("[data-testid='#{described_class::ICONS[variant]}-icon']")
         end
       end
     end
diff --git a/spec/components/pajamas/banner_component_spec.rb b/spec/components/pajamas/banner_component_spec.rb
index 5969f06dbad..26468d80c77 100644
--- a/spec/components/pajamas/banner_component_spec.rb
+++ b/spec/components/pajamas/banner_component_spec.rb
@@ -19,22 +19,22 @@ RSpec.describe Pajamas::BannerComponent, type: :component do
     end
 
     it 'renders its content' do
-      expect(rendered_component).to have_text content
+      expect(page).to have_text content
     end
 
     it 'renders its title' do
-      expect(rendered_component).to have_css "h1[class='gl-banner-title']", text: title
+      expect(page).to have_css "h1[class='gl-banner-title']", text: title
     end
 
     it 'renders a close button' do
-      expect(rendered_component).to have_css "button.gl-banner-close"
+      expect(page).to have_css "button.gl-banner-close"
     end
 
     describe 'button_text and button_link' do
       let(:options) { { button_text: 'Learn more', button_link: '/learn-more' } }
 
       it 'define the primary action' do
-        expect(rendered_component).to have_css "a.btn-confirm.gl-button[href='/learn-more']", text: 'Learn more'
+        expect(page).to have_css "a.btn-confirm.gl-button[href='/learn-more']", text: 'Learn more'
       end
     end
 
@@ -42,14 +42,14 @@ RSpec.describe Pajamas::BannerComponent, type: :component do
       let(:options) { { banner_options: { class: "baz", data: { foo: "bar" } } } }
 
       it 'are on the banner' do
-        expect(rendered_component).to have_css ".gl-banner.baz[data-foo='bar']"
+        expect(page).to have_css ".gl-banner.baz[data-foo='bar']"
       end
 
       context 'with custom classes' do
         let(:options) { { variant: :introduction, banner_options: { class: 'extra special' } } }
 
         it 'don\'t conflict with internal banner_classes' do
-          expect(rendered_component).to have_css '.extra.special.gl-banner-introduction.gl-banner'
+          expect(page).to have_css '.extra.special.gl-banner-introduction.gl-banner'
         end
       end
     end
@@ -58,14 +58,14 @@ RSpec.describe Pajamas::BannerComponent, type: :component do
       let(:options) { { close_options: { class: "js-foo", data: { uid: "123" } } } }
 
       it 'are on the close button' do
-        expect(rendered_component).to have_css "button.gl-banner-close.js-foo[data-uid='123']"
+        expect(page).to have_css "button.gl-banner-close.js-foo[data-uid='123']"
       end
     end
 
     describe 'embedded' do
       context 'by default (false)' do
         it 'keeps the banner\'s borders' do
-          expect(rendered_component).not_to have_css ".gl-banner.gl-border-none"
+          expect(page).not_to have_css ".gl-banner.gl-border-none"
         end
       end
 
@@ -73,7 +73,7 @@ RSpec.describe Pajamas::BannerComponent, type: :component do
         let(:options) { { embedded: true } }
 
         it 'removes the banner\'s borders' do
-          expect(rendered_component).to have_css ".gl-banner.gl-border-none"
+          expect(page).to have_css ".gl-banner.gl-border-none"
         end
       end
     end
@@ -81,7 +81,7 @@ RSpec.describe Pajamas::BannerComponent, type: :component do
     describe 'variant' do
       context 'by default (promotion)' do
         it 'applies no variant class' do
-          expect(rendered_component).to have_css "[class='gl-banner']"
+          expect(page).to have_css "[class='gl-banner']"
         end
       end
 
@@ -89,11 +89,11 @@ RSpec.describe Pajamas::BannerComponent, type: :component do
         let(:options) { { variant: :introduction } }
 
         it "applies the introduction class to the banner" do
-          expect(rendered_component).to have_css ".gl-banner.gl-banner-introduction"
+          expect(page).to have_css ".gl-banner.gl-banner-introduction"
         end
 
         it "applies the confirm class to the close button" do
-          expect(rendered_component).to have_css ".gl-banner-close.btn-confirm.btn-confirm-tertiary"
+          expect(page).to have_css ".gl-banner-close.btn-confirm.btn-confirm-tertiary"
         end
       end
 
@@ -101,21 +101,21 @@ RSpec.describe Pajamas::BannerComponent, type: :component do
         let(:options) { { variant: :foobar } }
 
         it 'ignores the unknown variant' do
-          expect(rendered_component).to have_css "[class='gl-banner']"
+          expect(page).to have_css "[class='gl-banner']"
         end
       end
     end
 
     describe 'illustration' do
       it 'has none by default' do
-        expect(rendered_component).not_to have_css ".gl-banner-illustration"
+        expect(page).not_to have_css ".gl-banner-illustration"
       end
 
       context 'with svg_path' do
         let(:options) { { svg_path: 'logo.svg' } }
 
         it 'renders an image as illustration' do
-          expect(rendered_component).to have_css ".gl-banner-illustration img"
+          expect(page).to have_css ".gl-banner-illustration img"
         end
       end
     end
@@ -131,15 +131,15 @@ RSpec.describe Pajamas::BannerComponent, type: :component do
     end
 
     it 'renders the slot content as illustration' do
-      expect(rendered_component).to have_css ".gl-banner-illustration svg"
+      expect(page).to have_css ".gl-banner-illustration svg"
     end
 
     context 'and conflicting svg_path' do
       let(:options) { { svg_path: 'logo.svg' } }
 
       it 'uses the slot content' do
-        expect(rendered_component).to have_css ".gl-banner-illustration svg"
-        expect(rendered_component).not_to have_css ".gl-banner-illustration img"
+        expect(page).to have_css ".gl-banner-illustration svg"
+        expect(page).not_to have_css ".gl-banner-illustration img"
       end
     end
   end
@@ -154,15 +154,15 @@ RSpec.describe Pajamas::BannerComponent, type: :component do
     end
 
     it 'renders the slot content as the primary action' do
-      expect(rendered_component).to have_css "a.special", text: 'Special'
+      expect(page).to have_css "a.special", text: 'Special'
     end
 
     context 'and conflicting button_text and button_link' do
       let(:options) { { button_text: 'Not special', button_link: '/' } }
 
       it 'uses the slot content' do
-        expect(rendered_component).to have_css "a.special[href='#']", text: 'Special'
-        expect(rendered_component).not_to have_css "a.btn[href='/']"
+        expect(page).to have_css "a.special[href='#']", text: 'Special'
+        expect(page).not_to have_css "a.btn[href='/']"
       end
     end
   end
diff --git a/spec/components/pajamas/button_component_spec.rb b/spec/components/pajamas/button_component_spec.rb
index 60c2a2e5a06..a8c96042580 100644
--- a/spec/components/pajamas/button_component_spec.rb
+++ b/spec/components/pajamas/button_component_spec.rb
@@ -17,25 +17,25 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
     end
 
     it 'renders its content' do
-      expect(rendered_component).to have_text content
+      expect(page).to have_text content
     end
 
     it 'adds default styling' do
-      expect(rendered_component).to have_css ".btn.btn-default.btn-md.gl-button"
+      expect(page).to have_css ".btn.btn-default.btn-md.gl-button"
     end
 
     describe 'button_options' do
       let(:options) { { button_options: { id: 'baz', data: { foo: 'bar' } } } }
 
       it 'are added to the button' do
-        expect(rendered_component).to have_css ".gl-button#baz[data-foo='bar']"
+        expect(page).to have_css ".gl-button#baz[data-foo='bar']"
       end
 
       context 'with custom classes' do
         let(:options) { { variant: :danger, category: :tertiary, button_options: { class: 'custom-class' } } }
 
         it 'don\'t conflict with internal button_classes' do
-          expect(rendered_component).to have_css '.gl-button.btn-danger.btn-danger-tertiary.custom-class'
+          expect(page).to have_css '.gl-button.btn-danger.btn-danger-tertiary.custom-class'
         end
       end
 
@@ -43,7 +43,7 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
         let(:options) { { button_options: { type: 'submit' } } }
 
         it 'overrides type' do
-          expect(rendered_component).to have_css '[type="submit"]'
+          expect(page).to have_css '[type="submit"]'
         end
       end
     end
@@ -52,14 +52,14 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
       let(:options) { { button_text_classes: 'custom-text-class' } }
 
       it 'is added to the button text' do
-        expect(rendered_component).to have_css ".gl-button-text.custom-text-class"
+        expect(page).to have_css ".gl-button-text.custom-text-class"
       end
     end
 
     describe 'disabled' do
       context 'by default (false)' do
         it 'does not have  disabled styling and behavior' do
-          expect(rendered_component).not_to have_css ".disabled[disabled='disabled'][aria-disabled='true']"
+          expect(page).not_to have_css ".disabled[disabled='disabled'][aria-disabled='true']"
         end
       end
 
@@ -67,7 +67,7 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
         let(:options) { { disabled: true } }
 
         it 'has disabled styling and behavior' do
-          expect(rendered_component).to have_css ".disabled[disabled='disabled'][aria-disabled='true']"
+          expect(page).to have_css ".disabled[disabled='disabled'][aria-disabled='true']"
         end
       end
     end
@@ -75,11 +75,11 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
     describe 'loading' do
       context 'by default (false)' do
         it 'is not disabled' do
-          expect(rendered_component).not_to have_css ".disabled[disabled='disabled']"
+          expect(page).not_to have_css ".disabled[disabled='disabled']"
         end
 
         it 'does not render a spinner' do
-          expect(rendered_component).not_to have_css ".gl-spinner[aria-label='Loading']"
+          expect(page).not_to have_css ".gl-spinner[aria-label='Loading']"
         end
       end
 
@@ -87,11 +87,11 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
         let(:options) { { loading: true } }
 
         it 'is disabled' do
-          expect(rendered_component).to have_css ".disabled[disabled='disabled']"
+          expect(page).to have_css ".disabled[disabled='disabled']"
         end
 
         it 'renders a spinner' do
-          expect(rendered_component).to have_css ".gl-spinner[aria-label='Loading']"
+          expect(page).to have_css ".gl-spinner[aria-label='Loading']"
         end
       end
     end
@@ -99,7 +99,7 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
     describe 'block' do
       context 'by default (false)' do
         it 'is inline' do
-          expect(rendered_component).not_to have_css ".btn-block"
+          expect(page).not_to have_css ".btn-block"
         end
       end
 
@@ -107,7 +107,7 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
         let(:options) { { block: true } }
 
         it 'is block element' do
-          expect(rendered_component).to have_css ".btn-block"
+          expect(page).to have_css ".btn-block"
         end
       end
     end
@@ -115,7 +115,7 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
     describe 'selected' do
       context 'by default (false)' do
         it 'does not have selected styling and behavior' do
-          expect(rendered_component).not_to have_css ".selected"
+          expect(page).not_to have_css ".selected"
         end
       end
 
@@ -123,7 +123,7 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
         let(:options) { { selected: true } }
 
         it 'has selected styling and behavior' do
-          expect(rendered_component).to have_css ".selected"
+          expect(page).to have_css ".selected"
         end
       end
     end
@@ -136,8 +136,8 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
 
         with_them do
           it 'renders the button in correct variant && category' do
-            expect(rendered_component).to have_css(".#{described_class::VARIANT_CLASSES[variant]}")
-            expect(rendered_component).to have_css(".#{described_class::VARIANT_CLASSES[variant]}-tertiary")
+            expect(page).to have_css(".#{described_class::VARIANT_CLASSES[variant]}")
+            expect(page).to have_css(".#{described_class::VARIANT_CLASSES[variant]}-tertiary")
           end
         end
       end
@@ -149,8 +149,8 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
 
         with_them do
           it 'renders the button in correct variant && category' do
-            expect(rendered_component).to have_css(".#{described_class::VARIANT_CLASSES[variant]}")
-            expect(rendered_component).not_to have_css(".#{described_class::VARIANT_CLASSES[variant]}-tertiary")
+            expect(page).to have_css(".#{described_class::VARIANT_CLASSES[variant]}")
+            expect(page).not_to have_css(".#{described_class::VARIANT_CLASSES[variant]}-tertiary")
           end
         end
       end
@@ -162,8 +162,8 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
 
         with_them do
           it 'renders the button in correct variant && category' do
-            expect(rendered_component).to have_css(".#{described_class::VARIANT_CLASSES[variant]}")
-            expect(rendered_component).not_to have_css(".#{described_class::VARIANT_CLASSES[variant]}-primary")
+            expect(page).to have_css(".#{described_class::VARIANT_CLASSES[variant]}")
+            expect(page).not_to have_css(".#{described_class::VARIANT_CLASSES[variant]}-primary")
           end
         end
       end
@@ -172,7 +172,7 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
     describe 'size' do
       context 'by default (medium)' do
         it 'applies medium class' do
-          expect(rendered_component).to have_css ".btn-md"
+          expect(page).to have_css ".btn-md"
         end
       end
 
@@ -180,22 +180,22 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
         let(:options) { { size: :small } }
 
         it "applies the small class to the button" do
-          expect(rendered_component).to have_css ".btn-sm"
+          expect(page).to have_css ".btn-sm"
         end
       end
     end
 
     describe 'icon' do
       it 'has none by default' do
-        expect(rendered_component).not_to have_css ".gl-icon"
+        expect(page).not_to have_css ".gl-icon"
       end
 
       context 'with icon' do
         let(:options) { { icon: 'star-o', icon_classes: 'custom-icon' } }
 
         it 'renders an icon with custom CSS class' do
-          expect(rendered_component).to have_css "svg.gl-icon.gl-button-icon.custom-icon[data-testid='star-o-icon']"
-          expect(rendered_component).not_to have_css ".btn-icon"
+          expect(page).to have_css "svg.gl-icon.gl-button-icon.custom-icon[data-testid='star-o-icon']"
+          expect(page).not_to have_css ".btn-icon"
         end
       end
 
@@ -204,7 +204,7 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
         let(:options) { { icon: 'star-o' } }
 
         it 'adds a "btn-icon" CSS class' do
-          expect(rendered_component).to have_css ".btn.btn-icon"
+          expect(page).to have_css ".btn.btn-icon"
         end
       end
 
@@ -213,8 +213,8 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
         let(:options) { { icon: 'star-o', loading: true } }
 
         it 'renders only a loading icon' do
-          expect(rendered_component).not_to have_css "svg.gl-icon.gl-button-icon.custom-icon[data-testid='star-o-icon']"
-          expect(rendered_component).to have_css ".gl-spinner[aria-label='Loading']"
+          expect(page).not_to have_css "svg.gl-icon.gl-button-icon.custom-icon[data-testid='star-o-icon']"
+          expect(page).to have_css ".gl-spinner[aria-label='Loading']"
         end
       end
     end
@@ -222,7 +222,7 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
     describe 'type' do
       context 'by default (without href)' do
         it 'has type "button"' do
-          expect(rendered_component).to have_css "button[type='button']"
+          expect(page).to have_css "button[type='button']"
         end
       end
 
@@ -233,7 +233,7 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
 
         with_them do
           it 'has the correct type' do
-            expect(rendered_component).to have_css "button[type='#{type}']"
+            expect(page).to have_css "button[type='#{type}']"
           end
         end
       end
@@ -242,7 +242,7 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
         let(:options) { { type: :madeup } }
 
         it 'has type "button"' do
-          expect(rendered_component).to have_css "button[type='button']"
+          expect(page).to have_css "button[type='button']"
         end
       end
 
@@ -250,22 +250,22 @@ RSpec.describe Pajamas::ButtonComponent, type: :component do
         let(:options) { { href: 'https://example.com', type: :reset } }
 
         it 'ignores type' do
-          expect(rendered_component).not_to have_css "[type]"
+          expect(page).not_to have_css "[type]"
         end
       end
     end
 
     describe 'link button' do
       it 'renders a button tag with type="button" when "href" is not set' do
-        expect(rendered_component).to have_css "button[type='button']"
+        expect(page).to have_css "button[type='button']"
       end
 
       context 'when "href" is provided' do
         let(:options) { { href: 'https://gitlab.com', target: '_blank' } }
 
         it "renders a link instead of the button" do
-          expect(rendered_component).not_to have_css "button[type='button']"
-          expect(rendered_component).to have_css "a[href='https://gitlab.com'][target='_blank']"
+          expect(page).not_to have_css "button[type='button']"
+          expect(page).to have_css "a[href='https://gitlab.com'][target='_blank']"
         end
       end
     end
diff --git a/spec/components/pajamas/card_component_spec.rb b/spec/components/pajamas/card_component_spec.rb
index 65522a9023f..38d23cfca9c 100644
--- a/spec/components/pajamas/card_component_spec.rb
+++ b/spec/components/pajamas/card_component_spec.rb
@@ -16,15 +16,15 @@ RSpec.describe Pajamas::CardComponent, :aggregate_failures, type: :component do
     end
 
     it 'renders card header' do
-      expect(rendered_component).to have_content(header)
+      expect(page).to have_content(header)
     end
 
     it 'renders card body' do
-      expect(rendered_component).to have_content(body)
+      expect(page).to have_content(body)
     end
 
     it 'renders footer' do
-      expect(rendered_component).to have_content(footer)
+      expect(page).to have_content(footer)
     end
   end
 
@@ -34,13 +34,13 @@ RSpec.describe Pajamas::CardComponent, :aggregate_failures, type: :component do
     end
 
     it 'does not have a header or footer' do
-      expect(rendered_component).not_to have_selector('.gl-card-header')
-      expect(rendered_component).not_to have_selector('.gl-card-footer')
+      expect(page).not_to have_selector('.gl-card-header')
+      expect(page).not_to have_selector('.gl-card-footer')
     end
 
     it 'renders the card and body' do
-      expect(rendered_component).to have_selector('.gl-card')
-      expect(rendered_component).to have_selector('.gl-card-body')
+      expect(page).to have_selector('.gl-card')
+      expect(page).to have_selector('.gl-card-body')
     end
   end
 
@@ -58,23 +58,23 @@ RSpec.describe Pajamas::CardComponent, :aggregate_failures, type: :component do
     end
 
     it 'renders card options' do
-      expect(rendered_component).to have_selector('._card_class_')
-      expect(rendered_component).to have_selector('[data-testid="_card_testid_"]')
+      expect(page).to have_selector('._card_class_')
+      expect(page).to have_selector('[data-testid="_card_testid_"]')
     end
 
     it 'renders header options' do
-      expect(rendered_component).to have_selector('._header_class_')
-      expect(rendered_component).to have_selector('[data-testid="_header_testid_"]')
+      expect(page).to have_selector('._header_class_')
+      expect(page).to have_selector('[data-testid="_header_testid_"]')
     end
 
     it 'renders body options' do
-      expect(rendered_component).to have_selector('._body_class_')
-      expect(rendered_component).to have_selector('[data-testid="_body_testid_"]')
+      expect(page).to have_selector('._body_class_')
+      expect(page).to have_selector('[data-testid="_body_testid_"]')
     end
 
     it 'renders footer options' do
-      expect(rendered_component).to have_selector('._footer_class_')
-      expect(rendered_component).to have_selector('[data-testid="_footer_testid_"]')
+      expect(page).to have_selector('._footer_class_')
+      expect(page).to have_selector('[data-testid="_footer_testid_"]')
     end
   end
 end
diff --git a/spec/components/pajamas/checkbox_component_spec.rb b/spec/components/pajamas/checkbox_component_spec.rb
index b2f3a84fbfe..d79c537a30e 100644
--- a/spec/components/pajamas/checkbox_component_spec.rb
+++ b/spec/components/pajamas/checkbox_component_spec.rb
@@ -10,7 +10,7 @@ RSpec.describe Pajamas::CheckboxComponent, :aggregate_failures, type: :component
 
   RSpec.shared_examples 'it renders unchecked checkbox with value of `1`' do
     it 'renders unchecked checkbox with value of `1`' do
-      expect(rendered_component).to have_unchecked_field(label, with: '1')
+      expect(page).to have_unchecked_field(label, with: '1')
     end
   end
 
@@ -31,7 +31,7 @@ RSpec.describe Pajamas::CheckboxComponent, :aggregate_failures, type: :component
     include_examples 'it does not render help text'
 
     it 'renders hidden input with value of `0`' do
-      expect(rendered_component).to have_field('user[view_diffs_file_by_file]', type: 'hidden', with: '0')
+      expect(page).to have_field('user[view_diffs_file_by_file]', type: 'hidden', with: '0')
     end
   end
 
@@ -61,15 +61,15 @@ RSpec.describe Pajamas::CheckboxComponent, :aggregate_failures, type: :component
     include_examples 'it renders help text'
 
     it 'renders checked checkbox with value of `yes`' do
-      expect(rendered_component).to have_checked_field(label, with: checked_value, class: checkbox_options[:class])
+      expect(page).to have_checked_field(label, with: checked_value, class: checkbox_options[:class])
     end
 
     it 'adds CSS class to label' do
-      expect(rendered_component).to have_selector('label.label-foo-bar')
+      expect(page).to have_selector('label.label-foo-bar')
     end
 
     it 'renders hidden input with value of `no`' do
-      expect(rendered_component).to have_field('user[view_diffs_file_by_file]', type: 'hidden', with: unchecked_value)
+      expect(page).to have_field('user[view_diffs_file_by_file]', type: 'hidden', with: unchecked_value)
     end
   end
 
diff --git a/spec/components/pajamas/radio_component_spec.rb b/spec/components/pajamas/radio_component_spec.rb
index 3885d101c7a..8df432746d0 100644
--- a/spec/components/pajamas/radio_component_spec.rb
+++ b/spec/components/pajamas/radio_component_spec.rb
@@ -13,7 +13,7 @@ RSpec.describe Pajamas::RadioComponent, :aggregate_failures, type: :component do
 
   RSpec.shared_examples 'it renders unchecked radio' do
     it 'renders unchecked radio' do
-      expect(rendered_component).to have_unchecked_field(label)
+      expect(page).to have_unchecked_field(label)
     end
   end
 
@@ -58,11 +58,11 @@ RSpec.describe Pajamas::RadioComponent, :aggregate_failures, type: :component do
     include_examples 'it renders help text'
 
     it 'renders checked radio' do
-      expect(rendered_component).to have_checked_field(label, class: radio_options[:class])
+      expect(page).to have_checked_field(label, class: radio_options[:class])
     end
 
     it 'adds CSS class to label' do
-      expect(rendered_component).to have_selector('label.label-foo-bar')
+      expect(page).to have_selector('label.label-foo-bar')
     end
   end
 
diff --git a/spec/components/pajamas/spinner_component_spec.rb b/spec/components/pajamas/spinner_component_spec.rb
new file mode 100644
index 00000000000..9aac9a0085c
--- /dev/null
+++ b/spec/components/pajamas/spinner_component_spec.rb
@@ -0,0 +1,74 @@
+# frozen_string_literal: true
+require "spec_helper"
+
+RSpec.describe Pajamas::SpinnerComponent, type: :component do
+  let(:options) { {} }
+
+  before do
+    render_inline(described_class.new(**options))
+  end
+
+  describe 'class' do
+    let(:options) { { class: 'gl-my-6' } }
+
+    it 'has the correct custom class' do
+      expect(page).to have_css '.gl-spinner-container.gl-my-6'
+    end
+  end
+
+  describe 'color' do
+    context 'by default' do
+      it 'is dark' do
+        expect(page).to have_css '.gl-spinner.gl-spinner-dark'
+      end
+    end
+
+    context 'set to light' do
+      let(:options) { { color: :light } }
+
+      it 'is light' do
+        expect(page).to have_css '.gl-spinner.gl-spinner-light'
+      end
+    end
+  end
+
+  describe 'inline' do
+    context 'by default' do
+      it 'renders a div' do
+        expect(page).to have_css 'div.gl-spinner'
+      end
+    end
+
+    context 'set to true' do
+      let(:options) { { inline: true } }
+
+      it 'renders a span' do
+        expect(page).to have_css 'span.gl-spinner'
+      end
+    end
+  end
+
+  describe 'label' do
+    context 'by default' do
+      it 'has "Loading" as aria-label' do
+        expect(page).to have_css '.gl-spinner[aria-label="Loading"]'
+      end
+    end
+
+    context 'when set to something else' do
+      let(:options) { { label: "Sending" } }
+
+      it 'has a custom aria-label' do
+        expect(page).to have_css '.gl-spinner[aria-label="Sending"]'
+      end
+    end
+  end
+
+  describe 'size' do
+    let(:options) { { size: :lg } }
+
+    it 'has the correct size class' do
+      expect(page).to have_css '.gl-spinner.gl-spinner-lg'
+    end
+  end
+end
diff --git a/spec/components/pajamas/toggle_component_spec.rb b/spec/components/pajamas/toggle_component_spec.rb
index b2727dec318..6b0a2d26979 100644
--- a/spec/components/pajamas/toggle_component_spec.rb
+++ b/spec/components/pajamas/toggle_component_spec.rb
@@ -8,31 +8,31 @@ RSpec.describe Pajamas::ToggleComponent, type: :component do
     end
 
     it 'renders a toggle container with provided class' do
-      expect(rendered_component).to have_selector "[class='js-feature-toggle']"
+      expect(page).to have_selector "[class='js-feature-toggle']"
     end
 
     it 'does not set a name' do
-      expect(rendered_component).not_to have_selector('[data-name]')
+      expect(page).not_to have_selector('[data-name]')
     end
 
     it 'sets default is-checked attributes' do
-      expect(rendered_component).to have_selector('[data-is-checked="false"]')
+      expect(page).to have_selector('[data-is-checked="false"]')
     end
 
     it 'sets default disabled attributes' do
-      expect(rendered_component).to have_selector('[data-disabled="false"]')
+      expect(page).to have_selector('[data-disabled="false"]')
     end
 
     it 'sets default is-loading attributes' do
-      expect(rendered_component).to have_selector('[data-is-loading="false"]')
+      expect(page).to have_selector('[data-is-loading="false"]')
     end
 
     it 'does not set a label' do
-      expect(rendered_component).not_to have_selector('[data-label]')
+      expect(page).not_to have_selector('[data-label]')
     end
 
     it 'does not set a label position' do
-      expect(rendered_component).not_to have_selector('[data-label-position]')
+      expect(page).not_to have_selector('[data-label-position]')
     end
   end
 
@@ -52,35 +52,35 @@ RSpec.describe Pajamas::ToggleComponent, type: :component do
     end
 
     it 'sets the custom class' do
-      expect(rendered_component).to have_selector('.js-custom-gl-toggle')
+      expect(page).to have_selector('.js-custom-gl-toggle')
     end
 
     it 'sets the custom name' do
-      expect(rendered_component).to have_selector('[data-name="toggle-name"]')
+      expect(page).to have_selector('[data-name="toggle-name"]')
     end
 
     it 'sets the custom is-checked attributes' do
-      expect(rendered_component).to have_selector('[data-is-checked="true"]')
+      expect(page).to have_selector('[data-is-checked="true"]')
     end
 
     it 'sets the custom disabled attributes' do
-      expect(rendered_component).to have_selector('[data-disabled="true"]')
+      expect(page).to have_selector('[data-disabled="true"]')
     end
 
     it 'sets the custom is-loading attributes' do
-      expect(rendered_component).to have_selector('[data-is-loading="true"]')
+      expect(page).to have_selector('[data-is-loading="true"]')
     end
 
     it 'sets the custom label' do
-      expect(rendered_component).to have_selector('[data-label="Custom label"]')
+      expect(page).to have_selector('[data-label="Custom label"]')
     end
 
     it 'sets the custom label position' do
-      expect(rendered_component).to have_selector('[data-label-position="top"]')
+      expect(page).to have_selector('[data-label-position="top"]')
     end
 
     it 'sets custom data attributes' do
-      expect(rendered_component).to have_selector('[data-foo="bar"]')
+      expect(page).to have_selector('[data-foo="bar"]')
     end
   end
 
@@ -101,7 +101,7 @@ RSpec.describe Pajamas::ToggleComponent, type: :component do
     end
 
     with_them do
-      it { expect(rendered_component).to have_selector("[data-label-position='#{position}']", count: count) }
+      it { expect(page).to have_selector("[data-label-position='#{position}']", count: count) }
     end
   end
 end
diff --git a/spec/controllers/projects/jobs_controller_spec.rb b/spec/controllers/projects/jobs_controller_spec.rb
index 107eb1ed3a3..e4e3151dd12 100644
--- a/spec/controllers/projects/jobs_controller_spec.rb
+++ b/spec/controllers/projects/jobs_controller_spec.rb
@@ -752,28 +752,6 @@ RSpec.describe Projects::JobsController, :clean_gitlab_redis_shared_state do
     end
   end
 
-  describe 'GET status.json' do
-    let(:job) { create(:ci_build, pipeline: pipeline) }
-    let(:status) { job.detailed_status(double('user')) }
-
-    before do
-      get :status, params: {
-                     namespace_id: project.namespace,
-                     project_id: project,
-                     id: job.id
-                   },
-                   format: :json
-    end
-
-    it 'return a detailed job status in json' do
-      expect(response).to have_gitlab_http_status(:ok)
-      expect(json_response['text']).to eq status.text
-      expect(json_response['label']).to eq status.label
-      expect(json_response['icon']).to eq status.icon
-      expect(json_response['favicon']).to match_asset_path "/assets/ci_favicons/#{status.favicon}.png"
-    end
-  end
-
   describe 'POST retry' do
     before do
       project.add_developer(user)
diff --git a/spec/features/projects/jobs_spec.rb b/spec/features/projects/jobs_spec.rb
index f0d41c1dd11..779d8e41a7b 100644
--- a/spec/features/projects/jobs_spec.rb
+++ b/spec/features/projects/jobs_spec.rb
@@ -1207,22 +1207,4 @@ RSpec.describe 'Jobs', :clean_gitlab_redis_shared_state do
       it { expect(page.status_code).to eq(404) }
     end
   end
-
-  describe "GET /:project/jobs/:id/status" do
-    context "Job from project" do
-      before do
-        visit status_project_job_path(project, job)
-      end
-
-      it { expect(page.status_code).to eq(200) }
-    end
-
-    context "Job from other project" do
-      before do
-        visit status_project_job_path(project, job2)
-      end
-
-      it { expect(page.status_code).to eq(404) }
-    end
-  end
 end
diff --git a/spec/fixtures/csv_complex.csv b/spec/fixtures/csv_complex.csv
new file mode 100644
index 00000000000..60d8aa5d6f7
--- /dev/null
+++ b/spec/fixtures/csv_complex.csv
@@ -0,0 +1,6 @@
+title,description,due date
+Issue in 中文,Test description,
+"Hello","World",
+"Title with quote""","Description
+/assign @csv_assignee
+/estimate 1h",2022-06-28
diff --git a/spec/lib/bulk_imports/groups/transformers/group_attributes_transformer_spec.rb b/spec/lib/bulk_imports/groups/transformers/group_attributes_transformer_spec.rb
index c42ca9bef3b..d775cf6b026 100644
--- a/spec/lib/bulk_imports/groups/transformers/group_attributes_transformer_spec.rb
+++ b/spec/lib/bulk_imports/groups/transformers/group_attributes_transformer_spec.rb
@@ -4,12 +4,12 @@ require 'spec_helper'
 
 RSpec.describe BulkImports::Groups::Transformers::GroupAttributesTransformer do
   describe '#transform' do
-    let_it_be(:user) { create(:user) }
     let_it_be(:parent) { create(:group) }
-    let_it_be(:bulk_import) { create(:bulk_import, user: user) }
 
-    let_it_be(:entity) do
-      create(
+    let(:bulk_import) { build_stubbed(:bulk_import) }
+
+    let(:entity) do
+      build_stubbed(
         :bulk_import_entity,
         bulk_import: bulk_import,
         source_full_path: 'source/full/path',
@@ -18,8 +18,8 @@ RSpec.describe BulkImports::Groups::Transformers::GroupAttributesTransformer do
       )
     end
 
-    let_it_be(:tracker) { create(:bulk_import_tracker, entity: entity) }
-    let_it_be(:context) { BulkImports::Pipeline::Context.new(tracker) }
+    let(:tracker) { build_stubbed(:bulk_import_tracker, entity: entity) }
+    let(:context) { BulkImports::Pipeline::Context.new(tracker) }
 
     let(:data) do
       {
@@ -87,14 +87,63 @@ RSpec.describe BulkImports::Groups::Transformers::GroupAttributesTransformer do
       end
 
       context 'when destination namespace is empty' do
-        it 'does not set parent id' do
-          entity.update!(destination_namespace: '')
+        before do
+          entity.destination_namespace = ''
+        end
 
+        it 'does not set parent id' do
           transformed_data = subject.transform(context, data)
 
           expect(transformed_data).not_to have_key('parent_id')
         end
       end
     end
+
+    describe 'group name transformation' do
+      context 'when destination namespace is empty' do
+        before do
+          entity.destination_namespace = ''
+        end
+
+        it 'does not transform name' do
+          transformed_data = subject.transform(context, data)
+
+          expect(transformed_data['name']).to eq('Source Group Name')
+        end
+      end
+
+      context 'when destination namespace is present' do
+        context 'when destination namespace does not have a group with same name' do
+          it 'does not transform name' do
+            transformed_data = subject.transform(context, data)
+
+            expect(transformed_data['name']).to eq('Source Group Name')
+          end
+        end
+
+        context 'when destination namespace already have a group with the same name' do
+          before do
+            create(:group, parent: parent, name: 'Source Group Name', path: 'group_1')
+            create(:group, parent: parent, name: 'Source Group Name(1)', path: 'group_2')
+            create(:group, parent: parent, name: 'Source Group Name(2)', path: 'group_3')
+            create(:group, parent: parent, name: 'Source Group Name(1)(1)', path: 'group_4')
+          end
+
+          it 'makes the name unique by appeding a counter', :aggregate_failures do
+            transformed_data = subject.transform(context, data.merge('name' => 'Source Group Name'))
+            expect(transformed_data['name']).to eq('Source Group Name(3)')
+
+            transformed_data = subject.transform(context, data.merge('name' => 'Source Group Name(2)'))
+            expect(transformed_data['name']).to eq('Source Group Name(2)(1)')
+
+            transformed_data = subject.transform(context, data.merge('name' => 'Source Group Name(1)'))
+            expect(transformed_data['name']).to eq('Source Group Name(1)(2)')
+
+            transformed_data = subject.transform(context, data.merge('name' => 'Source Group Name(1)(1)'))
+            expect(transformed_data['name']).to eq('Source Group Name(1)(1)(1)')
+          end
+        end
+      end
+    end
   end
 end
diff --git a/spec/lib/gitlab/diff/rendered/notebook/diff_file_spec.rb b/spec/lib/gitlab/diff/rendered/notebook/diff_file_spec.rb
index c38684a6dc3..b5137f9db6b 100644
--- a/spec/lib/gitlab/diff/rendered/notebook/diff_file_spec.rb
+++ b/spec/lib/gitlab/diff/rendered/notebook/diff_file_spec.rb
@@ -144,7 +144,7 @@ RSpec.describe Gitlab::Diff::Rendered::Notebook::DiffFile do
 
     context 'has image' do
       it 'replaces rich text with img to the embedded image' do
-        expect(nb_file.highlighted_diff_lines[58].rich_text).to include('<img')
+        expect(nb_file.highlighted_diff_lines[56].rich_text).to include('<img')
       end
 
       it 'adds image to src' do
@@ -159,11 +159,11 @@ RSpec.describe Gitlab::Diff::Rendered::Notebook::DiffFile do
       let(:commit) { project.commit("4963fefc990451a8ad34289ce266b757456fc88c") }
 
       it 'prevents injected html to be rendered as html' do
-        expect(nb_file.highlighted_diff_lines[45].rich_text).not_to include('<div>Hello')
+        expect(nb_file.highlighted_diff_lines[43].rich_text).not_to include('<div>Hello')
       end
 
       it 'keeps the injected html as part of the string' do
-        expect(nb_file.highlighted_diff_lines[45].rich_text).to end_with('/div&gt;">')
+        expect(nb_file.highlighted_diff_lines[43].rich_text).to end_with('/div&gt;">')
       end
     end
   end
diff --git a/spec/serializers/ci/job_serializer_spec.rb b/spec/serializers/ci/job_serializer_spec.rb
index d47c9fdbf24..5f889a10f3d 100644
--- a/spec/serializers/ci/job_serializer_spec.rb
+++ b/spec/serializers/ci/job_serializer_spec.rb
@@ -28,36 +28,4 @@ RSpec.describe Ci::JobSerializer do
       end
     end
   end
-
-  describe '#represent_status' do
-    context 'for a failed build' do
-      let(:resource) { create(:ci_build, :failed) }
-      let(:status) { resource.detailed_status(double('user')) }
-
-      subject { serializer.represent_status(resource) }
-
-      it 'serializes only status' do
-        expect(subject[:text]).to eq(status.text)
-        expect(subject[:label]).to eq('failed')
-        expect(subject[:tooltip]).to eq('failed - (unknown failure)')
-        expect(subject[:icon]).to eq(status.icon)
-        expect(subject[:favicon]).to match_asset_path("/assets/ci_favicons/#{status.favicon}.png")
-      end
-    end
-
-    context 'for any other type of build' do
-      let(:resource) { create(:ci_build, :success) }
-      let(:status) { resource.detailed_status(double('user')) }
-
-      subject { serializer.represent_status(resource) }
-
-      it 'serializes only status' do
-        expect(subject[:text]).to eq(status.text)
-        expect(subject[:label]).to eq('passed')
-        expect(subject[:tooltip]).to eq('passed')
-        expect(subject[:icon]).to eq(status.icon)
-        expect(subject[:favicon]).to match_asset_path("/assets/ci_favicons/#{status.favicon}.png")
-      end
-    end
-  end
 end
diff --git a/spec/services/issues/import_csv_service_spec.rb b/spec/services/issues/import_csv_service_spec.rb
index fa40b75190f..9ad1d7dba9f 100644
--- a/spec/services/issues/import_csv_service_spec.rb
+++ b/spec/services/issues/import_csv_service_spec.rb
@@ -5,6 +5,7 @@ require 'spec_helper'
 RSpec.describe Issues::ImportCsvService do
   let(:project) { create(:project) }
   let(:user) { create(:user) }
+  let(:assignee) { create(:user, username: 'csv_assignee') }
   let(:service) do
     uploader = FileUploader.new(project)
     uploader.store!(file)
@@ -16,4 +17,27 @@ RSpec.describe Issues::ImportCsvService do
     let(:issuables) { project.issues }
     let(:email_method) { :import_issues_csv_email }
   end
+
+  describe '#execute' do
+    let(:file) { fixture_file_upload('spec/fixtures/csv_complex.csv') }
+
+    subject { service.execute }
+
+    it 'sets all issueable attributes and executes quick actions' do
+      project.add_developer(user)
+      project.add_developer(assignee)
+
+      expect { subject }.to change { issuables.count }.by 3
+
+      expect(issuables.reload).to include(
+        have_attributes(
+          title: 'Title with quote"',
+          description: 'Description',
+          time_estimate: 3600,
+          assignees: include(assignee),
+          due_date: Date.new(2022, 6, 28)
+        )
+      )
+    end
+  end
 end
diff --git a/spec/support/services/issuable_import_csv_service_shared_examples.rb b/spec/support/services/issuable_import_csv_service_shared_examples.rb
index 07118198969..0dea6cfb729 100644
--- a/spec/support/services/issuable_import_csv_service_shared_examples.rb
+++ b/spec/support/services/issuable_import_csv_service_shared_examples.rb
@@ -37,6 +37,10 @@ RSpec.shared_examples 'issuable import csv service' do |issuable_type|
   end
 
   describe '#execute' do
+    before do
+      project.add_developer(user)
+    end
+
     context 'invalid file extension' do
       let(:file) { fixture_file_upload('spec/fixtures/banana_sample.gif') }