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.
* 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
* Impl record iframe
* iframe observe
* temp: add bundle file to git
* update bundle
* update with pick
* update bundle
* fix fragment map remove
* feat: add an option to determine whether to pause CSS animation when playback is paused (#428)
set pauseAnimation to true by default
* fix: elements would lose some states like scroll position because of "virtual parent" optimization (#427)
* fix: elements would lose some state like scroll position because of "virtual parent" optimization
* refactor: the bugfix code
bug: elements would lose some state like scroll position because of "virtual parent" optimization
* fix: an error occured at applyMutation(remove nodes part)
error message:
Uncaught (in promise) DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node
* pick fixes
* revert ignore file
* re-impl iframe record
* re-impl iframe replay
* code housekeeping
* move multi layer dimension calculation to replay side
* update test cases
* teardown test server
* upgrade rrweb-snapshot with iframe load timeout
Co-authored-by: Lucky Feng <yun.feng@smartx.com>
Saw this line cause issues in production, causing the following error:
```
RangeError Maximum call stack size exceeded
```
I believe this is caused by javascript engine max argument length - see note from https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply#using_apply_and_built-in_functions
> The consequences of applying a function with too many arguments (that is, more than tens of thousands of arguments) varies across engines. (The JavaScriptCore engine has hard-coded argument limit of 65536.
* wip: working on rrweb logger
* wip: can record and replay some simple log
* wip: can record and replay log's stack
* wip: try to serialize object
* wip: record and replay console logger
hijack all of the console functions.
add listener to thrown errors
* wip: record and replay console logger
add limit to the max number of log records
* feat: enable rrweb to record and replay log messages in console
this is the implementation of new feature request(issue #234)
here are a few points of description.
1. users need to set recordLog option in rrweb.record's parameter to record log messages. The log recorder is off by default.
2. support recording and replaying all kinds of console functions. But the reliability of them should be tested more
3. the stringify function in stringify.ts needs improvement. e.g. robustness, handler for cyclical structures and better support for more kinds of object
4. we can replay the log messages in a simulated html console like LogRocket by implementing the interface "ReplayLogger" in the future
* improve: the stringify function
1. handle cyclical structures
2. add stringify option to limit the length of result
3. handle function type
* refactor: simplify the type definition of ReplayLogger
* fix: elements would lose some state like scroll position because of "virtual parent" optimization
* refactor: the bugfix code
bug: elements would lose some state like scroll position because of "virtual parent" optimization
* fix: an error occured at applyMutation(remove nodes part)
error message:
Uncaught (in promise) DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node
Loop the append queue has been proved to be very inefficient, and
some times lead to N^2 time complexity.
Especially when some abnormal data could not be appended into the
real DOM, will make a dead loop.
Previously we use a 5000ms time out to handle this, which is not
user-friendly and not explicitly.
In this patch, we transform the queue into a tree data structure,
which reflects the layout of real DOM. With the tree data structure,
we can find whether there are dangling nodes that need to be dropped.
Also, the iteration will be much more efficient.
There is still a 500ms time out to avoid a dead loop, but should not
be called in expected scenarios.
