Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(replay): Upgrade to rrweb 2.0 #8760

Merged
merged 26 commits into from
Sep 27, 2023
Merged

feat(replay): Upgrade to rrweb 2.0 #8760

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
26 commits
Select commit Hold shift + click to select a range
29ccdb4
!!!! export some types
billyvg Jul 19, 2023
3aae0e5
feat: update references to `__sn` for serialized node, instead use mi…
billyvg Jul 20, 2023
5e5946c
feat: add new mask attributes fn
billyvg Jul 20, 2023
973f93f
update snapshots
billyvg Jul 20, 2023
96fb1f1
temp remove maskInputSelectors (use maskTextSelector)
billyvg Jul 25, 2023
7a135a1
accidentally a letter
billyvg Jul 26, 2023
40c3937
feat can unmask attributes, masks input type=button/submit (only with…
billyvg Jul 28, 2023
4961d90
add error handler
billyvg Aug 9, 2023
989b5db
add type + comments
billyvg Aug 9, 2023
fd08182
err bad merge conflict
billyvg Aug 9, 2023
5217ef8
fix imports + format
billyvg Aug 9, 2023
5bc66e6
update snaps
billyvg Aug 9, 2023
82da8e2
fix tests + snapshots
billyvg Aug 9, 2023
6da7eab
bump up size limits, sorry
billyvg Aug 9, 2023
86cd4a3
typo
billyvg Aug 10, 2023
e1da4ee
remove unused *InputSelector
billyvg Aug 10, 2023
6a15bd9
review fixes (maskAttribue -> fn and try/catch
billyvg Aug 11, 2023
0168c6d
skip flaky webkit test
billyvg Aug 11, 2023
d9005ee
use rrweb2 packages and update changelog
billyvg Aug 9, 2023
9988654
add explicit force flushes
billyvg Aug 18, 2023
23b092e
update snaps
billyvg Aug 18, 2023
6e1d588
update size limit
billyvg Aug 18, 2023
bc0a000
skip test for webkit
billyvg Aug 28, 2023
977231c
remove ts-ignore
billyvg Sep 13, 2023
06feff5
reset snapshots
billyvg Sep 21, 2023
640901c
Revert "reset snapshots"
billyvg Sep 21, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions .size-limit.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ module.exports = [
path: 'packages/browser/build/npm/esm/index.js',
import: '{ init, Replay, BrowserTracing }',
gzip: true,
limit: '80 KB',
limit: '90 KB',
},
{
name: '@sentry/browser (incl. Tracing) - Webpack (gzipped)',
Expand Down Expand Up @@ -47,7 +47,7 @@ module.exports = [
name: '@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (minified & uncompressed)',
path: 'packages/browser/build/bundles/bundle.tracing.replay.min.js',
gzip: false,
limit: '250 KB',
limit: '260 KB',
},
{
name: '@sentry/browser (incl. Tracing) - ES6 CDN Bundle (minified & uncompressed)',
Expand Down Expand Up @@ -77,7 +77,7 @@ module.exports = [
path: 'packages/react/build/esm/index.js',
import: '{ init, BrowserTracing, Replay }',
gzip: true,
limit: '80 KB',
limit: '90 KB',
},
{
name: '@sentry/react - Webpack (gzipped)',
Expand All @@ -93,7 +93,7 @@ module.exports = [
path: 'packages/nextjs/build/esm/client/index.js',
import: '{ init, BrowserTracing, Replay }',
gzip: true,
limit: '100 KB',
limit: '110 KB',
},
{
name: '@sentry/nextjs Client - Webpack (gzipped)',
Expand Down
21 changes: 21 additions & 0 deletions CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,27 @@

## Unreleased

### Important Changes

- **feat(replay): Upgrade to rrweb2**

This is fully backwards compatible with prior versions of the Replay SDK. The only breaking change that we will making is to not be masking `aria-label` by default. The reason for this change is to align with our core SDK which also does not mask `aria-label`. This change also enables better support of searching by clicks.

Another change that needs to be highlighted is the 13% bundle size increase. This bundle size increase is necessary to bring improved recording performance and improved replay fidelity, especially in regards to web components and iframes. We will be investigating the reduction of the bundle size in [this PR](https://github.com/getsentry/sentry-javascript/issues/8815).

Here are benchmarks comparing the version 1 of rrweb to version 2

| metric | v1 | v2 |
| --------- | ---------- | ---------- |
| lcp | 1486.06 ms | 1529.11 ms |
| cls | 0.40 ms | 0.40 ms |
| fid | 1.53 ms | 1.50 ms |
| tbt | 3207.22 ms | 3036.80 ms |
| memoryAvg | 131.83 MB | 124.84 MB |
| memoryMax | 324.8 MB | 339.03 MB |
| netTx | 282.67 KB | 272.51 KB |
| netRx | 8.02 MB | 8.07 MB |

- "You miss 100 percent of the chances you don't take. — Wayne Gretzky" — Michael Scott

## 7.72.0
Expand Down
2 changes: 1 addition & 1 deletion packages/browser-integration-tests/suites/replay/customEvents/test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -117,7 +117,7 @@ sentryTest(
nodeId: expect.any(Number),
node: {
attributes: {
'aria-label': '** ***** ** **********',
'aria-label': 'An Error in aria-label',
class: 'btn btn-error',
id: 'error',
role: 'button',
Expand Down
2 changes: 1 addition & 1 deletion packages/browser-integration-tests/suites/replay/fileInput/test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { expect } from '@playwright/test';
import type { inputData } from '@sentry-internal/rrweb';
import { IncrementalSource } from '@sentry-internal/rrweb';
import type { inputData } from '@sentry-internal/rrweb/typings/types';

import { sentryTest } from '../../../utils/fixtures';
import type { IncrementalRecordingSnapshot } from '../../../utils/replayHelpers';
Expand Down
11 changes: 6 additions & 5 deletions ...r-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-1-snap-incremental
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"source": 2,
"type": 1,
"id": 9,
"x": 41,
"y": 18
"x": 41.810001373291016,
"y": 18.479999542236328
},
"timestamp": [timestamp]
},
Expand All @@ -25,8 +25,8 @@
"source": 2,
"type": 0,
"id": 9,
"x": 41,
"y": 18
"x": 41.810001373291016,
"y": 18.479999542236328
},
"timestamp": [timestamp]
},
Expand All @@ -37,7 +37,8 @@
"type": 2,
"id": 9,
"x": 41,
"y": 18
"y": 18,
"pointerType": 0
},
"timestamp": [timestamp]
}
Expand Down
11 changes: 6 additions & 5 deletions ...tion-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-1-snap-incremental-chromium
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"source": 2,
"type": 1,
"id": 9,
"x": 41,
"y": 18
"x": 41.810001373291016,
"y": 18.479999542236328
},
"timestamp": [timestamp]
},
Expand All @@ -25,8 +25,8 @@
"source": 2,
"type": 0,
"id": 9,
"x": 41,
"y": 18
"x": 41.810001373291016,
"y": 18.479999542236328
},
"timestamp": [timestamp]
},
Expand All @@ -37,7 +37,8 @@
"type": 2,
"id": 9,
"x": 41,
"y": 18
"y": 18,
"pointerType": 0
},
"timestamp": [timestamp]
}
Expand Down
11 changes: 6 additions & 5 deletions ...r-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-3-snap-incremental
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"source": 2,
"type": 1,
"id": 9,
"x": 41,
"y": 18
"x": 41.810001373291016,
"y": 18.479999542236328
},
"timestamp": [timestamp]
},
Expand All @@ -25,8 +25,8 @@
"source": 2,
"type": 0,
"id": 9,
"x": 41,
"y": 18
"x": 41.810001373291016,
"y": 18.479999542236328
},
"timestamp": [timestamp]
},
Expand All @@ -37,7 +37,8 @@
"type": 2,
"id": 9,
"x": 41,
"y": 18
"y": 18,
"pointerType": 0
},
"timestamp": [timestamp]
}
Expand Down
11 changes: 6 additions & 5 deletions ...tion-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-3-snap-incremental-chromium
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"source": 2,
"type": 1,
"id": 9,
"x": 41,
"y": 18
"x": 41.810001373291016,
"y": 18.479999542236328
},
"timestamp": [timestamp]
},
Expand All @@ -25,8 +25,8 @@
"source": 2,
"type": 0,
"id": 9,
"x": 41,
"y": 18
"x": 41.810001373291016,
"y": 18.479999542236328
},
"timestamp": [timestamp]
},
Expand All @@ -37,7 +37,8 @@
"type": 2,
"id": 9,
"x": 41,
"y": 18
"y": 18,
"pointerType": 0
},
"timestamp": [timestamp]
}
Expand Down
11 changes: 6 additions & 5 deletions ...r-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-5-snap-incremental
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"source": 2,
"type": 1,
"id": 12,
"x": 41,
"y": 90
"x": 41.810001373291016,
"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand All @@ -25,8 +25,8 @@
"source": 2,
"type": 0,
"id": 12,
"x": 41,
"y": 90
"x": 41.810001373291016,
"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand All @@ -37,7 +37,8 @@
"type": 2,
"id": 12,
"x": 41,
"y": 90
"y": 90,
"pointerType": 0
},
"timestamp": [timestamp]
}
Expand Down
11 changes: 6 additions & 5 deletions ...tion-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-5-snap-incremental-chromium
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"source": 2,
"type": 1,
"id": 12,
"x": 41,
"y": 90
"x": 41.810001373291016,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

