3 files changed, 27 insertions, 3 deletions
diff --git a/app/assets/javascripts/pipelines/components/test_reports/test_reports.vue b/app/assets/javascripts/pipelines/components/test_reports/test_reports.vue
index 388b300b39d..06ab45adf80 100644
--- a/app/assets/javascripts/pipelines/components/test_reports/test_reports.vue
+++ b/app/assets/javascripts/pipelines/components/test_reports/test_reports.vue
@@ -21,7 +21,8 @@ export default {
       return this.selectedSuite.total_count > 0;
     },
     showTests() {
-      return this.testReports.total_count > 0;
+      const { test_suites: testSuites = [] } = this.testReports;
+      return testSuites.length > 0;
     },
   },
   methods: {
diff --git a/app/assets/javascripts/pipelines/components/test_reports/test_summary.vue b/app/assets/javascripts/pipelines/components/test_reports/test_summary.vue
index 9739ef76867..80a1c83f171 100644
--- a/app/assets/javascripts/pipelines/components/test_reports/test_summary.vue
+++ b/app/assets/javascripts/pipelines/components/test_reports/test_summary.vue
@@ -29,7 +29,14 @@ export default {
     successPercentage() {
       // Returns a full number when the decimals equal .00.
       // Otherwise returns a float to two decimal points
-      return Number(((this.report.success_count / this.report.total_count) * 100 || 0).toFixed(2));
+      // Do not include skipped tests as part of the total when doing success calculations.
+
+      const totalCompletedCount = this.report.total_count - this.report.skipped_count;
+
+      if (totalCompletedCount > 0) {
+        return Number(((this.report.success_count / totalCompletedCount) * 100 || 0).toFixed(2));
+      }
+      return 0;
     },
     formattedDuration() {
       return formatTime(secondsToMilliseconds(this.report.total_time));
diff --git a/app/assets/javascripts/pipelines/components/test_reports/test_summary_table.vue b/app/assets/javascripts/pipelines/components/test_reports/test_summary_table.vue
index 6effd6e949d..4dfb67dd8e8 100644
--- a/app/assets/javascripts/pipelines/components/test_reports/test_summary_table.vue
+++ b/app/assets/javascripts/pipelines/components/test_reports/test_summary_table.vue
@@ -1,14 +1,19 @@
 <script>
 import { mapGetters } from 'vuex';
 import { s__ } from '~/locale';
+import { GlIcon, GlTooltipDirective } from '@gitlab/ui';
 import store from '~/pipelines/stores/test_reports';
 import SmartVirtualList from '~/vue_shared/components/smart_virtual_list.vue';
 
 export default {
   name: 'TestsSummaryTable',
   components: {
+    GlIcon,
     SmartVirtualList,
   },
+  directives: {
+    GlTooltip: GlTooltipDirective,
+  },
   store,
   props: {
     heading: {
@@ -75,7 +80,10 @@ export default {
           v-for="(testSuite, index) in getTestSuites"
           :key="index"
           role="row"
-          class="gl-responsive-table-row gl-responsive-table-row-clickable test-reports-summary-row rounded cursor-pointer js-suite-row"
+          class="gl-responsive-table-row test-reports-summary-row rounded js-suite-row"
+          :class="{
+            'gl-responsive-table-row-clickable cursor-pointer': !testSuite.suite_error,
+          }"
           @click="tableRowClick(testSuite)"
         >
           <div class="table-section section-25">
@@ -84,6 +92,14 @@ export default {
             </div>
             <div class="table-mobile-content underline cgray pl-3">
               {{ testSuite.name }}
+              <gl-icon
+                v-if="testSuite.suite_error"
+                ref="suiteErrorIcon"
+                v-gl-tooltip
+                name="error"
+                :title="testSuite.suite_error"
+                class="vertical-align-middle"
+              />
             </div>
           </div>