Update locators on usage quota page

Update spec to use new element

ee/app/assets/javascripts/usage_quotas/storage/components/usage_statistics_card.vue

@@ -49,7 +49,11 @@ export default {
         <span class="gl-font-size-h-display gl-font-weight-bold">/</span>
         <gl-sprintf :message="__('%{size} %{unit}')">
           <template #size>
-            <span class="gl-font-size-h-display gl-font-weight-bold">{{ usageTotal.value }}</span>
+            <span
+              data-qa-selector="purchased_usage_total"
+              class="gl-font-size-h-display gl-font-weight-bold"
+              >{{ usageTotal.value }}</span
+            >
           </template>
           <template #unit>
             <span class="gl-font-lg gl-font-weight-bold">{{ usageTotal.unit }}</span>

ee/app/views/namespaces/pipelines_quota/_extra_shared_runners_minutes_quota.html.haml

@@ -8,7 +8,7 @@
   .col-sm-6
     %strong
       = _("Additional minutes")
-    %div
+    %div{ data: { qa_selector: "additional_ci_minutes" } }
       = ci_minutes_report(minutes_quota_presenter.purchased_minutes_report)
       minutes
       = link_to sprite_icon('question-o'), help_page_path('subscriptions/gitlab_com/index', anchor: 'purchase-additional-ci-minutes'), target: '_blank', rel: 'noopener noreferrer'

ee/app/views/namespaces/pipelines_quota/_list.haml

@@ -23,7 +23,7 @@
           = last_reset.strftime('%b %d, %Y')
         - else
           = s_('UsageQuota|Current period usage')
-      %div
+      %div{ data: { qa_selector: "plan_ci_minutes" } }
         = ci_minutes_report(minutes_quota_presenter.monthly_minutes_report)
         minutes
         = link_to sprite_icon('question-o'), help_page_path('user/admin_area/settings/continuous_integration', anchor: 'shared-runners-pipeline-minutes-quota'), target: '_blank', 'aria-label': _('Shared runners help link')

qa/lib/gitlab/page/group/settings/usage_quotas.rb

@@ -9,21 +9,19 @@ module Gitlab
           link :storage_tab, id: 'storage-quota'
           link :buy_ci_minutes, text: 'Buy additional minutes'
           link :buy_storage, text: /Purchase more storage/
-          strong :additional_minutes, text: 'Additional minutes'
-          strong :plan_minutes, text: 'Current period usage'
-          div :purchased_usage, 'data-testid': 'purchased-usage'
-          div(:plan_minutes_usage) { plan_minutes_element.following_sibling.span }
-          div(:additional_minutes_usage) { additional_minutes_element.following_sibling.span }
+          div :plan_ci_minutes
+          div :additional_ci_minutes
+          span :purchased_usage_total
           div :ci_purchase_successful_alert, text: /You have successfully purchased CI minutes/
           div :storage_purchase_successful_alert, text: /You have successfully purchased a storage/
           h4 :storage_available_alert, text: /purchased storage is available/
 
-          def plan_minutes_limits
-            plan_minutes_usage[%r{([^/ ]+)$}]
+          def plan_ci_limits
+            plan_ci_minutes_element.span.text[%r{([^/ ]+)$}]
           end
 
-          def additional_limits
-            additional_minutes_usage[%r{([^/ ]+)$}]
+          def additional_ci_limits
+            additional_ci_minutes_element.span.text[%r{([^/ ]+)$}]
           end
 
           # Waits and Checks if storage available alert presents on the page
@@ -40,7 +38,7 @@ module Gitlab
           # @return [Float] Total purchased storage value in GiB
           def total_purchased_storage
             storage_available_alert_element.wait_until(&:present?)
-            purchased_usage_element.p.spans[3].text.to_f
+            purchased_usage_total.to_f
           end
         end
       end

qa/qa/specs/features/ee/browser_ui/fulfillment/purchase/purchase_ci_spec.rb

@@ -54,8 +54,8 @@ module QA
             expected_minutes = CI_MINUTES[:ci_minutes] * purchase_quantity
 
             expect { usage_quota.ci_purchase_successful_alert? }.to eventually_be_truthy.within(max_duration: 60, max_attempts: 30)
-            expect { usage_quota.additional_minutes? }.to eventually_be_truthy.within(max_duration: 120, max_attempts: 60, reload_page: page)
-            expect(usage_quota.additional_limits).to eq(expected_minutes.to_s)
+            expect { usage_quota.additional_ci_minutes? }.to eventually_be_truthy.within(max_duration: 120, max_attempts: 60, reload_page: page)
+            expect(usage_quota.additional_ci_limits).to eq(expected_minutes.to_s)
           end
         end
       end
@@ -83,10 +83,10 @@ module QA
             plan_limits = ULTIMATE[:ci_minutes]
 
             expect { usage_quota.ci_purchase_successful_alert? }.to eventually_be_truthy.within(max_duration: 60, max_attempts: 30)
-            expect { usage_quota.additional_minutes? }.to eventually_be_truthy.within(max_duration: 120, max_attempts: 60, reload_page: page)
+            expect { usage_quota.additional_ci_minutes? }.to eventually_be_truthy.within(max_duration: 120, max_attempts: 60, reload_page: page)
             aggregate_failures do
-              expect(usage_quota.additional_limits).to eq(expected_minutes.to_s)
-              expect(usage_quota.plan_minutes_limits).to eq(plan_limits.to_s)
+              expect(usage_quota.additional_ci_limits).to eq(expected_minutes.to_s)
+              expect(usage_quota.plan_ci_limits).to eq(plan_limits.to_s)
             end
           end
         end
@@ -108,8 +108,8 @@ module QA
             expected_minutes = CI_MINUTES[:ci_minutes] * purchase_quantity * 2
 
             expect { usage_quota.ci_purchase_successful_alert? }.to eventually_be_truthy.within(max_duration: 60, max_attempts: 30)
-            expect { usage_quota.additional_minutes? }.to eventually_be_truthy.within(max_duration: 120, max_attempts: 60, reload_page: page)
-            expect(usage_quota.additional_limits).to eq(expected_minutes.to_s)
+            expect { usage_quota.additional_ci_minutes? }.to eventually_be_truthy.within(max_duration: 120, max_attempts: 60, reload_page: page)
+            expect { usage_quota.additional_ci_limits }.to eventually_eq(expected_minutes.to_s).within(max_duration: 120, max_attempts: 60, reload_page: page)
           end
         end
       end