Update specs for mini pipeline

Run specs for mini pipeline with the feature flag in both enabled and
disabled states

app/assets/javascripts/pipelines/components/pipelines_list/stage.vue

@@ -53,7 +53,7 @@ export default {
   data() {
     return {
       isLoading: false,
-      dropdownContent: '',
+      dropdownContent: [],
     };
   },
   computed: {
@@ -77,7 +77,7 @@ export default {
     },
   },
   updated() {
-    if (!this.isCiMiniPipelineGlDropdown && this.dropdownContent.length > 0) {
+    if (!this.isCiMiniPipelineGlDropdown && this.dropdownContent.length) {
       this.stopDropdownClickPropagation();
     }
   },
@@ -161,15 +161,12 @@ export default {
       v-if="isCiMiniPipelineGlDropdown"
       ref="stageGlDropdown"
       v-gl-tooltip.hover
+      data-testid="mini-pipeline-graph-dropdown"
       :title="stage.title"
       variant="link"
       :lazy="true"
       :popper-opts="{ placement: 'bottom' }"
-      :toggle-class="[
-        'mini-pipeline-graph-gl-dropdown-toggle',
-        'js-builds-dropdown-button',
-        triggerButtonClass,
-      ]"
+      :toggle-class="['mini-pipeline-graph-gl-dropdown-toggle', triggerButtonClass]"
       menu-class="mini-pipeline-graph-dropdown-menu"
       @show="onShowDropdown"
     >

ee/spec/features/merge_trains/user_adds_merge_request_to_merge_train_spec.rb

@@ -18,6 +18,7 @@ RSpec.describe 'User adds a merge request to a merge train', :js do
 
   before do
     stub_feature_flags(disable_merge_trains: false)
+    stub_feature_flags(ci_mini_pipeline_gl_dropdown: false)
     stub_licensed_features(merge_pipelines: true, merge_trains: true)
     project.add_maintainer(user)
     project.update!(merge_pipelines_enabled: true, merge_trains_enabled: true)

spec/features/merge_request/user_sees_mini_pipeline_graph_spec.rb

@@ -9,15 +9,23 @@ RSpec.describe 'Merge request < User sees mini pipeline graph', :js do
   let(:pipeline) { create(:ci_empty_pipeline, project: project, ref: 'master', status: 'running', sha: project.commit.id) }
   let(:build) { create(:ci_build, pipeline: pipeline, stage: 'test') }
 
-  dropdown_toggle_selector = '[data-testid="mini-pipeline-graph-dropdown-toggle"]'
-
+  shared_examples 'mini pipeline renders' do |ci_mini_pipeline_gl_dropdown_enabled|
     before do
       build.run
       build.trace.set('hello')
       sign_in(user)
+      stub_feature_flags(ci_mini_pipeline_gl_dropdown: ci_mini_pipeline_gl_dropdown_enabled)
       visit_merge_request
     end
 
+    let_it_be(:dropdown_toggle_selector) do
+      if ci_mini_pipeline_gl_dropdown_enabled
+        '[data-testid="mini-pipeline-graph-dropdown"] .dropdown-toggle'
+      else
+        '[data-testid="mini-pipeline-graph-dropdown-toggle"]'
+      end
+    end
+
     def visit_merge_request(format: :html, serializer: nil)
       visit project_merge_request_path(project, merge_request, format: format, serializer: serializer)
     end
@@ -67,10 +75,9 @@ RSpec.describe 'Merge request < User sees mini pipeline graph', :js do
 
         page.driver.browser.action.click_and_hold(toggle.native).perform
         active_background_color, active_foreground_color, active_box_shadow = get_toggle_colors(dropdown_toggle_selector)
+        page.driver.browser.action.release(toggle.native).perform
 
-      page.driver.browser.action.release(toggle.native)
-                                .move_by(100, 100)
-                                .perform
+        page.driver.browser.action.click(toggle.native).move_by(100, 100).perform
         focus_background_color, focus_foreground_color, focus_box_shadow = get_toggle_colors(dropdown_toggle_selector)
 
         expect(default_background_color).not_to eq(hover_background_color)
@@ -144,6 +151,15 @@ RSpec.describe 'Merge request < User sees mini pipeline graph', :js do
         end
       end
     end
+  end
+
+  context 'with ci_mini_pipeline_gl_dropdown disabled' do
+    it_behaves_like "mini pipeline renders", false
+  end
+
+  context 'with ci_mini_pipeline_gl_dropdown enabled' do
+    it_behaves_like "mini pipeline renders", true
+  end
 
   private
 

spec/features/projects/pipelines/pipelines_spec.rb

@@ -518,6 +518,7 @@ RSpec.describe 'Pipelines', :js do
         end
       end
 
+      shared_examples 'mini pipeline renders' do |ci_mini_pipeline_gl_dropdown_enabled|
         context 'mini pipeline graph' do
           let!(:build) do
             create(:ci_build, :pending, pipeline: pipeline,
@@ -525,12 +526,19 @@ RSpec.describe 'Pipelines', :js do
                                         name: 'build')
           end
 
-        dropdown_toggle_selector = '[data-testid="mini-pipeline-graph-dropdown-toggle"]'
-
           before do
+            stub_feature_flags(ci_mini_pipeline_gl_dropdown: ci_mini_pipeline_gl_dropdown_enabled)
             visit_project_pipelines
           end
 
+          let_it_be(:dropdown_toggle_selector) do
+            if ci_mini_pipeline_gl_dropdown_enabled
+              '[data-testid="mini-pipeline-graph-dropdown"] .dropdown-toggle'
+            else
+              '[data-testid="mini-pipeline-graph-dropdown-toggle"]'
+            end
+          end
+
           it 'renders a mini pipeline graph' do
             expect(page).to have_selector('[data-testid="widget-mini-pipeline-graph"]')
             expect(page).to have_selector(dropdown_toggle_selector)
@@ -569,6 +577,15 @@ RSpec.describe 'Pipelines', :js do
             end
           end
         end
+      end
+
+      context 'with ci_mini_pipeline_gl_dropdown disabled' do
+        it_behaves_like "mini pipeline renders", false
+      end
+
+      context 'with ci_mini_pipeline_gl_dropdown enabled' do
+        it_behaves_like "mini pipeline renders", true
+      end
 
       context 'with pagination' do
         before do