* 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: scrolling can be incorrect when fast-forwarding
* add test case
* add changeset and remove duplicate diffProps process
---------
Co-authored-by: Yun Feng <yun.feng0817@gmail.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>
* masking performance: avoid the repeated calls to `closest` when recursing through the DOM
- needsMask===true means that an ancestor has tested positively for masking, and so this node and all descendents should be masked
- needsMask===false means that no ancestors have tested positively for masking, we should check each node encountered
- needsMask===undefined means that we don't know whether ancestors are masked or not (e.g. after a mutation) and should look up the tree
* Add tests including an explicit characterData mutation tests
* Further performance improvement: avoid calls to `el.matches` when on a leaf node, e.g. a `<br/>`
---------
Authored-by: eoghanmurray <eoghan@getthere.ie>
Based on initial PR #1338 by Alexey Babik <alexey.babik@noibu.com>
* Add config option to turn off all snapshotting and related observers
- allows RRWEB to be used for click/movement tracking alone, e.g. for a heatmaps use case
- could also be used if there was a separate process for recording the DOM (in which case a 3rd party library like https://github.com/antonmedv/finder could be added to record targets instead of the mirror)
---------
Authored-by: eoghanmurray <eoghanmurray@users.noreply.github.com>
Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>
* Extend to run fixBrowserCompatibilityIssuesInCSS over styles in inline style sheets
* Apply formatting changes
---------
Co-authored-by: eoghanmurray <eoghanmurray@users.noreply.github.com>
* Upgrade jest to 29 and puppeteer to 16 in rrweb
* Apply formatting changes
* Upgrade rrweb's puppeteer to v20
* Apply formatting changes
* Canvas: Reduce flickering and capturing of empty canvas elements
Turn on `preserveDrawingBuffer` by default for canvas FPS recording.
Has some negative performance implications, but really helps when capturing canvas.
* Apply formatting changes
* Include all test image snapshots in ci
* Apply formatting changes
* Allow more flexibility when capturing hover
* Apply formatting changes
* Create tiny-chairs-build.md
* Apply formatting changes
* Update hover.test.ts
* Apply formatting changes
* Document snapshotFormat jest config
* Freeze `yarn.lock` in ci for reproducible dependencies
* Apply formatting changes
* Apply formatting changes
* Revert to old style of puppeteer evaluation script notation
* Apply formatting changes
* Make test less flaky
* Apply formatting changes
* Apply formatting changes
* Make tests less flaky
* Apply formatting changes
* Make test more robust
* Apply formatting changes
* Apply formatting changes
* Add debugging code for test
* Apply formatting changes
* Also test not ignored input
* Apply formatting changes
* Apply formatting changes
* Apply formatting changes
* escape ignoreSelector
* Apply formatting changes
* Apply formatting changes
* feat: Add `ignoreSelector` option
Similar to `ignoreClass`, but accepts a CSS selector so that you can use any CSS selector.
* Apply formatting changes
* Create clean-shrimps-lay.md
* Apply formatting changes
* Add a test which demonstrates how no mutations are generated when an element is created & destroyed in the same 'cycle' (a cylce here being enforced by freezePage)
* Test demonstrating current behaviour I'm about to modify; the data-test="x" attribute is present twice in the mutation, as is the textContent value of 'y'
* Attribute or text modifications on just-added nodes are redundant as demonstrated in test case
* Some correct test changes from other tests; I've manually inspected each of these mutation removals and confirmed that the attribute values are already present in the newly added nodes elsewhere in the same mutation
* Improve reliability of test case as per Justin's advice
* Don't use the CSSOM when there's `var()` present as it fails badly https://github.com/rrweb-io/rrweb/pull/1246
* As the CSS Object Model expands out shorthand properties, do a check on the string length before choosing which format to go for
- this approach allows 'var()' in a styleOMValue as it's only a problem when combined with a shorthand property
- before this change background:black; was getting expaned to 10 OM properties as follows:
'style': {
'background-color': 'black',
'background-image': false,
'background-position-x': false,
'background-position-y': false,
'background-size': false,
'background-repeat-x': false,
'background-repeat-y': false,
'background-attachment': false,
'background-origin': false,
'background-clip': false
}
* Updates to remainder of tests based on refined compact style mutations
* Apply suggestions from code review by: Justin Halsall <Juice10@users.noreply.github.com>
---------
Authored-by: eoghanmurray <eoghan@getthere.ie>
* Export correct mirror in player
Was using DeprecatedMirror in its types, that shouldn't be used anymore.
* Add playRange to types
* Create smooth-poems-bake.md
* Apply formatting changes
* Add $set to player type
* Update smooth-poems-bake.md
* Apply formatting changes
* Last two arguments of playRange are optional
* Guard against presence of likely older third party libraries which (re)define Date.now, e.g. https://github.com/datejs/Datejs/issues/92
* Apply formatting changes
* (remove nowTimestamp import where Date.now() is not used)
* Add a PURE marker so an empty `ìf` statement doesn't show up in the rrweb-replay output
* Update packages/rrweb/src/utils.ts
Fix typing issue with regex against `Date.now()`
Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>
* Create little-radios-thank.md
* Apply formatting changes
* Update .changeset/little-radios-thank.md
* Apply formatting changes
---------
Co-authored-by: eoghanmurray <eoghanmurray@users.noreply.github.com>
Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>
* As per @Yun Feng: everyone has npm installed globally but maybe not yarn
* Add command to enable test result updating
* Default to running tests HEADLESS on rrweb
* Add command to build:all in a low memory environment
* Add a 'retest' command for when the code hasn't changed, but you are working on the test cases
* Add commands to reformat according to prettier. Named 'reformat' to indicate that we are doing a `--write`
* Update package.json
Co-authored-by: Yun Feng <yun.feng0817@gmail.com>
* Apply suggestions from code review
Co-authored-by: Yun Feng <yun.feng0817@gmail.com>
* Create few-turkeys-reflect.md
* Apply formatting changes
---------
Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>
Co-authored-by: Yun Feng <yun.feng0817@gmail.com>
* fix: rrdom bug
1. fix one bug of the diff algorithm
2. omit srcdoc attribute of iframe
* use linked list to iterate children
* fix the bug that the children of shadowRoot don't get diffed
* add test cases
* add change log
* Scale sponsors
Gold sponsors where a bit too big. I've scaled down all sponsors to match their donation level (calculation below). Also makes the low res image of our gold sponsor less apparent.
Example:
Bronze Sponsors Calculation:
50 pixels per donation $
100$ = 5000 pixels
√5000 = +/-70
Resolution: 70*70 = +/-5000 pixels
* Create fresh-cars-impress.md
