Clicks in session replay are misaligned from the target element

[billyvg]

Description

Clicks in replays can be misaligned from the target element.

We've discovered one instance where this happens is with custom fonts not being able to be loaded in the replayer due to CORS. This can cause rendering differences between production and during replay, which means that scrolling will be in correct due to the differing dimensions. Masking w/ variable-width fonts can also cause similar issues.

Remote asset caching could be a solution here, but the user can allow ensure that the server hosting their custom fonts allows *.sentry.io to access it (via Access-Control-Allow-Origin).

[billyvg]

Example replay https://kula-app.sentry.io/replays/16b3dbe0b266468eb32bcb67071efd91/