Is there an existing issue for this?

• I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
• I have reviewed the documentation https://docs.sentry.io/
• I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases

How do you use Sentry?

Sentry Saas (sentry.io)

Which package are you using?

Browser CDN bundle

SDK Version

7.36.0

Framework Version

No response

Link to Sentry event

https://auxbus.sentry.io/replays/javascript:c37480da967c443ca75a5a7784ac952b/?project=1375267&query=duration%3A%3E%3D5&referrer=%2Freplays%2F%3AreplaySlug%2F&statsPeriod=14d&yAxis=count%28%29&t=162

SDK Setup

        Sentry.init({
            dsn: 'https://435a8c34ae0641a5ae9d3da6d7d9afa7@o224628.ingest.sentry.io/1375267',
            environment: '{{ App::environment() }}',
            replaysSessionSampleRate: {{ prod() ? '0.1' : '1.0' }},
            replaysOnErrorSampleRate: 1.0,
            integrations: [
                new Sentry.Integrations.Replay({
                    maskAllInputs: false,
                    maskAllText: false,
                    blockAllMedia: false
                })
            ]
        });

Steps to Reproduce

I've noticed certain browser elements are not rendering in the replay. For example:

• At 2:32 in that video, I click the dropdown but the options do not appear.
• Around 2:36, I also click the browser's lock icon to select microphone permissions, but this is also not shown.

My guess is that due to how you are reconstructing this, things like this cannot be shown like a screen recording. But perhaps it can be reconstructed in some way? There may be other things like this, but these are the ones I've noticed.

Also, is there a click indicator? If there is, it seems too fast/subtle for me to notice.

Expected Result

See above

Actual Result

See above