@myinterview/widget-react 1.1.21-development-5e391f9 → 1.1.22-development-2bfa0c3

package/dist/cjs/index.js

@@ -2051,7 +2051,7 @@ function loadModule(moduleName) {
  * @returns A normalized version of the object, or `"**non-serializable**"` if any errors are thrown during normalization.
  */
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-function normalize(input, depth = +Infinity, maxProperties = +Infinity) {
+function normalize(input, depth = 100, maxProperties = +Infinity) {
   try {
     // since we're at the outermost level, we don't provide a key
     return visit('', input, depth, maxProperties);
@@ -2118,17 +2118,16 @@ function visit(
     return value ;
   }
 
-  // Do not normalize objects that we know have already been normalized. As a general rule, the
-  // "__sentry_skip_normalization__" property should only be used sparingly and only should only be set on objects that
-  // have already been normalized.
-  let overriddenDepth = depth;
-
-  if (typeof (value )['__sentry_override_normalization_depth__'] === 'number') {
-    overriddenDepth = (value )['__sentry_override_normalization_depth__'] ;
-  }
+  // We can set `__sentry_override_normalization_depth__` on an object to ensure that from there
+  // We keep a certain amount of depth.
+  // This should be used sparingly, e.g. we use it for the redux integration to ensure we get a certain amount of state.
+  const remainingDepth =
+    typeof (value )['__sentry_override_normalization_depth__'] === 'number'
+      ? ((value )['__sentry_override_normalization_depth__'] )
+      : depth;
 
   // We're also done if we've reached the max depth
-  if (overriddenDepth === 0) {
+  if (remainingDepth === 0) {
     // At this point we know `serialized` is a string of the form `"[object XXXX]"`. Clean it up so it's just `"[XXXX]"`.
     return stringified.replace('object ', '');
   }
@@ -2144,7 +2143,7 @@ function visit(
     try {
       const jsonValue = valueWithToJSON.toJSON();
       // We need to normalize the return value of `.toJSON()` in case it has circular references
-      return visit('', jsonValue, overriddenDepth - 1, maxProperties, memo);
+      return visit('', jsonValue, remainingDepth - 1, maxProperties, memo);
     } catch (err) {
       // pass (The built-in `toJSON` failed, but we can still try to do it ourselves)
     }
@@ -2173,7 +2172,7 @@ function visit(
 
     // Recursively visit all the child nodes
     const visitValue = visitable[visitKey];
-    normalized[visitKey] = visit(visitKey, visitValue, overriddenDepth - 1, maxProperties, memo);
+    normalized[visitKey] = visit(visitKey, visitValue, remainingDepth - 1, maxProperties, memo);
 
     numAdded++;
   }
@@ -5823,7 +5822,7 @@ function getEventForEnvelopeItem(item, type) {
   return Array.isArray(item) ? (item )[1] : undefined;
 }
 
-const SDK_VERSION = '7.49.0';
+const SDK_VERSION = '7.50.0';
 
 let originalFunctionToString;
 
@@ -5846,11 +5845,17 @@ class FunctionToString  {constructor() { FunctionToString.prototype.__init.call(
     // eslint-disable-next-line @typescript-eslint/unbound-method
     originalFunctionToString = Function.prototype.toString;
 
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    Function.prototype.toString = function ( ...args) {
-      const context = getOriginalFunction(this) || this;
-      return originalFunctionToString.apply(context, args);
-    };
+    // intrinsics (like Function.prototype) might be immutable in some environments
+    // e.g. Node with --frozen-intrinsics, XS (an embedded JavaScript engine) or SES (a JavaScript proposal)
+    try {
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      Function.prototype.toString = function ( ...args) {
+        const context = getOriginalFunction(this) || this;
+        return originalFunctionToString.apply(context, args);
+      };
+    } catch (e) {
+      // ignore errors here, just don't patch this
+    }
   }
 } FunctionToString.__initStatic();
 
@@ -8294,11 +8299,14 @@ const REPLAY_SESSION_KEY = 'sentryReplaySession';
 const REPLAY_EVENT_NAME = 'replay_event';
 const UNABLE_TO_SEND_REPLAY = 'Unable to send Replay';
 
-// The idle limit for a session
-const SESSION_IDLE_DURATION = 300000; // 5 minutes in ms
+// The idle limit for a session after which recording is paused.
+const SESSION_IDLE_PAUSE_DURATION = 300000; // 5 minutes in ms
+
+// The idle limit for a session after which the session expires.
+const SESSION_IDLE_EXPIRE_DURATION = 900000; // 15 minutes in ms
 
 // The maximum length of a session
-const MAX_SESSION_LIFE = 3600000; // 60 minutes
+const MAX_SESSION_LIFE = 3600000; // 60 minutes in ms
 
 /** Default flush delays */
 const DEFAULT_FLUSH_MIN_DELAY = 5000;
@@ -8307,7 +8315,7 @@ const DEFAULT_FLUSH_MIN_DELAY = 5000;
 const DEFAULT_FLUSH_MAX_DELAY = 5500;
 
 /* How long to wait for error checkouts */
-const ERROR_CHECKOUT_TIME = 60000;
+const BUFFER_CHECKOUT_TIME = 60000;
 
 const RETRY_BASE_INTERVAL = 5000;
 const RETRY_MAX_COUNT = 3;
@@ -8315,6 +8323,9 @@ const RETRY_MAX_COUNT = 3;
 /* The max (uncompressed) size in bytes of a network body. Any body larger than this will be truncated. */
 const NETWORK_BODY_MAX_SIZE = 150000;
 
+/* The max size of a single console arg that is captured. Any arg larger than this will be truncated. */
+const CONSOLE_ARG_MAX_SIZE = 5000;
+
 var NodeType$1;
 (function (NodeType) {
     NodeType[NodeType["Document"] = 0] = "Document";
@@ -11979,6 +11990,31 @@ function createEventBuffer({ useCompression }) {
   return new EventBufferArray();
 }
 
+/**
+ * Removes the session from Session Storage and unsets session in replay instance
+ */
+function clearSession(replay) {
+  deleteSession();
+  replay.session = undefined;
+}
+
+/**
+ * Deletes a session from storage
+ */
+function deleteSession() {
+  const hasSessionStorage = 'sessionStorage' in WINDOW;
+
+  if (!hasSessionStorage) {
+    return;
+  }
+
+  try {
+    WINDOW.sessionStorage.removeItem(REPLAY_SESSION_KEY);
+  } catch (e) {
+    // Ignore potential SecurityError exceptions
+  }
+}
+
 /**
  * Given an initial timestamp and an expiry duration, checks to see if current
  * time should be considered as expired.
@@ -12009,11 +12045,26 @@ function isSessionExpired(session, timeouts, targetTime = +new Date()) {
     // First, check that maximum session length has not been exceeded
     isExpired(session.started, timeouts.maxSessionLife, targetTime) ||
     // check that the idle timeout has not been exceeded (i.e. user has
-    // performed an action within the last `idleTimeout` ms)
-    isExpired(session.lastActivity, timeouts.sessionIdle, targetTime)
+    // performed an action within the last `sessionIdleExpire` ms)
+    isExpired(session.lastActivity, timeouts.sessionIdleExpire, targetTime)
   );
 }
 
+/**
+ * Given a sample rate, returns true if replay should be sampled.
+ *
+ * 1.0 = 100% sampling
+ * 0.0 = 0% sampling
+ */
+function isSampled(sampleRate) {
+  if (sampleRate === undefined) {
+    return false;
+  }
+
+  // Math.random() returns a number in range of 0 to 1 (inclusive of 0, but not 1)
+  return Math.random() < sampleRate;
+}
+
 /**
  * Save a session to session storage.
  */
@@ -12030,21 +12081,6 @@ function saveSession(session) {
   }
 }
 
-/**
- * Given a sample rate, returns true if replay should be sampled.
- *
- * 1.0 = 100% sampling
- * 0.0 = 0% sampling
- */
-function isSampled(sampleRate) {
-  if (sampleRate === undefined) {
-    return false;
-  }
-
-  // Math.random() returns a number in range of 0 to 1 (inclusive of 0, but not 1)
-  return Math.random() < sampleRate;
-}
-
 /**
  * Get a session with defaults & applied sampling.
  */
@@ -12063,14 +12099,15 @@ function makeSession(session) {
     lastActivity,
     segmentId,
     sampled,
+    shouldRefresh: true,
   };
 }
 
 /**
  * Get the sampled status for a session based on sample rates & current sampled status.
  */
-function getSessionSampleType(sessionSampleRate, errorSampleRate) {
-  return isSampled(sessionSampleRate) ? 'session' : isSampled(errorSampleRate) ? 'error' : false;
+function getSessionSampleType(sessionSampleRate, allowBuffering) {
+  return isSampled(sessionSampleRate) ? 'session' : allowBuffering ? 'buffer' : false;
 }
 
 /**
@@ -12078,8 +12115,8 @@ function getSessionSampleType(sessionSampleRate, errorSampleRate) {
  * that all replays will be saved to as attachments. Currently, we only expect
  * one of these Sentry events per "replay session".
  */
-function createSession({ sessionSampleRate, errorSampleRate, stickySession = false }) {
-  const sampled = getSessionSampleType(sessionSampleRate, errorSampleRate);
+function createSession({ sessionSampleRate, allowBuffering, stickySession = false }) {
+  const sampled = getSessionSampleType(sessionSampleRate, allowBuffering);
   const session = makeSession({
     sampled,
   });
@@ -12127,7 +12164,7 @@ function getSession({
   currentSession,
   stickySession,
   sessionSampleRate,
-  errorSampleRate,
+  allowBuffering,
 }) {
   // If session exists and is passed, use it instead of always hitting session storage
   const session = currentSession || (stickySession && fetchSession());
@@ -12140,8 +12177,9 @@ function getSession({
 
     if (!isExpired) {
       return { type: 'saved', session };
-    } else if (session.sampled === 'error') {
-      // Error samples should not be re-created when expired, but instead we stop when the replay is done
+    } else if (!session.shouldRefresh) {
+      // In this case, stop
+      // This is the case if we have an error session that is completed (=triggered an error)
       const discardedSession = makeSession({ sampled: false });
       return { type: 'new', session: discardedSession };
     } else {
@@ -12153,7 +12191,7 @@ function getSession({
   const newSession = createSession({
     stickySession,
     sessionSampleRate,
-    errorSampleRate,
+    allowBuffering,
   });
 
   return { type: 'new', session: newSession };
@@ -12187,7 +12225,7 @@ async function addEvent(
   // page has been left open and idle for a long period of time and user
   // comes back to trigger a new session. The performance entries rely on
   // `performance.timeOrigin`, which is when the page first opened.
-  if (timestampInMs + replay.timeouts.sessionIdle < Date.now()) {
+  if (timestampInMs + replay.timeouts.sessionIdlePause < Date.now()) {
     return null;
   }
 
@@ -12202,7 +12240,7 @@ async function addEvent(
     return await replay.eventBuffer.addEvent(event, isCheckout);
   } catch (error) {
     (typeof __SENTRY_DEBUG__ === 'undefined' || __SENTRY_DEBUG__) && logger.error(error);
-    replay.stop('addEvent');
+    await replay.stop('addEvent');
 
     const client = getCurrentHub().getClient();
 
@@ -12269,23 +12307,17 @@ function handleAfterSendEvent(replay) {
     // Trigger error recording
     // Need to be very careful that this does not cause an infinite loop
     if (
-      replay.recordingMode === 'error' &&
+      replay.recordingMode === 'buffer' &&
       event.exception &&
       event.message !== UNABLE_TO_SEND_REPLAY // ignore this error because otherwise we could loop indefinitely with trying to capture replay and failing
     ) {
-      setTimeout(async () => {
-        // Allow flush to complete before resuming as a session recording, otherwise
-        // the checkout from `startRecording` may be included in the payload.
-        // Prefer to keep the error replay as a separate (and smaller) segment
-        // than the session replay.
-        await replay.flushImmediate();
-
-        if (replay.stopRecording()) {
-          // Reset all "capture on error" configuration before
-          // starting a new recording
-          replay.recordingMode = 'session';
-          replay.startRecording();
-        }
+      if (!isSampled(replay.getOptions().errorSampleRate)) {
+        return;
+      }
+
+      setTimeout(() => {
+        // Capture current event buffer as new replay
+        void replay.sendBufferedReplayOrFlush();
       });
     }
   };
@@ -13240,6 +13272,17 @@ function makeNetworkReplayBreadcrumb(
   return result;
 }
 
+/** Build the request or response part of a replay network breadcrumb that was skipped. */
+function buildSkippedNetworkRequestOrResponse(bodySize) {
+  return {
+    headers: {},
+    size: bodySize,
+    _meta: {
+      warnings: ['URL_SKIPPED'],
+    },
+  };
+}
+
 /** Build the request or response part of a replay network breadcrumb. */
 function buildNetworkRequestOrResponse(
   headers,
@@ -13320,8 +13363,8 @@ function normalizeNetworkBody(body)
       };
     } catch (e3) {
       return {
-        body,
-        warnings: ['INVALID_JSON'],
+        body: exceedsSizeLimit ? `${body.slice(0, NETWORK_BODY_MAX_SIZE)}…` : body,
+        warnings: exceedsSizeLimit ? ['INVALID_JSON', 'TEXT_TRUNCATED'] : ['INVALID_JSON'],
       };
     }
   }
@@ -13340,6 +13383,11 @@ function _strIsProbablyJson(str) {
   return (first === '[' && last === ']') || (first === '{' && last === '}');
 }
 
+/** Match an URL against a list of strings/Regex. */
+function urlMatches(url, urls) {
+  return stringMatchesSomePattern(url, urls);
+}
+
 /**
  * Capture a fetch breadcrumb to a replay.
  * This adds additional data (where approriate).
@@ -13399,33 +13447,37 @@ async function _prepareFetchData(
   const {
     url,
     method,
-    status_code: statusCode,
+    status_code: statusCode = 0,
     request_body_size: requestBodySize,
     response_body_size: responseBodySize,
   } = breadcrumb.data;
 
-  const request = _getRequestInfo(options, hint.input, requestBodySize);
-  const response = await _getResponseInfo(options, hint.response, responseBodySize);
+  const captureDetails = urlMatches(url, options.networkDetailAllowUrls);
+
+  const request = captureDetails
+    ? _getRequestInfo(options, hint.input, requestBodySize)
+    : buildSkippedNetworkRequestOrResponse(requestBodySize);
+  const response = await _getResponseInfo(captureDetails, options, hint.response, responseBodySize);
 
   return {
     startTimestamp,
     endTimestamp,
     url,
     method,
-    statusCode: statusCode || 0,
+    statusCode,
     request,
     response,
   };
 }
 
 function _getRequestInfo(
-  { captureBodies, requestHeaders },
+  { networkCaptureBodies, networkRequestHeaders },
   input,
   requestBodySize,
 ) {
-  const headers = getRequestHeaders(input, requestHeaders);
+  const headers = getRequestHeaders(input, networkRequestHeaders);
 
-  if (!captureBodies) {
+  if (!networkCaptureBodies) {
     return buildNetworkRequestOrResponse(headers, requestBodySize, undefined);
   }
 
@@ -13436,19 +13488,24 @@ function _getRequestInfo(
 }
 
 async function _getResponseInfo(
+  captureDetails,
   {
-    captureBodies,
+    networkCaptureBodies,
     textEncoder,
-    responseHeaders,
+    networkResponseHeaders,
   }
 
 ,
   response,
   responseBodySize,
 ) {
-  const headers = getAllHeaders(response.headers, responseHeaders);
+  if (!captureDetails && responseBodySize !== undefined) {
+    return buildSkippedNetworkRequestOrResponse(responseBodySize);
+  }
 
-  if (!captureBodies && responseBodySize !== undefined) {
+  const headers = getAllHeaders(response.headers, networkResponseHeaders);
+
+  if (!networkCaptureBodies && responseBodySize !== undefined) {
     return buildNetworkRequestOrResponse(headers, responseBodySize, undefined);
   }
 
@@ -13463,7 +13520,11 @@ async function _getResponseInfo(
         ? getBodySize(bodyText, textEncoder)
         : responseBodySize;
 
-    if (captureBodies) {
+    if (!captureDetails) {
+      return buildSkippedNetworkRequestOrResponse(size);
+    }
+
+    if (networkCaptureBodies) {
       return buildNetworkRequestOrResponse(headers, size, bodyText);
     }
 
@@ -13596,28 +13657,44 @@ function _prepareXhrData(
   const {
     url,
     method,
-    status_code: statusCode,
+    status_code: statusCode = 0,
     request_body_size: requestBodySize,
     response_body_size: responseBodySize,
   } = breadcrumb.data;
 
-  const xhrInfo = xhr[SENTRY_XHR_DATA_KEY];
-  const requestHeaders = xhrInfo ? getAllowedHeaders(xhrInfo.request_headers, options.requestHeaders) : {};
-  const responseHeaders = getAllowedHeaders(getResponseHeaders(xhr), options.responseHeaders);
-
   if (!url) {
     return null;
   }
 
+  if (!urlMatches(url, options.networkDetailAllowUrls)) {
+    const request = buildSkippedNetworkRequestOrResponse(requestBodySize);
+    const response = buildSkippedNetworkRequestOrResponse(responseBodySize);
+    return {
+      startTimestamp,
+      endTimestamp,
+      url,
+      method,
+      statusCode,
+      request,
+      response,
+    };
+  }
+
+  const xhrInfo = xhr[SENTRY_XHR_DATA_KEY];
+  const networkRequestHeaders = xhrInfo
+    ? getAllowedHeaders(xhrInfo.request_headers, options.networkRequestHeaders)
+    : {};
+  const networkResponseHeaders = getAllowedHeaders(getResponseHeaders(xhr), options.networkResponseHeaders);
+
   const request = buildNetworkRequestOrResponse(
-    requestHeaders,
+    networkRequestHeaders,
     requestBodySize,
-    options.captureBodies ? getBodyString(input) : undefined,
+    options.networkCaptureBodies ? getBodyString(input) : undefined,
   );
   const response = buildNetworkRequestOrResponse(
-    responseHeaders,
+    networkResponseHeaders,
     responseBodySize,
-    options.captureBodies ? hint.xhr.responseText : undefined,
+    options.networkCaptureBodies ? hint.xhr.responseText : undefined,
   );
 
   return {
@@ -13625,7 +13702,7 @@ function _prepareXhrData(
     endTimestamp,
     url,
     method,
-    statusCode: statusCode || 0,
+    statusCode,
     request,
     response,
   };
@@ -13657,10 +13734,16 @@ function handleNetworkBreadcrumbs(replay) {
   try {
     const textEncoder = new TextEncoder();
 
+    const { networkDetailAllowUrls, networkCaptureBodies, networkRequestHeaders, networkResponseHeaders } =
+      replay.getOptions();
+
     const options = {
       replay,
       textEncoder,
-      ...replay.getExperimentalOptions().network,
+      networkDetailAllowUrls,
+      networkCaptureBodies,
+      networkRequestHeaders,
+      networkResponseHeaders,
     };
 
     if (client && client.on) {
@@ -13768,9 +13851,66 @@ function handleScope(scope) {
     return null;
   }
 
+  if (newBreadcrumb.category === 'console') {
+    return normalizeConsoleBreadcrumb(newBreadcrumb);
+  }
+
   return createBreadcrumb(newBreadcrumb);
 }
 
+/** exported for tests only */
+function normalizeConsoleBreadcrumb(breadcrumb) {
+  const args = breadcrumb.data && breadcrumb.data.arguments;
+
+  if (!Array.isArray(args) || args.length === 0) {
+    return createBreadcrumb(breadcrumb);
+  }
+
+  let isTruncated = false;
+
+  // Avoid giant args captures
+  const normalizedArgs = args.map(arg => {
+    if (!arg) {
+      return arg;
+    }
+    if (typeof arg === 'string') {
+      if (arg.length > CONSOLE_ARG_MAX_SIZE) {
+        isTruncated = true;
+        return `${arg.slice(0, CONSOLE_ARG_MAX_SIZE)}…`;
+      }
+
+      return arg;
+    }
+    if (typeof arg === 'object') {
+      try {
+        const normalizedArg = normalize(arg, 7);
+        const stringified = JSON.stringify(normalizedArg);
+        if (stringified.length > CONSOLE_ARG_MAX_SIZE) {
+          const fixedJson = fixJson(stringified.slice(0, CONSOLE_ARG_MAX_SIZE));
+          const json = JSON.parse(fixedJson);
+          // We only set this after JSON.parse() was successfull, so we know we didn't run into `catch`
+          isTruncated = true;
+          return json;
+        }
+        return normalizedArg;
+      } catch (e) {
+        // fall back to default
+      }
+    }
+
+    return arg;
+  });
+
+  return createBreadcrumb({
+    ...breadcrumb,
+    data: {
+      ...breadcrumb.data,
+      arguments: normalizedArgs,
+      ...(isTruncated ? { _meta: { warnings: ['CONSOLE_ARG_TRUNCATED'] } } : {}),
+    },
+  });
+}
+
 /**
  * Add global listeners that cannot be removed.
  */
@@ -13795,7 +13935,7 @@ function addGlobalListeners(replay) {
     client.on('afterSendEvent', handleAfterSendEvent(replay));
     client.on('createDsc', (dsc) => {
       const replayId = replay.getSessionId();
-      if (replayId) {
+      if (replayId && replay.isEnabled()) {
         dsc.replay_id = replayId;
       }
     });
@@ -14103,7 +14243,7 @@ function getHandleRecordingEmit(replay) {
       // when an error occurs. Clear any state that happens before this current
       // checkout. This needs to happen before `addEvent()` which updates state
       // dependent on this reset.
-      if (replay.recordingMode === 'error' && isCheckout) {
+      if (replay.recordingMode === 'buffer' && isCheckout) {
         replay.setInitialState();
       }
 
@@ -14129,7 +14269,7 @@ function getHandleRecordingEmit(replay) {
 
       // See note above re: session start needs to reflect the most recent
       // checkout.
-      if (replay.recordingMode === 'error' && replay.session) {
+      if (replay.recordingMode === 'buffer' && replay.session) {
         const { earliestEvent } = replay.getContext();
         if (earliestEvent) {
           replay.session.started = earliestEvent;
@@ -14478,9 +14618,11 @@ class ReplayContainer  {
    __init2() {this.performanceEvents = [];}
 
   /**
-   * Recording can happen in one of two modes:
-   * * session: Record the whole session, sending it continuously
-   * * error: Always keep the last 60s of recording, and when an error occurs, send it immediately
+   * Recording can happen in one of three modes:
+   *   - session: Record the whole session, sending it continuously
+   *   - buffer: Always keep the last 60s of recording, requires:
+   *     - having replaysOnErrorSampleRate > 0 to capture replay when an error occurs
+   *     - or calling `flush()` to send the replay
    */
    __init3() {this.recordingMode = 'session';}
 
@@ -14489,7 +14631,8 @@ class ReplayContainer  {
    * @hidden
    */
     __init4() {this.timeouts = {
-    sessionIdle: SESSION_IDLE_DURATION,
+    sessionIdlePause: SESSION_IDLE_PAUSE_DURATION,
+    sessionIdleExpire: SESSION_IDLE_EXPIRE_DURATION,
     maxSessionLife: MAX_SESSION_LIFE,
   }; }
 
@@ -14550,8 +14693,6 @@ class ReplayContainer  {
     this._debouncedFlush = debounce(() => this._flush(), this._options.flushMinDelay, {
       maxWait: this._options.flushMaxDelay,
     });
-
-    this._experimentalOptions = _getExperimentalOptions(options);
   }
 
   /** Get the event context. */
@@ -14575,58 +14716,102 @@ class ReplayContainer  {
   }
 
   /**
-   * Get the experimental options.
-   * THIS IS INTERNAL AND SUBJECT TO CHANGE!
-   * @hidden
+   * Initializes the plugin based on sampling configuration. Should not be
+   * called outside of constructor.
    */
-   getExperimentalOptions() {
-    return this._experimentalOptions;
+   initializeSampling() {
+    const { errorSampleRate, sessionSampleRate } = this._options;
+
+    // If neither sample rate is > 0, then do nothing - user will need to call one of
+    // `start()` or `startBuffering` themselves.
+    if (errorSampleRate <= 0 && sessionSampleRate <= 0) {
+      return;
+    }
+
+    // Otherwise if there is _any_ sample rate set, try to load an existing
+    // session, or create a new one.
+    const isSessionSampled = this._loadAndCheckSession();
+
+    if (!isSessionSampled) {
+      // This should only occur if `errorSampleRate` is 0 and was unsampled for
+      // session-based replay. In this case there is nothing to do.
+      return;
+    }
+
+    if (!this.session) {
+      // This should not happen, something wrong has occurred
+      this._handleException(new Error('Unable to initialize and create session'));
+      return;
+    }
+
+    if (this.session.sampled && this.session.sampled !== 'session') {
+      // If not sampled as session-based, then recording mode will be `buffer`
+      // Note that we don't explicitly check if `sampled === 'buffer'` because we
+      // could have sessions from Session storage that are still `error` from
+      // prior SDK version.
+      this.recordingMode = 'buffer';
+    }
+
+    this._initializeRecording();
   }
 
   /**
-   * Initializes the plugin.
+   * Start a replay regardless of sampling rate. Calling this will always
+   * create a new session. Will throw an error if replay is already in progress.
    *
    * Creates or loads a session, attaches listeners to varying events (DOM,
    * _performanceObserver, Recording, Sentry SDK, etc)
    */
    start() {
-    this.setInitialState();
-
-    if (!this._loadAndCheckSession()) {
-      return;
+    if (this._isEnabled && this.recordingMode === 'session') {
+      throw new Error('Replay recording is already in progress');
     }
 
-    // If there is no session, then something bad has happened - can't continue
-    if (!this.session) {
-      this._handleException(new Error('No session found'));
-      return;
+    if (this._isEnabled && this.recordingMode === 'buffer') {
+      throw new Error('Replay buffering is in progress, call `flush()` to save the replay');
     }
 
-    if (!this.session.sampled) {
-      // If session was not sampled, then we do not initialize the integration at all.
-      return;
-    }
+    const previousSessionId = this.session && this.session.id;
+
+    const { session } = getSession({
+      timeouts: this.timeouts,
+      stickySession: Boolean(this._options.stickySession),
+      currentSession: this.session,
+      // This is intentional: create a new session-based replay when calling `start()`
+      sessionSampleRate: 1,
+      allowBuffering: false,
+    });
 
-    // If session is sampled for errors, then we need to set the recordingMode
-    // to 'error', which will configure recording with different options.
-    if (this.session.sampled === 'error') {
-      this.recordingMode = 'error';
+    session.previousSessionId = previousSessionId;
+    this.session = session;
+
+    this._initializeRecording();
+  }
+
+  /**
+   * Start replay buffering. Buffers until `flush()` is called or, if
+   * `replaysOnErrorSampleRate` > 0, an error occurs.
+   */
+   startBuffering() {
+    if (this._isEnabled) {
+      throw new Error('Replay recording is already in progress');
     }
 
-    // setup() is generally called on page load or manually - in both cases we
-    // should treat it as an activity
-    this._updateSessionActivity();
+    const previousSessionId = this.session && this.session.id;
 
-    this.eventBuffer = createEventBuffer({
-      useCompression: this._options.useCompression,
+    const { session } = getSession({
+      timeouts: this.timeouts,
+      stickySession: Boolean(this._options.stickySession),
+      currentSession: this.session,
+      sessionSampleRate: 0,
+      allowBuffering: true,
     });
 
-    this._addListeners();
-
-    // Need to set as enabled before we start recording, as `record()` can trigger a flush with a new checkout
-    this._isEnabled = true;
+    session.previousSessionId = previousSessionId;
+    this.session = session;
 
-    this.startRecording();
+    this.recordingMode = 'buffer';
+    this._initializeRecording();
   }
 
   /**
@@ -14641,7 +14826,7 @@ class ReplayContainer  {
         // When running in error sampling mode, we need to overwrite `checkoutEveryNms`
         // Without this, it would record forever, until an error happens, which we don't want
         // instead, we'll always keep the last 60 seconds of replay before an error happened
-        ...(this.recordingMode === 'error' && { checkoutEveryNms: ERROR_CHECKOUT_TIME }),
+        ...(this.recordingMode === 'buffer' && { checkoutEveryNms: BUFFER_CHECKOUT_TIME }),
         emit: getHandleRecordingEmit(this),
         onMutation: this._onMutationHandler,
       });
@@ -14652,17 +14837,18 @@ class ReplayContainer  {
 
   /**
    * Stops the recording, if it was running.
-   * Returns true if it was stopped, else false.
+   *
+   * Returns true if it was previously stopped, or is now stopped,
+   * otherwise false.
    */
    stopRecording() {
     try {
       if (this._stopRecording) {
         this._stopRecording();
         this._stopRecording = undefined;
-        return true;
       }
 
-      return false;
+      return true;
     } catch (err) {
       this._handleException(err);
       return false;
@@ -14673,7 +14859,7 @@ class ReplayContainer  {
    * Currently, this needs to be manually called (e.g. for tests). Sentry SDK
    * does not support a teardown
    */
-   stop(reason) {
+   async stop(reason) {
     if (!this._isEnabled) {
       return;
     }
@@ -14689,12 +14875,24 @@ class ReplayContainer  {
         log(msg);
       }
 
+      // We can't move `_isEnabled` after awaiting a flush, otherwise we can
+      // enter into an infinite loop when `stop()` is called while flushing.
       this._isEnabled = false;
       this._removeListeners();
       this.stopRecording();
+
+      this._debouncedFlush.cancel();
+      // See comment above re: `_isEnabled`, we "force" a flush, ignoring the
+      // `_isEnabled` state of the plugin since it was disabled above.
+      await this._flush({ force: true });
+
+      // After flush, destroy event buffer
       this.eventBuffer && this.eventBuffer.destroy();
       this.eventBuffer = null;
-      this._debouncedFlush.cancel();
+
+      // Clear session from session storage, note this means if a new session
+      // is started after, it will not have `previousSessionId`
+      clearSession(this);
     } catch (err) {
       this._handleException(err);
     }
@@ -14725,6 +14923,45 @@ class ReplayContainer  {
     this.startRecording();
   }
 
+  /**
+   * If not in "session" recording mode, flush event buffer which will create a new replay.
+   * Unless `continueRecording` is false, the replay will continue to record and
+   * behave as a "session"-based replay.
+   *
+   * Otherwise, queue up a flush.
+   */
+   async sendBufferedReplayOrFlush({ continueRecording = true } = {}) {
+    if (this.recordingMode === 'session') {
+      return this.flushImmediate();
+    }
+
+    // Allow flush to complete before resuming as a session recording, otherwise
+    // the checkout from `startRecording` may be included in the payload.
+    // Prefer to keep the error replay as a separate (and smaller) segment
+    // than the session replay.
+    await this.flushImmediate();
+
+    const hasStoppedRecording = this.stopRecording();
+
+    if (!continueRecording || !hasStoppedRecording) {
+      return;
+    }
+
+    // Re-start recording, but in "session" recording mode
+
+    // Reset all "capture on error" configuration before
+    // starting a new recording
+    this.recordingMode = 'session';
+
+    // Once this session ends, we do not want to refresh it
+    if (this.session) {
+      this.session.shouldRefresh = false;
+      this._maybeSaveSession();
+    }
+
+    this.startRecording();
+  }
+
   /**
    * We want to batch uploads of replay events. Save events only if
    * `<flushMinDelay>` milliseconds have elapsed since the last event
@@ -14734,12 +14971,12 @@ class ReplayContainer  {
    * processing and hand back control to caller.
    */
    addUpdate(cb) {
-    // We need to always run `cb` (e.g. in the case of `this.recordingMode == 'error'`)
+    // We need to always run `cb` (e.g. in the case of `this.recordingMode == 'buffer'`)
     const cbResult = cb();
 
     // If this option is turned on then we will only want to call `flush`
     // explicitly
-    if (this.recordingMode === 'error') {
+    if (this.recordingMode === 'buffer') {
       return;
     }
 
@@ -14811,12 +15048,12 @@ class ReplayContainer  {
     const oldSessionId = this.getSessionId();
 
     // Prevent starting a new session if the last user activity is older than
-    // SESSION_IDLE_DURATION. Otherwise non-user activity can trigger a new
+    // SESSION_IDLE_PAUSE_DURATION. Otherwise non-user activity can trigger a new
     // session+recording. This creates noisy replays that do not have much
     // content in them.
     if (
       this._lastActivity &&
-      isExpired(this._lastActivity, this.timeouts.sessionIdle) &&
+      isExpired(this._lastActivity, this.timeouts.sessionIdlePause) &&
       this.session &&
       this.session.sampled === 'session'
     ) {
@@ -14866,6 +15103,30 @@ class ReplayContainer  {
     this._context.urls.push(url);
   }
 
+  /**
+   * Initialize and start all listeners to varying events (DOM,
+   * Performance Observer, Recording, Sentry SDK, etc)
+   */
+   _initializeRecording() {
+    this.setInitialState();
+
+    // this method is generally called on page load or manually - in both cases
+    // we should treat it as an activity
+    this._updateSessionActivity();
+
+    this.eventBuffer = createEventBuffer({
+      useCompression: this._options.useCompression,
+    });
+
+    this._removeListeners();
+    this._addListeners();
+
+    // Need to set as enabled before we start recording, as `record()` can trigger a flush with a new checkout
+    this._isEnabled = true;
+
+    this.startRecording();
+  }
+
   /** A wrapper to conditionally capture exceptions. */
    _handleException(error) {
     (typeof __SENTRY_DEBUG__ === 'undefined' || __SENTRY_DEBUG__) && logger.error('[Replay]', error);
@@ -14885,7 +15146,7 @@ class ReplayContainer  {
       stickySession: Boolean(this._options.stickySession),
       currentSession: this.session,
       sessionSampleRate: this._options.sessionSampleRate,
-      errorSampleRate: this._options.errorSampleRate,
+      allowBuffering: this._options.errorSampleRate > 0,
     });
 
     // If session was newly created (i.e. was not loaded from storage), then
@@ -14902,7 +15163,7 @@ class ReplayContainer  {
     this.session = session;
 
     if (!this.session.sampled) {
-      this.stop('session unsampled');
+      void this.stop('session unsampled');
       return false;
     }
 
@@ -15026,7 +15287,7 @@ class ReplayContainer  {
     const isSessionActive = this.checkAndHandleExpiredSession();
 
     if (!isSessionActive) {
-      // If the user has come back to the page within SESSION_IDLE_DURATION
+      // If the user has come back to the page within SESSION_IDLE_PAUSE_DURATION
       // ms, we will re-use the existing session, otherwise create a new
       // session
       (typeof __SENTRY_DEBUG__ === 'undefined' || __SENTRY_DEBUG__) && logger.log('[Replay] Document has become active, but session has expired');
@@ -15100,7 +15361,7 @@ class ReplayContainer  {
    * Only flush if `this.recordingMode === 'session'`
    */
    _conditionalFlush() {
-    if (this.recordingMode === 'error') {
+    if (this.recordingMode === 'buffer') {
       return;
     }
 
@@ -15195,7 +15456,7 @@ class ReplayContainer  {
       // This means we retried 3 times and all of them failed,
       // or we ran into a problem we don't want to retry, like rate limiting.
       // In this case, we want to completely stop the replay - otherwise, we may get inconsistent segments
-      this.stop('sendReplay');
+      void this.stop('sendReplay');
 
       const client = getCurrentHub().getClient();
 
@@ -15209,8 +15470,12 @@ class ReplayContainer  {
    * Flush recording data to Sentry. Creates a lock so that only a single flush
    * can be active at a time. Do not call this directly.
    */
-   __init16() {this._flush = async () => {
-    if (!this._isEnabled) {
+   __init16() {this._flush = async ({
+    force = false,
+  }
+
+ = {}) => {
+    if (!this._isEnabled && !force) {
       // This can happen if e.g. the replay was stopped because of exceeding the retry limit
       return;
     }
@@ -15291,23 +15556,6 @@ class ReplayContainer  {
   };}
 }
 
-function _getExperimentalOptions(options) {
-  const requestHeaders = options._experiments.captureRequestHeaders || [];
-  const responseHeaders = options._experiments.captureResponseHeaders || [];
-  const captureBodies = options._experiments.captureNetworkBodies || false;
-
-  // Add defaults
-  const defaultHeaders = ['content-length', 'content-type', 'accept'];
-
-  return {
-    network: {
-      captureBodies,
-      requestHeaders: [...defaultHeaders, ...requestHeaders.map(header => header.toLowerCase())],
-      responseHeaders: [...defaultHeaders, ...responseHeaders.map(header => header.toLowerCase())],
-    },
-  };
-}
-
 function getOption(
   selectors,
   defaultSelectors,
@@ -15411,6 +15659,8 @@ function isElectronNodeRenderer() {
 const MEDIA_SELECTORS =
   'img,image,svg,video,object,picture,embed,map,audio,link[rel="icon"],link[rel="apple-touch-icon"]';
 
+const DEFAULT_NETWORK_HEADERS = ['content-length', 'content-type', 'accept'];
+
 let _initialized = false;
 
 /**
@@ -15451,6 +15701,11 @@ class Replay  {
     maskAllInputs = true,
     blockAllMedia = true,
 
+    networkDetailAllowUrls = [],
+    networkCaptureBodies = true,
+    networkRequestHeaders = [],
+    networkResponseHeaders = [],
+
     mask = [],
     unmask = [],
     block = [],
@@ -15509,6 +15764,11 @@ class Replay  {
       errorSampleRate,
       useCompression,
       blockAllMedia,
+      networkDetailAllowUrls,
+      networkCaptureBodies,
+      networkRequestHeaders: _getMergedNetworkHeaders(networkRequestHeaders),
+      networkResponseHeaders: _getMergedNetworkHeaders(networkResponseHeaders),
+
       _experiments,
     };
 
@@ -15562,14 +15822,7 @@ Sentry.init({ replaysOnErrorSampleRate: ${errorSampleRate} })`,
   }
 
   /**
-   * We previously used to create a transaction in `setupOnce` and it would
-   * potentially create a transaction before some native SDK integrations have run
-   * and applied their own global event processor. An example is:
-   * https://github.com/getsentry/sentry-javascript/blob/b47ceafbdac7f8b99093ce6023726ad4687edc48/packages/browser/src/integrations/useragent.ts
-   *
-   * So we call `replay.setup` in next event loop as a workaround to wait for other
-   * global event processors to finish. This is no longer needed, but keeping it
-   * here to avoid any future issues.
+   * Setup and initialize replay container
    */
    setupOnce() {
     if (!isBrowser()) {
@@ -15578,12 +15831,20 @@ Sentry.init({ replaysOnErrorSampleRate: ${errorSampleRate} })`,
 
     this._setup();
 
-    // XXX: See method comments above
-    setTimeout(() => this.start());
+    // Once upon a time, we tried to create a transaction in `setupOnce` and it would
+    // potentially create a transaction before some native SDK integrations have run
+    // and applied their own global event processor. An example is:
+    // https://github.com/getsentry/sentry-javascript/blob/b47ceafbdac7f8b99093ce6023726ad4687edc48/packages/browser/src/integrations/useragent.ts
+    //
+    // So we call `this._initialize()` in next event loop as a workaround to wait for other
+    // global event processors to finish. This is no longer needed, but keeping it
+    // here to avoid any future issues.
+    setTimeout(() => this._initialize());
   }
 
   /**
-   * Initializes the plugin.
+   * Start a replay regardless of sampling rate. Calling this will always
+   * create a new session. Will throw an error if replay is already in progress.
    *
    * Creates or loads a session, attaches listeners to varying events (DOM,
    * PerformanceObserver, Recording, Sentry SDK, etc)
@@ -15596,27 +15857,43 @@ Sentry.init({ replaysOnErrorSampleRate: ${errorSampleRate} })`,
     this._replay.start();
   }
 
+  /**
+   * Start replay buffering. Buffers until `flush()` is called or, if
+   * `replaysOnErrorSampleRate` > 0, until an error occurs.
+   */
+   startBuffering() {
+    if (!this._replay) {
+      return;
+    }
+
+    this._replay.startBuffering();
+  }
+
   /**
    * Currently, this needs to be manually called (e.g. for tests). Sentry SDK
    * does not support a teardown
    */
    stop() {
     if (!this._replay) {
-      return;
+      return Promise.resolve();
     }
 
-    this._replay.stop();
+    return this._replay.stop();
   }
 
   /**
-   * Immediately send all pending events.
+   * If not in "session" recording mode, flush event buffer which will create a new replay.
+   * Unless `continueRecording` is false, the replay will continue to record and
+   * behave as a "session"-based replay.
+   *
+   * Otherwise, queue up a flush.
    */
-   flush() {
+   flush(options) {
     if (!this._replay || !this._replay.isEnabled()) {
-      return;
+      return Promise.resolve();
     }
 
-    return this._replay.flushImmediate();
+    return this._replay.sendBufferedReplayOrFlush(options);
   }
 
   /**
@@ -15629,6 +15906,16 @@ Sentry.init({ replaysOnErrorSampleRate: ${errorSampleRate} })`,
 
     return this._replay.getSessionId();
   }
+  /**
+   * Initializes replay.
+   */
+   _initialize() {
+    if (!this._replay) {
+      return;
+    }
+
+    this._replay.initializeSampling();
+  }
 
   /** Setup the integration. */
    _setup() {
@@ -15678,6 +15965,10 @@ function loadReplayOptionsFromClient(initialOptions) {
   return finalOptions;
 }
 
+function _getMergedNetworkHeaders(headers) {
+  return [...DEFAULT_NETWORK_HEADERS, ...headers.map(header => header.toLowerCase())];
+}
+
 /**
  * Polyfill for the optional chain operator, `?.`, given previous conversion of the expression into an array of values,
  * descriptors, and functions.
@@ -16115,6 +16406,9 @@ class Postgres  {
         const span = _optionalChain([parentSpan, 'optionalAccess', _6 => _6.startChild, 'call', _7 => _7({
           description: typeof config === 'string' ? config : (config ).text,
           op: 'db',
+          data: {
+            'db.system': 'postgresql',
+          },
         })]);
 
         if (typeof callback === 'function') {
@@ -16191,6 +16485,9 @@ class Mysql  {constructor() { Mysql.prototype.__init.call(this); }
         const span = _optionalChain([parentSpan, 'optionalAccess', _4 => _4.startChild, 'call', _5 => _5({
           description: typeof options === 'string' ? options : (options ).sql,
           op: 'db',
+          data: {
+            'db.system': 'mysql',
+          },
         })]);
 
         if (typeof callback === 'function') {
@@ -16412,6 +16709,7 @@ class Mongo  {
       collectionName: collection.collectionName,
       dbName: collection.dbName,
       namespace: collection.namespace,
+      'db.system': 'mongodb',
     };
     const spanContext = {
       op: 'db',
@@ -16500,7 +16798,10 @@ class Prisma  {
     this._client.$use((params, next) => {
       const action = params.action;
       const model = params.model;
-      return trace({ name: model ? `${model} ${action}` : action, op: 'db.sql.prisma' }, () => next(params));
+      return trace(
+        { name: model ? `${model} ${action}` : action, op: 'db.sql.prisma', data: { 'db.system': 'prisma' } },
+        () => next(params),
+      );
     });
   }
 } Prisma.__initStatic();
@@ -29664,7 +29965,7 @@ const configGenerator = () => {
     let release;
     try {
         environment !== null && environment !== void 0 ? environment : (environment = "staging");
-        release !== null && release !== void 0 ? release : (release = "1.1.21");
+        release !== null && release !== void 0 ? release : (release = "1.1.22");
     }
     catch (_a) {
         console.error('sentry configGenerator error');