[QA] Fix the 'clone using deploy key' tests

Signed-off-by: Rémy Coutable <remy@rymai.me>

app/assets/javascripts/jobs/components/job_app.vue

@@ -165,7 +165,7 @@
     <gl-loading-icon
       v-if="isLoading"
       :size="2"
-      class="js-job-loading prepend-top-20"
+      class="js-job-loading qa-loading-animation prepend-top-20"
     />
 
     <template v-else-if="shouldRenderContent">
@@ -217,8 +217,8 @@
         />
 
         <!--job log -->
-        <div 
-          v-if="hasTrace" 
+        <div
+          v-if="hasTrace"
           class="build-trace-container prepend-top-default">
           <log-top-bar
             :class="{

app/assets/javascripts/jobs/components/job_log.vue

@@ -42,7 +42,7 @@
   };
 </script>
 <template>
-  <pre class="js-build-trace build-trace">
+  <pre class="js-build-trace build-trace qa-build-trace">
     <code
       class="bash"
       v-html="trace"

app/assets/javascripts/vue_shared/components/ci_badge_link.vue

@@ -43,7 +43,7 @@ export default {
   computed: {
     cssClass() {
       const className = this.status.group;
-      return className ? `ci-status ci-${className}` : 'ci-status';
+      return className ? `ci-status ci-${className} qa-status-badge` : 'ci-status qa-status-badge';
     },
   },
 };

qa/qa/page/project/job/show.rb

@@ -4,30 +4,39 @@ module QA::Page
       COMPLETED_STATUSES = %w[passed failed canceled blocked skipped manual].freeze # excludes created, pending, running
       PASSED_STATUS = 'passed'.freeze
 
-      view 'app/views/shared/builds/_build_output.html.haml' do
-        element :build_output, '.js-build-output' # rubocop:disable QA/ElementWithPattern
-        element :loading_animation, '.js-build-refresh' # rubocop:disable QA/ElementWithPattern
+      view 'app/assets/javascripts/jobs/components/job_app.vue' do
+        element :loading_animation
+      end
+
+      view 'app/assets/javascripts/jobs/components/job_log.vue' do
+        element :build_trace
       end
 
       view 'app/assets/javascripts/vue_shared/components/ci_badge_link.vue' do
-        element :status_badge, 'ci-status' # rubocop:disable QA/ElementWithPattern
+        element :status_badge
       end
 
       def completed?
-        COMPLETED_STATUSES.include? find('.ci-status').text
+        COMPLETED_STATUSES.include?(status_badge)
       end
 
       def passed?
-        find('.ci-status').text == PASSED_STATUS
+        status_badge == PASSED_STATUS
       end
 
       def trace_loading?
-        has_css?('.js-build-refresh')
+        has_element?(:loading_animation)
       end
 
       # Reminder: You may wish to wait for a particular job status before checking output
       def output
-        find('.js-build-output').text
+        find_element(:build_trace).text
+      end
+
+      private
+
+      def status_badge
+        find_element(:status_badge).text
       end
     end
   end