diff --git a/packages/replay/jest.setup.ts b/packages/replay/jest.setup.ts index 26f9ea346a0d..640deeccf777 100644 --- a/packages/replay/jest.setup.ts +++ b/packages/replay/jest.setup.ts @@ -1,12 +1,15 @@ /* eslint-disable @typescript-eslint/no-unsafe-member-access */ import { getCurrentHub } from '@sentry/core'; import type { ReplayRecordingData, Transport } from '@sentry/types'; +import {TextEncoder} from 'util'; import type { ReplayContainer, Session } from './src/types'; // @ts-ignore TS error, this is replaced in prod builds bc of rollup global.__SENTRY_REPLAY_VERSION__ = 'version:Test'; +(global as any).TextEncoder = TextEncoder; + type MockTransport = jest.MockedFunction; jest.mock('./src/util/isBrowser', () => { diff --git a/packages/replay/src/util/createReplayEnvelope.ts b/packages/replay/src/util/createReplayEnvelope.ts index afc445e83d71..de269fdf9905 100644 --- a/packages/replay/src/util/createReplayEnvelope.ts +++ b/packages/replay/src/util/createReplayEnvelope.ts @@ -18,7 +18,11 @@ export function createReplayEnvelope( [ { type: 'replay_recording', - length: recordingData.length, + // If string then we need to encode to UTF8, otherwise will have + // wrong size. TextEncoder has similar browser support to + // MutationObserver, although it does not accept IE11. + length: + typeof recordingData === 'string' ? new TextEncoder().encode(recordingData).length : recordingData.length, }, recordingData, ], diff --git a/packages/utils/src/envelope.ts b/packages/utils/src/envelope.ts index 8dcb7c492fed..b5d315e1cd81 100644 --- a/packages/utils/src/envelope.ts +++ b/packages/utils/src/envelope.ts @@ -53,6 +53,9 @@ export function forEachEnvelopeItem( }); } +/** + * Encode a string to UTF8. + */ function encodeUTF8(input: string, textEncoder?: TextEncoderInternal): Uint8Array { const utf8 = textEncoder || new TextEncoder(); return utf8.encode(input);