are we sure these do not flake 😅

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Will double check where these are even used, does seem sus

Copy link
Member Author

@billyvg billyvg Aug 11, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ok I assume rrweb updated something so we get more precision from a quick look at the code, the positions should be coming from the mouse event itself

hasn't flaked so 🤞

"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand All @@ -25,8 +25,8 @@
"source": 2,
"type": 0,
"id": 12,
"x": 41,
"y": 90
"x": 41.810001373291016,
"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand All @@ -37,7 +37,8 @@
"type": 2,
"id": 12,
"x": 41,
"y": 90
"y": 90,
"pointerType": 0
},
"timestamp": [timestamp]
}
Expand Down
11 changes: 6 additions & 5 deletions ...r-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-6-snap-incremental
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"source": 2,
"type": 1,
"id": 15,
"x": 157,
"y": 90
"x": 157.13999938964844,
"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand Down Expand Up @@ -34,8 +34,8 @@
"source": 2,
"type": 0,
"id": 15,
"x": 157,
"y": 90
"x": 157.13999938964844,
"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand All @@ -46,7 +46,8 @@
"type": 2,
"id": 15,
"x": 157,
"y": 90
"y": 90,
"pointerType": 0
},
"timestamp": [timestamp]
}
Expand Down
11 changes: 6 additions & 5 deletions ...tion-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-6-snap-incremental-chromium
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"source": 2,
"type": 1,
"id": 15,
"x": 157,
"y": 90
"x": 157.13999938964844,
"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand Down Expand Up @@ -34,8 +34,8 @@
"source": 2,
"type": 0,
"id": 15,
"x": 157,
"y": 90
"x": 157.13999938964844,
"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand All @@ -46,7 +46,8 @@
"type": 2,
"id": 15,
"x": 157,
"y": 90
"y": 90,
"pointerType": 0
},
"timestamp": [timestamp]
}
Expand Down
11 changes: 6 additions & 5 deletions ...r-integration-tests/suites/replay/multiple-pages/test.ts-snapshots/seg-7-snap-incremental
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"source": 2,
"type": 1,
"id": 12,
"x": 41,
"y": 90
"x": 41.810001373291016,
"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand Down Expand Up @@ -34,8 +34,8 @@
"source": 2,
"type": 0,
"id": 12,
"x": 41,
"y": 90
"x": 41.810001373291016,
"y": 90.37000274658203
},
"timestamp": [timestamp]
},
Expand All @@ -46,7 +46,8 @@
"type": 2,
"id": 12,
"x": 41,
"y": 90
"y": 90,
"pointerType": 0
},
"timestamp": [timestamp]
}
Expand Down
Loading