In the case that the replayer triggers multiple FullSnapshot events, it
will call waitForStylesheetLoad multiple times. When the replayer
resumes, it could already have a timeoffset set from a previous
resume in a previous waitForStylesheetLoad call. In this case our new
timeoffset should be the value of our current time in the replay
(timer.timeOffset + getTimeOffset()). To solve this, I created a public
getCurrentTime function which correctly returns the time in the replay
and used that as our new timeoffset when resuming from a stylesheet
load.
Broken CSS inside a page will throw an error on our behalf. This should
be ignored because we are not in control of the CSS on the page we are
recording.
Previously we use a regexp to match all the CSS selectors and add
our hover class name to it, which has been proved not solid and
may be very slow in some situation.
Using a production ready css parser can handle this better and also
provide ability's to do more accurate things to the recorded
stylesheets.
This is the record side impl of custom event, according to the
issue, we may also add first-class support for the custom event
tag like display color labels in the replayer-ui.
'pointer-events: none' prevents the user from interacting with the DOM
inside of the iframe. This prevents accidental tampering by a user when
watching replays such as link clicks or DOM manipulation.
pointer-events supported by 97.15% usage: https://caniuse.com/#feat=pointer-events