Fix Vuln detail and modal when reasonPhrase is empty string

* Fix for some reports like DAST

ee/app/assets/javascripts/vue_shared/security_reports/components/vulnerability_details.vue

@@ -6,6 +6,7 @@ import CodeBlock from '~/vue_shared/components/code_block.vue';
 import SeverityBadge from './severity_badge.vue';
 import getFileLocation from '../store/utils/get_file_location';
 import VulnerabilityDetail from './vulnerability_detail.vue';
+import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
 import { s__, sprintf } from '~/locale';
 import { bodyWithFallBack } from './helpers';
 
@@ -137,10 +138,12 @@ export default {
       return headers.map(({ name, value }) => `${name}: ${value}`).join('\n');
     },
     constructResponse(response) {
-      const { body, status_code: statusCode, reason_phrase: reasonPhrase, headers = [] } = response;
+      const { body, statusCode, reasonPhrase = '', headers = [] } = convertObjectPropsToCamelCase(
+        response,
+      );
       const headerLines = this.getHeadersAsCodeBlockLines(headers);
 
-      return statusCode && reasonPhrase && headerLines
+      return statusCode && headerLines
         ? [`${statusCode} ${reasonPhrase}\n`, headerLines, '\n\n', bodyWithFallBack(body)].join('')
         : '';
     },

ee/app/assets/javascripts/vulnerabilities/components/details.vue

@@ -144,10 +144,10 @@ export default {
         : '';
     },
     constructResponse(response) {
-      const { body, statusCode, reasonPhrase, headers = [] } = response;
+      const { body, statusCode, reasonPhrase = '', headers = [] } = response;
       const headerLines = this.getHeadersAsCodeBlockLines(headers);
 
-      return statusCode && reasonPhrase && headerLines
+      return statusCode && headerLines
         ? [`${statusCode} ${reasonPhrase}\n`, headerLines, '\n\n', bodyWithFallBack(body)].join('')
         : '';
     },

ee/changelogs/unreleased/298919-fix-response-fields-for-vulns.yml

+---
+title: Fix Vuln detail and modal when reasonPhrase is empty string
+merge_request: 52156
+author:
+type: fixed

ee/spec/frontend/vue_shared/security_reports/components/__snapshots__/vulnerability_details_spec.js.snap

@@ -59,7 +59,18 @@ exports[`VulnerabilityDetails component pin test renders correctly 1`] = `
    
   <!---->
    
-  <!---->
+  <vulnerability-detail-stub
+    label="Actual Response"
+  >
+    <code-block-stub
+      code="200 
+key1: value1
+key2: value2
+
+<Message body is not provided>"
+      maxheight="225px"
+    />
+  </vulnerability-detail-stub>
    
   <vulnerability-detail-stub
     label="File"

ee/spec/frontend/vulnerabilities/details_spec.js

@@ -248,6 +248,12 @@ describe('Vulnerability Details', () => {
       isCode: true,
     };
 
+    const EXPECT_RESPONSE_WITHOUT_REASON_PHRASE = {
+      label: 'Actual response:',
+      content: '500 \nName1: Value1\nName2: Value2\n\n[{"user_id":1,}]',
+      isCode: true,
+    };
+
     const EXPECT_RESPONSE_WITHOUT_BODY = {
       label: 'Actual response:',
       content:
@@ -261,6 +267,12 @@ describe('Vulnerability Details', () => {
       isCode: true,
     };
 
+    const EXPECT_RECORDED_RESPONSE_WITHOUT_REASON_PHRASE = {
+      label: 'Unmodified response:',
+      content: '200 \nName1: Value1\nName2: Value2\n\n[{"user_id":1,}]',
+      isCode: true,
+    };
+
     const EXPECT_RECORDED_RESPONSE_WITHOUT_BODY = {
       label: 'Unmodified response:',
       content: '200 OK\nName1: Value1\nName2: Value2\n\n<Message body is not provided>',
@@ -305,7 +317,7 @@ describe('Vulnerability Details', () => {
       ${{}}                                                                                                            | ${null}
       ${{ headers: TEST_HEADERS }}                                                                                     | ${null}
       ${{ headers: TEST_HEADERS, body: '[{"user_id":1,}]' }}                                                           | ${null}
-      ${{ headers: TEST_HEADERS, body: '[{"user_id":1,}]', statusCode: '500' }}                                        | ${null}
+      ${{ headers: TEST_HEADERS, body: '[{"user_id":1,}]', statusCode: '500' }}                                        | ${[EXPECT_RESPONSE_WITHOUT_REASON_PHRASE]}
       ${{ headers: TEST_HEADERS, body: '[{"user_id":1,}]', statusCode: '500', reasonPhrase: 'INTERNAL SERVER ERROR' }} | ${[EXPECT_RESPONSE]}
       ${{ headers: TEST_HEADERS, body: '', statusCode: '500', reasonPhrase: 'INTERNAL SERVER ERROR' }}                 | ${[EXPECT_RESPONSE_WITHOUT_BODY]}
     `('shows response data for $response', ({ response, expectedData }) => {
@@ -323,6 +335,7 @@ describe('Vulnerability Details', () => {
       ${[{}, { response: { headers: TEST_HEADERS, body: '[{"user_id":1,}]' } }]}                                                                                 | ${null}
       ${[{}, { response: { headers: TEST_HEADERS, body: '[{"user_id":1,}]', status_code: '200' } }]}                                                             | ${null}
       ${[{}, { response: { headers: TEST_HEADERS, body: '[{"user_id":1,}]', status_code: '200', reason_phrase: 'OK' } }]}                                        | ${null}
+      ${[{}, { name: SUPPORTING_MESSAGE_TYPES.RECORDED, response: { headers: TEST_HEADERS, body: '[{"user_id":1,}]', statusCode: '200' } }]}                     | ${[EXPECT_RECORDED_RESPONSE_WITHOUT_REASON_PHRASE]}
       ${[{}, { name: SUPPORTING_MESSAGE_TYPES.RECORDED, response: { headers: TEST_HEADERS, body: '[{"user_id":1,}]', statusCode: '200', reasonPhrase: 'OK' } }]} | ${[EXPECT_RECORDED_RESPONSE]}
       ${[{}, { name: SUPPORTING_MESSAGE_TYPES.RECORDED, response: { headers: TEST_HEADERS, body: '', statusCode: '200', reasonPhrase: 'OK' } }]}                 | ${[EXPECT_RECORDED_RESPONSE_WITHOUT_BODY]}
     `('shows response data for $supporting_messages', ({ supportingMessages, expectedData }) => {