diff --git a/packages/replay/src/coreHandlers/handleBeforeSendEvent.ts b/packages/replay/src/coreHandlers/handleBeforeSendEvent.ts index d7276897497e..9427bc60e45b 100644 --- a/packages/replay/src/coreHandlers/handleBeforeSendEvent.ts +++ b/packages/replay/src/coreHandlers/handleBeforeSendEvent.ts @@ -31,8 +31,9 @@ function handleHydrationError(replay: ReplayContainer, event: ErrorEvent): void // Example https://reactjs.org/docs/error-decoder.html?invariant=423 exceptionValue.match(/reactjs\.org\/docs\/error-decoder\.html\?invariant=(418|419|422|423|425)/) || // Development builds of react-dom - // Example Text: content did not match. Server: "A" Client: "B" - exceptionValue.match(/(hydration|content does not match|did not match)/i) + // Error 1: Hydration failed because the initial UI does not match what was rendered on the server. + // Error 2: Text content does not match server-rendered HTML. Warning: Text content did not match. + exceptionValue.match(/(does not match server-rendered HTML|Hydration failed because)/i) ) { const breadcrumb = createBreadcrumb({ category: 'replay.hydrate-error', diff --git a/packages/replay/test/integration/coreHandlers/handleBeforeSendEvent.test.ts b/packages/replay/test/integration/coreHandlers/handleBeforeSendEvent.test.ts index 92cdc5a88698..a1462b974711 100644 --- a/packages/replay/test/integration/coreHandlers/handleBeforeSendEvent.test.ts +++ b/packages/replay/test/integration/coreHandlers/handleBeforeSendEvent.test.ts @@ -27,7 +27,8 @@ describe('Integration | coreHandlers | handleBeforeSendEvent', () => { const addBreadcrumbSpy = jest.spyOn(replay, 'throttledAddEvent'); const error = Error(); - error.exception.values[0].value = 'Text content did not match. Server: "A" Client: "B"'; + error.exception.values[0].value = + 'Text content does not match server-rendered HTML. Warning: Text content did not match.'; handler(error); expect(addBreadcrumbSpy).toHaveBeenCalledTimes(1);