* We weren't recursing into media queries (or @supports etc.) to rewrite hover pseudoclasses
* The early return meant that the stylesWithHoverClass cache wasn't being populated if there were no hover selectors on the stylesheet
- not committing the test, but modifying the existing 'add a hover class to a previously processed css string' as follows shows the problem:
--- a/packages/rrweb-snapshot/test/rebuild.test.ts
+++ b/packages/rrweb-snapshot/test/rebuild.test.ts
@@ -151,6 +185,7 @@ describe('rebuild', function () {
path.resolve(__dirname, './css/benchmark.css'),
'utf8',
);
+ cssText = cssText.replace(/:hover/g, '');
const start = process.hrtime();
addHoverClass(cssText, cache);
* Replace `min-device-width` and similar with `min-width` as the former looks out at the browser viewport whereas we need it to look at the replayer iframe viewport
* Add some tests to show how the hover replacement works against selector lists. I believe these were failing in a previous version of rrweb as I had some local patches that no longer seem to be needed to handle these cases
* Update name of function to reflect that 'addHoverClass' does more than just :hover. I believe this function is only exported for the purposes of use in the tests
* Apply formatting changes
* Create rotten-spies-enjoy.md
* Apply formatting changes
* Add correct typing on `getSelectors`
* Refactor CSS interfaces to include optional rules
* Change `rules` to be non optional
---------
Co-authored-by: eoghanmurray <eoghanmurray@users.noreply.github.com>
Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>
* Fix serialization and mutation of <textarea> elements taking account the duality that the value can be set in either the child node, or in the value _parameter_ (not attribute)
* Backwards compatibility: Bug fix and regression test for #112
- this is to fix up 'historical' recordings, as duplicate textarea content should no longer be being created at record time
- new test shows what the snapshot generated by previous versions of rrweb used to look like, hence 'bad'
- original 0efe23f04a fix either didn't work or no longer works due to childNodes being appended subsequent to this part of the code
- during review, we also verified that the `_cssText` case should still be handled okay, as there's currently no scenario where csstext is present with css child nodes of a <style>
* Masking: Fix that textarea values were being missed by the masking system if the value was recorded as a child node
- I didn't notice that form.html was used in other tests, so lucky that I noticed that those tests also should have the 'pre value' masked out
* Simplify by always storing the textarea value in the `.value` attribute (from it's DOM property) and not as a childNode. It should still be rebuilt as a childNode rather than a property
---------
Authored-by: eoghanmurray <eoghan@getthere.ie>
* Perf: don't run the regex replace unless the selectorText contains a colon (rules generally contain colons)
* Need to check type before querying selectorText property - also good as it means we only try to fix colons at the leaf level
---------
Authored-by: eoghan murray <eoghan@getthere.ie>
* feat: Ignore `autoplay` attribute on video/auto elements
This element leads to weird issues when replaying, so it's better to strip this out.
* add changeset
* fix check
fix typo
* Apply formatting changes
---------
Co-authored-by: mydea <mydea@users.noreply.github.com>
* fix: Exclude `modulepreload` as well
We were only excluding `<link rel="preload" as="script" />` but we should include `rel="modulepreload"` as well
* Apply formatting changes
* fix: duplicated elements in shadow doms
clean observers before taking new full snapshots
* add checker for replayer to make it stable when data has duplicated nodes
* apply review suggestions
* add change log
* Apply formatting changes
* update prettier to fit the master branch
---------
Co-authored-by: Mark-Fenng <Mark-Fenng@users.noreply.github.com>
* Add test cases for bugs
* Fix shadow dom recording
When moving an element containing shadow dom
When adding an element to shadow dom before its attached to the dom
* Apply formatting changes
* Refactor in dom checking code
* Nodes don't get processed in more than one mutation buffer
* Constrain node mutations to one mutation buffer per request animation frame
* Make tests less flaky under heavy load
* Apply suggestions from code review
* Update packages/rrweb-snapshot/test/rebuild.test.ts
* Remove unused nodeSet
Co-authored-by: Yun Feng <yun.feng0817@gmail.com>
* Upgrade puppeteer to 17.1.3 in rrweb-snapshot
* Apply formatting changes
* Add ?
* Make tests less flakey
* Make attribute-setting more explicit
* Make test less flakey
* Make test less flakey
* Upgrade puppeteer for rrdom
* Use wait for request animation frame instead of timeout
* Force append to happen in second event
* Wait till iframe was loaded (now 100ms)
* Round the currentTime to 1 decimal place
* Sort attributes to make `rr_*` attributes handled last
`rr_dataURL` overwrites `src` attribute, because of this we need to evaluate `rr_dataURL` last so it doesn't accidentally get overwritten again.
* Update packages/rrweb-snapshot/src/rebuild.ts
* Refactor handling of rr_* attributes
Be a little more strict when it comes attribute types
* inline stylesheets when loaded
* set empty link elements to loaded by default
* Clean up stylesheet manager
* Remove attribute mutation code
* Update packages/rrweb/test/record.test.ts
* Update packages/rrweb/test/record.test.ts
* Update packages/rrweb/test/record.test.ts
* Update packages/rrweb/scripts/repl.js
* Update packages/rrweb/test/record.test.ts
* Update packages/rrweb/src/record/index.ts
* Add todo
* Move require out of time sensitive assert
* Add waitForRAF, its more reliable than waitForTimeout
* Remove flaky tests
* Add recording stylesheets in iframes
* Remove variability from flaky test
* Make test more robust
* Fix naming
* Add test cases for inlineImages
* Add test cases for inlineImages
* Record iframe mutations cross page
* Test: should record images inside iframe with blob url after iframe was reloaded
* Handle negative ids in rrdom correctly
When iframes get inserted they create untracked elements, both on the dom and rrdom side.
Because they are untracked they generate negative numbers when fetching the id from mirror.
This creates a problem when comparing and fetching ids across mirrors.
This commit tries to get away from using negative ids as much as possible in rrdom's comparisons
* Update packages/rrdom/src/diff.ts
Co-authored-by: Yun Feng <yun.feng@anu.edu.au>
* Start unserialized nodes at -2
This way we don't accidentally think of them as mirror misses
* Set unserialized id starting number at -2
* Remove duplication
* Use turbo instead of lerna
* Skip benchmark as it is unreliable when executed in parallel
* Strip port number from serialization, it can vary
* Add settimeout to virtual dom test
* Remove console.log and refactor blob:url serialization
* Include references in tsconfig to indicate which monorepo packages are being used
* Add stream setup
* Migrate project to es module
* Add reference to rrweb from rrdom
* Move jest config to ESM
* Setup basic WebRTC canvas streaming
* Cleanup and refactor WebRTC streaming
* Remove ? which isn't propper javascript
* Yarn lock
* Remove webrtc code from rrweb
* Add plugin hooks
Record/Replay plugins
`.getMirror` exposes the mirror to plugins
Replay plugins
`.onBuild` called whenever a node was added to the dom
* Expose plugins with server
* Use unminified version for tests
* Don't include simple-peer in rrweb main project
* Add canvas webrtc plugin
Streams contents of canvas via webrtc
* ignore tsconfig.tsbuildinfo
* Cleanup unused code
* type definition files are no longer committed
* Devtools off by default
* Extract .css into its own file
* Refactor plugin apis and fix multi canvas streaming support
* Add readme to rrweb canvas webrtc plugin
* Reference canvas-webrtc plugin in documentation
* Forbidden non-null assertion
* Remove linting of each project, yarn lint:report will do this
* Remove test code
* Cut down line length
* fix CI failure and improve the zh_CN doc
* Update packages/rrweb/src/plugins/canvas-webrtc/replay/index.ts
Co-authored-by: Yun Feng <yun.feng@anu.edu.au>
* Cleaner styling of replay
Co-authored-by: Yun Feng <yun.feng@anu.edu.au>
* Clean up stream.js based on @Mark-Fenng's feedback
* Remove duplicate send
Co-authored-by: Yun Feng <yun.feng@anu.edu.au>
Co-authored-by: Yun Feng <yun.feng0817@gmail.com>
* inline stylesheets when loaded
* set empty link elements to loaded by default
* Clean up stylesheet manager
* Remove attribute mutation code
* Update packages/rrweb/test/record.test.ts
* Update packages/rrweb/test/record.test.ts
* Update packages/rrweb/test/record.test.ts
* Update packages/rrweb/scripts/repl.js
* Update packages/rrweb/test/record.test.ts
* Update packages/rrweb/src/record/index.ts
* Add todo
* Move require out of time sensitive assert
* Add waitForRAF, its more reliable than waitForTimeout
* Remove flaky tests
* Add recording stylesheets in iframes
* Remove variability from flaky test
* Make test more robust
* Fix naming
* Add test cases for inlineImages
* Add test cases for inlineImages
* Record iframe mutations cross page
* Test: should record images inside iframe with blob url after iframe was reloaded
* Handle negative ids in rrdom correctly
When iframes get inserted they create untracked elements, both on the dom and rrdom side.
Because they are untracked they generate negative numbers when fetching the id from mirror.
This creates a problem when comparing and fetching ids across mirrors.
This commit tries to get away from using negative ids as much as possible in rrdom's comparisons
* Update packages/rrdom/src/diff.ts
Co-authored-by: Yun Feng <yun.feng@anu.edu.au>
* Start unserialized nodes at -2
This way we don't accidentally think of them as mirror misses
* Set unserialized id starting number at -2
* Remove duplication
Co-authored-by: Yun Feng <yun.feng@anu.edu.au>
* Speed up snapshotting of many new dom nodes
By avoiding reflow we shave about 15-25% off our snapshotting time
* Improve newlyAddedElement docs
* Optimize needMaskingText by using el.closest and less recursion
* Serve all rrweb dist files
* Split serializeNode into smaller functions
Makes it easier to profile
* Slow down cpu enhance tracing on fast machines
* Increase timeout
* Perf: only loop through ancestors when they have something to compare to
* Perf: `hasNode` is cheaper than `getMeta`
* Perf: If parents where already checked, no need to do it again
* Perf: reverse for loops are faster
Because they only do the .lenght check once. In this case I don't think we'll see much performance gains if any
* Clean up code
* Perf: check ancestors once with isBlocked
* guessing this might fixes canvas test
* Update packages/rrweb/src/record/observers/canvas/webgl.ts
Co-authored-by: yz-yu <yanzhen@smartx.com>
* Fix#904 (#906)
Properly remove crossorigin attribute
* Bump minimist from 1.2.5 to 1.2.6 (#902)
Bumps [minimist](https://github.com/substack/minimist) from 1.2.5 to 1.2.6.
- [Release notes](https://github.com/substack/minimist/releases)
- [Commits](https://github.com/substack/minimist/compare/1.2.5...1.2.6)
---
updated-dependencies:
- dependency-name: minimist
dependency-type: indirect
...
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: yz-yu <yanzhen@smartx.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
* Implemented image restore from rr_dataURL
* Implement saving images in the snapshot
* Fixed image saving, added a test
* Rename data-src to data-rrweb-src
* Updated the guide
* Rename recordImages to inlineImages and try catch
* Hygiene: clean up the xhtml namespace attribute; this is an artefact of the `serializeToString` method which we are using (I think) to be consistent with whitespace and to clean up invalid attributes. I'm removing as was confused as am adding tests related to doctypes
* Record when a document is in `compatMode` and trigger this mode on the iframe upon replay
https://developer.mozilla.org/en-US/docs/Web/API/Document/compatMode
the included DOCTYPE was picked up from https://stackoverflow.com/questions/18976213/ - there may be better ways of triggering compatMode
* Don't write an extra DOCTYPE if there's one already present in the snapshot. Rely instead on whatever doctype is there to trigger the BackCompat mode
* Modify to write the correct doctype if we can sniff xhtml - don't have any evidence that this will make a difference
* Dev convenience: Ignore files generated by editors
* Typo fix
* Was getting a 2000ms timeout on the 'before' hook I believe
* Change certain tests to go directly to their localhost page instead of loading the html content programmatically in order to avoid triggering an incorrect BackCompat mode (incorrect in that the html content has a correct doctype)
* Add test based on motivating site that had images lined up in a square which were all different sizes; very old style percentage width/height attributes were doing the right thing in quirksmode, which is what we are testing for here
* Fixup rrweb test html to include a valid doctype and avoid BackCompat to ensure we're not accidentally testing against quirks modes. I didn't find an elegant way of avoiding the `BackCompat` when adding a minimal iframe, so some BackCompat has slipped in here, I don't think there's much harm