move to request and response objects

mydea · mydea · commit dbef0161606c · 2023-03-23T13:49:27.000+01:00
diff --git a/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/fetch/captureBodies/test.ts b/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/fetch/captureBodies/test.ts
@@ -79,11 +79,17 @@ sentryTest('captures requestBody & responseBody when experiment is configured',
     {
       data: {
         method: 'POST',
+        statusCode: 200,
         requestBodySize: 13,
         responseBodySize: 14,
-        requestBody: '{"foo":"bar"}',
-        responseBody: '{"res":"this"}',
-        statusCode: 200,
+        request: {
+          size: 13,
+          body: '{"foo":"bar"}',
+        },
+        response: {
+          size: 14,
+          body: '{"res":"this"}',
+        },
       },
       description: 'http://localhost:7654/foo',
       endTimestamp: expect.any(Number),
diff --git a/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/fetch/captureNonTextBodies/test.ts b/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/fetch/captureNonTextBodies/test.ts
@@ -84,11 +84,17 @@ sentryTest(
       {
         data: {
           method: 'POST',
+          statusCode: 200,
           requestBodySize: 16,
           responseBodySize: 24,
-          requestBody: 'name=Anne&age=32',
-          responseBody: '<html>Hello world</html>',
-          statusCode: 200,
+          request: {
+            size: 16,
+            body: 'name=Anne&age=32',
+          },
+          response: {
+            size: 24,
+            body: '<html>Hello world</html>',
+          },
         },
         description: 'http://localhost:7654/foo',
         endTimestamp: expect.any(Number),
diff --git a/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/fetch/contentLengthHeader/test.ts b/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/fetch/contentLengthHeader/test.ts
@@ -79,8 +79,11 @@ sentryTest('parses response_body_size from Content-Length header if available',
     {
       data: {
         method: 'GET',
-        responseBodySize: 789,
         statusCode: 200,
+        responseBodySize: 789,
+        response: {
+          size: 789,
+        },
       },
       description: 'http://localhost:7654/foo',
       endTimestamp: expect.any(Number),
diff --git a/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/fetch/noContentLengthHeader/test.ts b/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/fetch/noContentLengthHeader/test.ts
@@ -78,8 +78,11 @@ sentryTest('does not capture response_body_size without Content-Length header',
     {
       data: {
         method: 'GET',
-        responseBodySize: 29,
         statusCode: 200,
+        responseBodySize: 29,
+        response: {
+          size: 29,
+        },
       },
       description: 'http://localhost:7654/foo',
       endTimestamp: expect.any(Number),
diff --git a/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/fetch/nonTextBodySizes/test.ts b/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/fetch/nonTextBodySizes/test.ts
@@ -81,9 +81,15 @@ sentryTest('calculates body sizes for non-string bodies', async ({ getLocalTestP
     {
       data: {
         method: 'POST',
+        statusCode: 200,
         requestBodySize: 26,
         responseBodySize: 24,
-        statusCode: 200,
+        request: {
+          size: 26,
+        },
+        response: {
+          size: 24,
+        },
       },
       description: 'http://localhost:7654/foo',
       endTimestamp: expect.any(Number),
diff --git a/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/fetch/requestBodySize/test.ts b/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/fetch/requestBodySize/test.ts
@@ -77,8 +77,11 @@ sentryTest('captures requestBodySize when body is sent', async ({ getLocalTestPa
     {
       data: {
         method: 'POST',
-        requestBodySize: 13,
         statusCode: 200,
+        requestBodySize: 13,
+        request: {
+          size: 13,
+        },
       },
       description: 'http://localhost:7654/foo',
       endTimestamp: expect.any(Number),
diff --git a/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/xhr/captureBodies/test.ts b/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/xhr/captureBodies/test.ts
@@ -85,11 +85,11 @@ sentryTest(
       {
         data: {
           method: 'POST',
+          statusCode: 200,
           requestBodySize: 13,
           responseBodySize: 14,
-          requestBody: '{"foo":"bar"}',
-          responseBody: '{"res":"this"}',
-          statusCode: 200,
+          request: { size: 13, body: '{"foo":"bar"}' },
+          response: { size: 14, body: '{"res":"this"}' },
         },
         description: 'http://localhost:7654/foo',
         endTimestamp: expect.any(Number),
diff --git a/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/xhr/captureNonTextBodies/test.ts b/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/xhr/captureNonTextBodies/test.ts
@@ -88,11 +88,11 @@ sentryTest(
       {
         data: {
           method: 'POST',
+          statusCode: 200,
           requestBodySize: 16,
           responseBodySize: 24,
-          requestBody: 'name=Anne&age=32',
-          responseBody: '<html>Hello world</html>',
-          statusCode: 200,
+          request: { size: 16, body: 'name=Anne&age=32' },
+          response: { size: 24, body: '<html>Hello world</html>' },
         },
         description: 'http://localhost:7654/foo',
         endTimestamp: expect.any(Number),
diff --git a/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/xhr/contentLengthHeader/test.ts b/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/xhr/contentLengthHeader/test.ts
@@ -86,8 +86,9 @@ sentryTest(
       {
         data: {
           method: 'GET',
-          responseBodySize: 789,
           statusCode: 200,
+          responseBodySize: 789,
+          response: { size: 789 },
         },
         description: 'http://localhost:7654/foo',
         endTimestamp: expect.any(Number),
diff --git a/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/xhr/noContentLengthHeader/test.ts b/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/xhr/noContentLengthHeader/test.ts
@@ -86,8 +86,9 @@ sentryTest(
       {
         data: {
           method: 'GET',
-          responseBodySize: 29,
           statusCode: 200,
+          responseBodySize: 29,
+          response: { size: 29 },
         },
         description: 'http://localhost:7654/foo',
         endTimestamp: expect.any(Number),
diff --git a/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/xhr/nonTextBodySizes/test.ts b/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/xhr/nonTextBodySizes/test.ts
@@ -84,9 +84,11 @@ sentryTest('calculates body sizes for non-string bodies', async ({ getLocalTestP
     {
       data: {
         method: 'POST',
+        statusCode: 200,
         requestBodySize: 26,
         responseBodySize: 24,
-        statusCode: 200,
+        request: { size: 26 },
+        response: { size: 24 },
       },
       description: 'http://localhost:7654/foo',
       endTimestamp: expect.any(Number),
diff --git a/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/xhr/requestBodySize/test.ts b/packages/browser-integration-tests/suites/replay/extendNetworkBreadcrumbs/xhr/requestBodySize/test.ts
@@ -81,8 +81,9 @@ sentryTest('captures requestBodySize when body is sent', async ({ getLocalTestPa
     {
       data: {
         method: 'POST',
-        requestBodySize: 13,
         statusCode: 200,
+        requestBodySize: 13,
+        request: { size: 13 },
       },
       description: 'http://localhost:7654/foo',
       endTimestamp: expect.any(Number),
diff --git a/packages/browser-integration-tests/utils/replayEventTemplates.ts b/packages/browser-integration-tests/utils/replayEventTemplates.ts
@@ -140,6 +140,8 @@ export const expectedFetchPerformanceSpan = {
     statusCode: 200,
     responseBodySize: 11,
     requestBodySize: 3,
+    request: { size: 3 },
+    response: { size: 11 },
   },
 };
 
@@ -152,6 +154,7 @@ export const expectedXHRPerformanceSpan = {
     method: 'GET',
     statusCode: 200,
     responseBodySize: 11,
+    response: { size: 11 },
   },
 };
 
diff --git a/packages/replay/src/coreHandlers/util/fetchUtils.ts b/packages/replay/src/coreHandlers/util/fetchUtils.ts
@@ -1,5 +1,5 @@
 import type { Breadcrumb, FetchBreadcrumbData, TextEncoderInternal } from '@sentry/types';
-import { logger } from '@sentry/utils';
+import { dropUndefinedKeys, logger } from '@sentry/utils';
 
 import type { FetchHint, ReplayContainer, ReplayNetworkRequestData } from '../../types';
 import { addNetworkBreadcrumb } from './addNetworkBreadcrumb';
@@ -92,6 +92,11 @@ async function _prepareFetchData(
     requestBody = getBodyString(body);
   }
 
+  const request =
+    requestBody || requestBodySize ? dropUndefinedKeys({ body: requestBody, size: requestBodySize }) : undefined;
+  const response =
+    responseBody || responseBodySize ? dropUndefinedKeys({ body: responseBody, size: responseBodySize }) : undefined;
+
   return {
     startTimestamp,
     endTimestamp,
@@ -100,7 +105,7 @@ async function _prepareFetchData(
     statusCode: statusCode || 0,
     requestBodySize,
     responseBodySize,
-    requestBody,
-    responseBody,
+    request,
+    response,
   };
 }
diff --git a/packages/replay/src/coreHandlers/util/networkUtils.ts b/packages/replay/src/coreHandlers/util/networkUtils.ts
@@ -96,8 +96,8 @@ export function makeNetworkReplayBreadcrumb(
     statusCode,
     requestBodySize,
     responseBodySize,
-    requestBody,
-    responseBody,
+    request,
+    response,
   } = data;
 
   const result: ReplayPerformanceEntry & { data: object } = {
@@ -110,8 +110,8 @@ export function makeNetworkReplayBreadcrumb(
       statusCode,
       requestBodySize,
       responseBodySize,
-      requestBody,
-      responseBody,
+      request,
+      response,
     }),
   };
 
diff --git a/packages/replay/src/coreHandlers/util/xhrUtils.ts b/packages/replay/src/coreHandlers/util/xhrUtils.ts
@@ -76,6 +76,9 @@ function _prepareXhrData(
     return null;
   }
 
+  const request = requestBody || requestBodySize ? { body: requestBody, size: requestBodySize } : undefined;
+  const response = responseBody || responseBodySize ? { body: responseBody, size: responseBodySize } : undefined;
+
   return {
     startTimestamp,
     endTimestamp,
@@ -84,7 +87,7 @@ function _prepareXhrData(
     statusCode: statusCode || 0,
     requestBodySize,
     responseBodySize,
-    requestBody,
-    responseBody,
+    request,
+    response,
   };
 }
diff --git a/packages/replay/src/types.ts b/packages/replay/src/types.ts
@@ -373,6 +373,13 @@ export type ReplayNetworkRequestData = {
   requestBodySize?: number;
   responseBodySize?: number;
 
-  requestBody?: string;
-  responseBody?: string;
+  request?: {
+    size?: number;
+    body?: string;
+  };
+
+  response?: {
+    size?: number;
+    body?: string;
+  };
 };
diff --git a/packages/replay/test/unit/coreHandlers/handleNetworkBreadcrumbs.test.ts b/packages/replay/test/unit/coreHandlers/handleNetworkBreadcrumbs.test.ts
@@ -117,6 +117,12 @@ describe('Unit | coreHandlers | handleNetworkBreadcrumbs', () => {
                 requestBodySize: 10,
                 responseBodySize: 13,
                 statusCode: 200,
+                request: {
+                  size: 10,
+                },
+                response: {
+                  size: 13,
+                },
               },
               description: 'https://example.com',
               endTimestamp: (BASE_TIMESTAMP + 2000) / 1000,
@@ -224,6 +230,12 @@ describe('Unit | coreHandlers | handleNetworkBreadcrumbs', () => {
                 method: 'GET',
                 requestBodySize: 10,
                 responseBodySize: 13,
+                request: {
+                  size: 10,
+                },
+                response: {
+                  size: 13,
+                },
                 statusCode: 200,
               },
               description: 'https://example.com',
@@ -334,6 +346,9 @@ describe('Unit | coreHandlers | handleNetworkBreadcrumbs', () => {
               data: {
                 statusCode: 200,
                 responseBodySize: 13,
+                response: {
+                  size: 13,
+                },
               },
               description: 'https://example.com',
               endTimestamp: (BASE_TIMESTAMP + 2000) / 1000,
@@ -398,8 +413,14 @@ describe('Unit | coreHandlers | handleNetworkBreadcrumbs', () => {
                 requestBodySize: 10,
                 responseBodySize: 13,
                 statusCode: 200,
-                requestBody: 'test input',
-                responseBody: 'test response',
+                request: {
+                  size: 10,
+                  body: 'test input',
+                },
+                response: {
+                  size: 13,
+                  body: 'test response',
+                },
               },
               description: 'https://example.com',
               endTimestamp: (BASE_TIMESTAMP + 2000) / 1000,
@@ -522,8 +543,14 @@ describe('Unit | coreHandlers | handleNetworkBreadcrumbs', () => {
                 requestBodySize: 10,
                 responseBodySize: 13,
                 statusCode: 200,
-                requestBody: 'test input',
-                responseBody: 'test response',
+                request: {
+                  size: 10,
+                  body: 'test input',
+                },
+                response: {
+                  size: 13,
+                  body: 'test response',
+                },
               },
               description: 'https://example.com',
               endTimestamp: (BASE_TIMESTAMP + 2000) / 1000,
