ref(replay): Add BODY_PARSE_ERROR warning when network body fails

Author: mydea

packages/replay/src/coreHandlers/util/fetchUtils.ts

@@ -3,6 +3,7 @@ import { logger } from '@sentry/utils';
 
 import type {
   FetchHint,
+  NetworkMetaWarning,
   ReplayContainer,
   ReplayNetworkOptions,
   ReplayNetworkRequestData,
@@ -16,6 +17,7 @@ import {
   getBodySize,
   getBodyString,
   makeNetworkReplayBreadcrumb,
+  mergeWarningsIntoMeta,
   parseContentLengthHeader,
   urlMatches,
 } from './networkUtils';
@@ -118,8 +120,14 @@ function _getRequestInfo(
 
   // We only want to transmit string or string-like bodies
   const requestBody = _getFetchRequestArgBody(input);
-  const bodyStr = getBodyString(requestBody);
-  return buildNetworkRequestOrResponse(headers, requestBodySize, bodyStr);
+  const [bodyStr, warning] = getBodyString(requestBody);
+  const data = buildNetworkRequestOrResponse(headers, requestBodySize, bodyStr);
+
+  if (data && warning) {
+    data._meta = mergeWarningsIntoMeta(data._meta, [warning]);
+  }
+
+  return data;
 }
 
 async function _getResponseInfo(
@@ -145,11 +153,40 @@ async function _getResponseInfo(
   }
 
   // Only clone the response if we need to
-  try {
-    // We have to clone this, as the body can only be read once
-    const res = response.clone();
-    const bodyText = await _parseFetchBody(res);
 
+  const [bodyText, warning] = await _parseFetchResponseBody(response);
+  const result = getResponseData(bodyText, {
+    networkCaptureBodies,
+    textEncoder,
+    responseBodySize,
+    captureDetails,
+    headers,
+  });
+
+  if (result && warning) {
+    result._meta = mergeWarningsIntoMeta(result._meta, [warning]);
+  }
+
+  return result;
+}
+
+function getResponseData(
+  bodyText: string | undefined,
+  {
+    networkCaptureBodies,
+    textEncoder,
+    responseBodySize,
+    captureDetails,
+    headers,
+  }: {
+    captureDetails: boolean;
+    networkCaptureBodies: boolean;
+    responseBodySize: number | undefined;
+    headers: Record<string, string>;
+    textEncoder: TextEncoderInternal;
+  },
+): ReplayNetworkRequestOrResponse | undefined {
+  try {
     const size =
       bodyText && bodyText.length && responseBodySize === undefined
         ? getBodySize(bodyText, textEncoder)
@@ -171,11 +208,15 @@ async function _getResponseInfo(
   }
 }
 
-async function _parseFetchBody(response: Response): Promise<string | undefined> {
+async function _parseFetchResponseBody(response: Response): Promise<[string | undefined, NetworkMetaWarning?]> {
   try {
-    return await response.text();
-  } catch {
-    return undefined;
+    // We have to clone this, as the body can only be read once
+    const res = response.clone();
+    const text = await res.text();
+    return [text];
+  } catch (errorr) {
+    __DEBUG_BUILD__ && logger.warn('[Replay] Failed to read response body', errorr);
+    return [undefined, 'BODY_PARSE_ERROR'];
   }
 }
 

packages/replay/src/coreHandlers/util/networkUtils.ts

@@ -61,26 +61,39 @@ export function parseContentLengthHeader(header: string | null | undefined): num
 }
 
 /** Get the string representation of a body. */
-export function getBodyString(body: unknown): string | undefined {
+export function getBodyString(body: unknown): [string | undefined, NetworkMetaWarning?] {
   try {
     if (typeof body === 'string') {
-      return body;
+      return [body];
     }
 
     if (body instanceof URLSearchParams) {
-      return body.toString();
+      return [body.toString()];
     }
 
     if (body instanceof FormData) {
-      return _serializeFormData(body);
+      return [_serializeFormData(body)];
     }
   } catch {
     __DEBUG_BUILD__ && logger.warn('[Replay] Failed to serialize body', body);
+    return [undefined, 'BODY_PARSE_ERROR'];
   }
 
   __DEBUG_BUILD__ && logger.info('[Replay] Skipping network body because of body type', body);
 
-  return undefined;
+  return [undefined];
+}
+
+/** Merge warnings into an possibly existing meta. */
+export function mergeWarningsIntoMeta(
+  meta: ReplayNetworkRequestOrResponse['_meta'],
+  warnings: NetworkMetaWarning[],
+): ReplayNetworkRequestOrResponse['_meta'] {
+  const newMeta = { ...meta };
+  const existingWarnings = newMeta.warnings || [];
+  newMeta.warnings = [...existingWarnings, ...warnings];
+
+  return newMeta;
 }
 
 /** Convert ReplayNetworkRequestData to a PerformanceEntry. */

packages/replay/src/coreHandlers/util/xhrUtils.ts

@@ -1,7 +1,13 @@
 import type { Breadcrumb, TextEncoderInternal, XhrBreadcrumbData } from '@sentry/types';
 import { logger, SENTRY_XHR_DATA_KEY } from '@sentry/utils';
 
-import type { ReplayContainer, ReplayNetworkOptions, ReplayNetworkRequestData, XhrHint } from '../../types';
+import type {
+  NetworkMetaWarning,
+  ReplayContainer,
+  ReplayNetworkOptions,
+  ReplayNetworkRequestData,
+  XhrHint,
+} from '../../types';
 import { addNetworkBreadcrumb } from './addNetworkBreadcrumb';
 import {
   buildNetworkRequestOrResponse,
@@ -10,6 +16,7 @@ import {
   getBodySize,
   getBodyString,
   makeNetworkReplayBreadcrumb,
+  mergeWarningsIntoMeta,
   parseContentLengthHeader,
   urlMatches,
 } from './networkUtils';
@@ -103,12 +110,20 @@ function _prepareXhrData(
     : {};
   const networkResponseHeaders = getAllowedHeaders(getResponseHeaders(xhr), options.networkResponseHeaders);
 
-  const requestBody = options.networkCaptureBodies ? getBodyString(input) : undefined;
-  const responseBody = options.networkCaptureBodies ? _getXhrResponseBody(xhr) : undefined;
+  const [requestBody, requestWarning] = options.networkCaptureBodies ? getBodyString(input) : [undefined];
+  const [responseBody, responseWarning] = options.networkCaptureBodies ? _getXhrResponseBody(xhr) : [undefined];
 
   const request = buildNetworkRequestOrResponse(networkRequestHeaders, requestBodySize, requestBody);
   const response = buildNetworkRequestOrResponse(networkResponseHeaders, responseBodySize, responseBody);
 
+  if (request && requestWarning) {
+    request._meta = mergeWarningsIntoMeta(request._meta, [requestWarning]);
+  }
+
+  if (response && responseWarning) {
+    response._meta = mergeWarningsIntoMeta(response._meta, [responseWarning]);
+  }
+
   return {
     startTimestamp,
     endTimestamp,
@@ -134,12 +149,12 @@ function getResponseHeaders(xhr: XMLHttpRequest): Record<string, string> {
   }, {});
 }
 
-function _getXhrResponseBody(xhr: XMLHttpRequest): string | undefined {
+function _getXhrResponseBody(xhr: XMLHttpRequest): [string | undefined, NetworkMetaWarning?] {
   // We collect errors that happen, but only log them if we can't get any response body
   const errors: unknown[] = [];
 
   try {
-    return xhr.responseText;
+    return [xhr.responseText];
   } catch (e) {
     errors.push(e);
   }
@@ -154,5 +169,5 @@ function _getXhrResponseBody(xhr: XMLHttpRequest): string | undefined {
 
   __DEBUG_BUILD__ && logger.warn('[Replay] Failed to get xhr response body', ...errors);
 
-  return undefined;
+  return [undefined];
 }

packages/replay/src/types/request.ts

@@ -3,7 +3,7 @@ type JsonArray = unknown[];
 
 export type NetworkBody = JsonObject | JsonArray | string;
 
-export type NetworkMetaWarning = 'MAYBE_JSON_TRUNCATED' | 'TEXT_TRUNCATED' | 'URL_SKIPPED';
+export type NetworkMetaWarning = 'MAYBE_JSON_TRUNCATED' | 'TEXT_TRUNCATED' | 'URL_SKIPPED' | 'BODY_PARSE_ERROR';
 
 interface NetworkMeta {
   warnings?: NetworkMetaWarning[];