feat(replay): Upgrade to rrweb 2.0

[billyvg]

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.

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

[github-actions]

size-limit report 📦

Path	Size
@sentry/browser (incl. Tracing, Replay) - Webpack (gzipped)	84.25 KB (+11.48% 🔺)
@sentry/browser (incl. Tracing) - Webpack (gzipped)	31.46 KB (0%)
@sentry/browser - Webpack (gzipped)	22.06 KB (0%)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (gzipped)	78.7 KB (+11.98% 🔺)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (gzipped)	28.57 KB (+0.01% 🔺)
@sentry/browser - ES6 CDN Bundle (gzipped)	20.65 KB (+0.01% 🔺)
@sentry/browser (incl. Tracing, Replay) - ES6 CDN Bundle (minified & uncompressed)	254.13 KB (+14.37% 🔺)
@sentry/browser (incl. Tracing) - ES6 CDN Bundle (minified & uncompressed)	86.57 KB (0%)
@sentry/browser - ES6 CDN Bundle (minified & uncompressed)	61.42 KB (0%)
@sentry/browser (incl. Tracing) - ES5 CDN Bundle (gzipped)	31.43 KB (+0.01% 🔺)
@sentry/react (incl. Tracing, Replay) - Webpack (gzipped)	84.28 KB (+11.48% 🔺)
@sentry/react - Webpack (gzipped)	22.09 KB (0%)
@sentry/nextjs Client (incl. Tracing, Replay) - Webpack (gzipped)	102.22 KB (+9.35% 🔺)
@sentry/nextjs Client - Webpack (gzipped)	51.04 KB (0%)

[billyvg]

This isn't needed since it's just duplicate of maskSelector/unmaskSelector

[mydea]

are we sure these do not flake 😅

[billyvg]

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

[billyvg]

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 🤞

[mydea]

Overall looks great, left a few small comments. Bundle size increases are sad but I guess it is what it is - eventually we can take a look at potential savings by shaking out stuff (?) we don't need.

I didn't look over the test changes in detail, I trust you that they make sense xD

[AbhiPrasad]

Bundle size increases are sad but I guess it is what it is - eventually we can take a look at potential savings by shaking out stuff (?) we don't need

I skimmed over the rrweb codebase, there's some improvements that can be upstreamed. Looking at https://unpkg.com/rrweb@2.0.0-alpha.4/dist/rrweb.min.js some easy ones are to use terser and minify private class properties and convert some classes to objects.

[billyvg]

sessionInactive test is a bit flakey for webkit -- looks like the ids are off by 15, which is the number of nodes in the snapshot. https://github.com/getsentry/sentry-javascript/actions/runs/5834071494/job/15822830869?pr=8760#step:13:884

[billyvg]

Node IDs are flaking for this test: 1) [webkit] › suites/replay/sessionExpiry/test.ts:17:11 › handles an expired session

[mydea]

[AbhiPrasad]

Congrats on the ship @billyvg!