Fixes broken borders in reports section MR widget

app/assets/javascripts/reports/components/grouped_test_reports_app.vue

@@ -82,7 +82,7 @@
     :loading-text="groupedSummaryText"
     :error-text="groupedSummaryText"
     :has-issues="reports.length > 0"
-    class="mr-widget-border-top grouped-security-reports mr-report"
+    class="mr-widget-section grouped-security-reports mr-report"
   >
     <div
       slot="body"

app/assets/javascripts/vue_merge_request_widget/mr_widget_options.vue

@@ -275,12 +275,13 @@ export default {
       :key="deployment.id"
       :deployment="deployment"
     />
-    <grouped-test-reports-app
-      v-if="mr.testResultsPath"
-      class="js-reports-container"
-      :endpoint="mr.testResultsPath"
-    />
     <div class="mr-section-container">
+      <grouped-test-reports-app
+        v-if="mr.testResultsPath"
+        class="js-reports-container"
+        :endpoint="mr.testResultsPath"
+      />
+
       <div class="mr-widget-section">
         <component
           :is="componentName"

changelogs/unreleased/51386-broken-border-reports.yml

+---
+title: Fixes broken borders for reports section in MR widget
+merge_request:
+author:
+type: fixed