* Don't store the full style attribute change, as small mutations to single style properties result in storage of a rewrite for the full style attribute, which may be very large.
Had an example of a website using http://schillmania.com/projects/snowstorm/ where many direct style changes were happening every second across many 'snowflake' elements, with each attribute change looking like:
"style":"color: rgb(255, 255, 255); position: absolute; width: 8px; height: 8px; font-family: arial, verdana; overflow: hidden; font-weight: normal; z-index: 0; display: block; bottom: auto; opacity: 1; padding: 0px; margin: 0px; font-size: 10px; line-height: 10px; text-align: center; vertical-align: baseline; left: 242.807px; top: 85.7332px;"
even though maybe just the left/top position had been changed
* More compact storage for the much more common attribute value without an `!important` flag - saves 6 chars per style attr in the json :)
* Fix bug: attributes weren't getting removed after changes to treatment of 'style' attributes
* Fix sheet insertion
Restore skip duration
Use virtualStyleRulesMap to re-populate stylesheet on Flush event
Clear virtualStyleRulesMap after flush applied
* Support rule deletion in virtual processing
* Simply restoreNodeSheet with early aborts
* Encountered a bug where firstFullSnapshot was played twice because timer was immediately started and reached the snapshot before the setTimeout returned
* Ignoring a FullSnapshot needs to be a one-time only thing, as otherwise we'll ignore it after scrubbing (restarting play head at a particular time). This is a problem if mutations have altered the player state, and we try to replay those mutations, so we e.g. try to remove an element that has already been removed because we haven't reset the FullSnapshot state
* Some `npm run typings` related fixups
* add basic html snapshot functionality
* move restoreNodeSheet to it's own module
* Refactor virtual style rules to buffer changes.
Only applies changes on flush.
`virtualStyleRulesMap` now works with strings instead of CSSRules.
CSSRules can only be via made `.insertRule` on CSSStyleSheet in most browsers.
And `new CSSStyleSheet()` only works in Chrome currently.
* remove unused code
* move VirtualStyleRules from CSSRule to string in tests
* correct paths for tests
* naming
* create and restore style snapshots for virtual nodes
* update replayer snapshot
* move storeCSSRules to virtual-styles.ts
* try/catch access to .sheet in case of access errors
* clean up tests
Co-authored-by: Vladimir Milenko <vladimir.milenko@uber.com>
Co-authored-by: Eoghan Murray <eoghan@getthere.ie>
* add `userTriggered`
* update snapshots to add userTriggered
* add `userTriggered`
* update snapshots to add userTriggered
* update snapshot to include userTrigger
* only set userTriggered on `userTriggeredOnInput: true`
* What is user triggered?
* correct snapshot
* add second radio to demonstrate userTriggered
* Encountered a bug where firstFullSnapshot was played twice because timer was immediately started and reached the snapshot before the setTimeout returned
* Ignoring a FullSnapshot needs to be a one-time only thing, as otherwise we'll ignore it after scrubbing (restarting play head at a particular time). This is a problem if mutations have altered the player state, and we try to replay those mutations, so we e.g. try to remove an element that has already been removed because we haven't reset the FullSnapshot state
* Some `npm run typings` related fixups
* mask value attribute changes for elements in maskInputOptions
* refactor initInputObserver to use maskInputValue
* add todo
* Fix typo
* upgrade rrweb-snapshot to 1.1.6
* move maskInputValue to rrweb-snapshot
* temp: plugin API
* fix a bug in the replay handler and rename some type names.
* update integration test
* improve plugin types and handle legacy log data
* use different naming in record and replay bundles
* delete unreferenced types
Co-authored-by: Lucky Feng <294889365@qq.com>
* add failing test
* assert order of events
* defer attaching of iframe till FullSnapshot is done
Fixes: https://github.com/rrweb-io/rrweb/issues/567
* correct event order in iframe integration test snapshot
* trigger build
* trigger build
* Move settimeout responsibility to snapshot
https://github.com/rrweb-io/rrweb-snapshot/pull/78
* upgrade rrweb-snapshot to 1.1.4
* DRY record tests
* cleanup
* Upgrade puppeteer to 9.1.1
for (hopefully) more consistent behaviour between CI and development
* make input bigger to prevent triggering scroll events
* page.waitFor is deprecated
more info: https://github.com/puppeteer/puppeteer/issues/6214
* Set os and distro for Travis ci
Co-authored-by: yz-yu <yanzhen@smartx.com>
1. Do not use virtual parent optimization if the mutation targets have iframe elements as children. This will cause some performance regression but will be easy to add and ship.
2. If an iframe element has already been a child of a virtual parent, add the virtual parent back to the dom.
* feat: add options to mask texts
* feat: add the default mask function
* refactor: rename options to identify the difference between mask text and mask input
* test: add tests about masking
* doc: add options about masking
* chore: bump up rrweb-snapshot version
* Sort events at start, as otherwise we risk misidentifying the last event
* Keep inserted events in the correct order, ensuring we don't misidentify the last event
- e.g. network conditions mean that 'live' events come in non-sequentially
- or so that adding custom events to an existing event works
* Ensure we maintain original ordering while inserting a new event which has an identical timestamp to an existing event. This came up with a series of mutations which had the same timestamp but needed to be applied in the correct order
* Fast track the common case of a new event being added which occurs after all prior events
1. Position of mouse was inaccurate when replaying and this PR will fix it.
2. Fix the bug that if one nested iframe has a scale transform and the position of mouse was inaccurate as well.
* fix: errors of replaying iframe records
error1:
HierarchyRequestError: Failed to execute 'appendChild' on 'Node': Nodes of type '#document' may not be inserted inside nodes of type '#document-fragment'.
code: parent.appendChild(target)
error2:
Uncaught DOMException: Failed to execute 'appendChild' on 'Node': Only one element on document allowed.
code: parent.appendChild(target);
* improve the comment for bugfix
