Commit Graph

1035 Commits

Author SHA1 Message Date
DexxDing
bdd89400d2 Implement: Inactive activity indicator on progress bar (#1039)
* update utils.ts: add a tool function to detect inactive periods

* update Controller.svelte: add a fixed div element as an indicator

* update Controller.svelte: add one blank space at the end

* update Controller.svelte: add a variable inactivePeriods and use util function to get inactive periods

* update Controller.svelte: add width property for inactive activity indicators

* update Controller.svelte: combine calculation value with indicator UI

* update utils.ts: fix error https://github.com/HurricaHjz/rrweb_2120_ga_3/pull/5#discussion_r1008677230 and add comments

update Controller.svelte: apply Zihan's suggestion https://github.com/HurricaHjz/rrweb_2120_ga_3/pull/5#discussion_r1008678403

* update Controller.svelte: make the color of indicator customizable

update index.d.ts: add type definition for the color option

Co-authored-by: u7149141 <fengyun5264@outlook.com>
Co-authored-by: Jerry Zhang <u7305891@anu.edu.au>
Co-authored-by: fengyun5264 <115444501+fengyun5264@users.noreply.github.com>
Co-authored-by: Zihan Meng <u7354208@anu.edu.au>
Co-authored-by: HurricaHjz <105645379+HurricaHjz@users.noreply.github.com>
Co-authored-by: u6924169 <u6924169@anu.edu.au>
Co-authored-by: Majia0712 <55265314+MengZihan712@users.noreply.github.com>
2022-10-31 22:17:35 +08:00
Majia0712
2286c11912 Update Player.svelte: fix the bug. (#1028)
The progress bar and controls now can be displayed under the fullscreen mode.
2022-10-17 22:15:43 +08:00
HurricaHjz
ae643f4c48 Fix #972 [Docs]: Add Readme.md to packages/rrweb (#1025)
* Create README.md

Copy the README.md from source folder, change link dependencies

* Update README.md

Fix the root directory reference

* Update README.md

* Update README.md

fix the typo

* Update README.md: formatting using prettier
2022-10-17 18:16:40 +08:00
Samuel Berthe
1ec4413137 doc: improve contributor experience (#1024) 2022-10-16 13:41:04 +08:00
MF
7edfefe680 fix: recording bug in youtube and bitbucket (#1020)
when getting shadow host elements, the anchor element <a> also has a host property as a string. This unexpected value can  crash recorder
2022-10-12 20:51:23 +08:00
Eoghan Murray
87aa3b6a3d Ignore noisy webgl params (#1016)
* `isContextLost` is particularly noisy, being called almost constantly by e.g. Figma to check whether there's a need to re initialize a canvas

Juice10: We could perhaps look at 5cd49f6cbc/lib/lib.dom.d.ts (L14578)  via https://stackoverflow.com/questions/60150251/how-to-import-an-interface-from-lib-dom-d-ts

* Apply formatting changes

Co-authored-by: eoghanmurray <eoghanmurray@users.noreply.github.com>
2022-10-08 10:28:01 +08:00
Eoghan Murray
20ad416d9b prototype here does not refer to the correct WebGLRenderingContext … (#1013)
* `prototype` here does not refer to the correct WebGLRenderingContext when there are multiple being patched - all were referring to the same one meaning that variables weren't being indexed correctly as `canvasVarMap` in serialize-args.ts was only seeing a single context

If you revert the change from `prototype` to `this` from this commit, you'll get the following failure in the new test added in this commit:

   @@ -199,11 +199,11 @@
                "property": "bindBuffer",
                "args": [
                  34962,
                  {
                    "rr_type": "WebGLBuffer",
    -               "index": 0
    +               "index": 1
                  }
                ]
              },

This is because the 'confound' canvas was populating a single entry in the canvasVarMap so when 'myCanvas' starts populating, there is already an entry (which doesn't exist on the replay side as the 'confound' canvas was never emitted)

* Update packages/rrweb/test/integration.test.ts

Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>

* Update packages/rrweb/test/html/canvas-webgl-shader.html

Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>

Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>
2022-10-05 11:52:19 +08:00
Justin Halsall
9de0de2cc5 Add maxScale to rrwebPlayer types and add docs to others (#1014) 2022-10-04 14:27:53 +08:00
Yanzhen Yu
e86d482ffd chore(release): publish new version
- rrdom-nodejs@0.1.6
 - rrdom@0.1.6
 - rrweb-player@1.0.0-alpha.3
 - rrweb-snapshot@2.0.0-alpha.3
 - rrweb@2.0.0-alpha.3
2022-09-30 14:16:57 +08:00
Justin Halsall
6f44bb72a1 Call afterAppend for mutations and top level elements (#1012) 2022-09-30 14:15:24 +08:00
MF
55ebce7337 Fix inline link elements bug (#995)
* fix: bug when inlined link elements

* test: update snapshot for test cases

* apply Justin's review suggestions

1. make Mirror's replace function act the same with the original one when there's no existed node to get replaced.
2. when replacing with the link/style elements, keep their existing attributes to prevent potential bugs
2022-09-30 14:14:35 +08:00
Yun Feng
3809060684 feat: add support for recording and replaying adoptedStyleSheets API (#989)
* test(recording side): add test case for adopted stylesheets in shadow doms and iframe

* add type definition for adopted StyleSheets

* create a StyleSheet Mirror

* enable to record the outermost document's adoptedStyleSheet

* enable to serialize all stylesheets in documents (iframe) and shadow roots

* enable to record adopted stylesheets while building full snapshot

* test: add test case for mutations on adoptedStyleSheets

* defer to record adoptedStyleSheets to avoid create events before full snapshot

* feat: enable to track the mutation of AdoptedStyleSheets

* Merge branch 'fix-shadowdom-record' into construct-style

* fix: incorrect id conditional judgement

* test: add a test case for replaying side

* tweak the style mirror for replayer

* feat: enable to replay adoptedStyleSheet events

* fix: rule index wasn't recorded when serializing the adoptedStyleSheets

* add test case for mutation of stylesheet objects and add support for replace & replaceSync

* refactor: improve the code quality

* feat: monkey patch adoptedStyleSheet API to track its modification

* feat: add support for checkouting fullsnapshot

* CI: fix failed type checks

* test: add test case for nested shadow doms and iframe elements

* feat: add support for adoptedStyleSheets in VirtualDom mode

* style: format files

* test: improve the robustness of the test case

* CI: fix an eslint error

* test: improve the robustness of the test case

* fix: adoptedStyleSheets not applied in fast-forward mode (virtual dom optimization not used)

* refactor the data structure of adoptedStyleSheet event to make it more efficient and robust

* improve the robustness in the live mode

In the live mode where events are transferred over network without strict order guarantee, some newer events are applied before some old events and adopted stylesheets may haven't been created.
Added a retry mechanism to solve this problem.

* apply Yanzhen's review suggestion

* update action name

* test: make the test case more robust for travis CI

* Update packages/rrweb/src/record/constructableStyleSheets.d.ts

Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>

* Update packages/rrweb/src/record/constructableStyleSheets.d.ts

Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>

* apply Justin's review suggestions

add more browser compatibility checks

* add eslint-plugin-compat and config

* fix record test  type errors

* make Mirror's replace function act the same with the original one when there's no existed node to replace

* test: increase the robustness of test cases

* remove eslint disable in favor of feature detection

Early returns aren't supported yet unfortunately, otherwise this code would be cleaner https://github.com/amilajack/eslint-plugin-compat/issues/523

* Remove eslint-disable-next-line compat/compat

* Standardize browserslist and remove lint exceptions (#1010)

* test: revert deleting virtual style tests and rewrite them to fit the current code base

Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>
2022-09-29 14:40:13 +08:00
Justin Halsall
23e3a73bf3 bugfix: Sort attributes to make rr_* attributes handled last (#970)
* 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
2022-09-27 00:12:29 +08:00
Justin Halsall
6f63cf1584 Make maximum scale configurable (#1006) 2022-09-27 00:10:19 +08:00
Justin Halsall
3924aafd61 Allow player to play a from-to range (#1007)
* Allow player to play a from-to range

And optionally trigger a callback or loop

* Update packages/rrweb-player/src/Controller.svelte
2022-09-27 00:09:39 +08:00
Eoghan Murray
a16d506d0c Add play to live-mode.md (#1009)
* Update live-mode.md

`play`  is superior in the case that there are existing events as it will utilize `discardPriorSnapshots` to skip unnecessary things.

* Apply formatting changes

* Update live-mode.md

tweak

Co-authored-by: eoghanmurray <eoghanmurray@users.noreply.github.com>
2022-09-26 21:44:18 +08:00
Yanzhen Yu
58cd78799b chore(release): publish new version
- rrdom-nodejs@0.1.5
 - rrdom@0.1.5
 - rrweb-player@1.0.0-alpha.2
 - rrweb-snapshot@2.0.0-alpha.2
 - rrweb@2.0.0-alpha.2
2022-09-22 20:11:24 +08:00
Eoghan Murray
c619a59d76 Fix that addAction wouldn't have any effect without a stop and start (#1001)
* Fix that `addAction` wouldn't have any effect without a stop and start - noticed during live mode

* Remove `addActions` as it has a bug-causing replacement of `this.actions` - refactor to reuse `addAction` and add a `push` fast-track to this function for the common case of adding actions in the correct order

* Apply formatting changes

Co-authored-by: eoghanmurray <eoghanmurray@users.noreply.github.com>
2022-09-22 20:03:16 +08:00
Justin Halsall
08ab7ab452 re-use live mode config - and improve docs on how to start liveMode (#1003)
* Use config.liveMode to turn on liveMode in the timer

* Discussion of `startLive(1500)` was incorrect as startLive is based on timestamps, not playback offsets.  Also reorder to introduce `addEvent` earlier

Co-authored-by: Eoghan Murray <eoghan@getthere.ie>
2022-09-17 14:40:15 +08:00
何遇
bac1d7b048 feat: add dataURLOptions parameter control canvas image format and quality (#967)
* feat: record add dataURLOptions parameter control canvas image format and quality

* 解决 build failed

* Update docs/recipes/canvas.md

* Apply formatting changes

* Update canvas-manager.ts

Fix the error caused when I resolved the merge conflict

Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>
Co-authored-by: Yun Feng <yun.feng@anu.edu.au>
Co-authored-by: Mark-Fenng <Mark-Fenng@users.noreply.github.com>
Co-authored-by: Yun Feng <yun.feng0817@gmail.com>
2022-09-17 12:43:43 +08:00
Yun Feng
96b7466465 fix duplicate shadow doms in the recorder (#1002)
* fix: some shadow doms are observed multiple times and cause duplicate elements in the replayer

* fix: in the live mode, the page https://bugs.chromium.org/p/chromium/issues/detail?id=1352333 has duplicate shadow doms in the replayer
2022-09-17 12:41:44 +08:00
fukang wang
60072666d7 fix: reset fns when when stopping record (#962)
Co-authored-by: wangfukang <wangfukang@kuaishou.com>
2022-09-17 12:40:32 +08:00
fukang wang
ce6019d274 feat: support media playbackRate (#1000)
Co-authored-by: wangfukang <wangfukang@kuaishou.com>
2022-09-15 23:05:10 +08:00
fukang wang
a9a255931f fix: add mutation lost in slimDOMOptions (#994)
* fix: add mutation lost in slimDOMOptions

* fix: slimDOMOptions-mutation-lost

Co-authored-by: wangfukang <wangfukang@kuaishou.com>
2022-09-15 23:02:10 +08:00
Justin Halsall
a8478f1da4 [Plugin] Live stream canvas via webrtc (#976)
* 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>
2022-09-15 11:24:05 +08:00
dbseel
49d143f777 Ensure positions has length before referencing (#998) 2022-09-15 11:23:38 +08:00
luocongqiu
7be26b07eb fix: iframe input hook (#991)
* fix: iframe input hook (#990)

* Update observer.ts

* format code with prettier

* format all code with prettier

Co-authored-by: luocq3 <luocq3@asiainfo.com>
Co-authored-by: Yun Feng <yun.feng@anu.edu.au>
2022-09-09 11:25:21 +08:00
Yun Feng
31890f0021 fix error for prettier action (#992)
* create a bait error for prettier

* refactor github action config

* Apply formatting changes

Co-authored-by: Mark-Fenng <Mark-Fenng@users.noreply.github.com>
2022-09-09 00:42:34 +08:00
luocongqiu
6eaec0424d fix: Iframe replay fails after the second full snapshot #983 (#984) 2022-09-08 21:51:39 +08:00
Yun Feng
e7fdf53366 fix: can't record shadow root's children except the last one (#956)
* fix: can't record shadow root's children except the last one

* remove unnecessary type cast
2022-09-07 13:35:55 +08:00
Yun Feng
f1b5cb2738 CI: add a prettier GitHub action to format code automatically (#988)
* CI: add a prettier GitHub action to format code automatically

* improve GitHub Action config and format some files

* Apply formatting changes

* CI: make the prettier action a standalone action

* Apply formatting changes

* CI: add push as new trigger event

Co-authored-by: Mark-Fenng <Mark-Fenng@users.noreply.github.com>
2022-09-06 09:38:43 +08:00
dbseel
5ba933cce3 isBlocked factors in the selector (#894)
* isBlocked factors in the selector

* Ensure contains parameter is a node

* Fix blockSelector blocking for closest nodes

* Fix integration test

* adding ignoreCSSAttributes to ignore the addition of certain css attributes

* tested ignoreCSSAttributes

* Update test snapshot

* swapped the wrapping of htmlelement to be element

* Fix linter errors

* Address MR feedback

* Rebase

Co-authored-by: Filip <filipslatinac@gmail.com>
2022-08-30 13:27:24 +08:00
何遇
ac7935e378 fix: record canvas by fps when blockClass is RegExp (#966)
* fix: Fixed a bug where FPSObserver cannot record Canvas when blockClass is a regular expression

* Update packages/rrweb/src/record/observers/canvas/canvas-manager.ts

Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>
2022-08-27 09:04:26 +08:00
Justin Halsall
e0ca9158f8 Create CONTRIBUTING.md (#969) 2022-08-22 20:36:31 +08:00
Justin Halsall
5f3e027604 Create CODE_OF_CONDUCT.md (#968) 2022-08-22 20:35:51 +08:00
Yun Feng
1fb1102eba add more questions for issue template (#965) 2022-08-21 16:36:06 +08:00
Justin Halsall
0554408cc0 Include eslint jest (#959) 2022-08-19 17:59:19 +08:00
Yun Feng
5f59f9171e feat: add a destroy function to destroy the whole player (#953)
* feat: add a destroy function to destroy the whole player

* doc: update guidance document

* Update packages/rrweb/src/replay/index.ts

Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>

Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>
2022-08-11 19:39:16 +08:00
Yun Feng
a0d53738f8 fix: errors when fast-forward selection events (#952) 2022-08-11 13:08:42 +08:00
Justin Halsall
fd85c79ea9 Handle negative ids in rrdom correctly + extra tests (#927)
* 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>
2022-08-06 17:00:05 +08:00
Jinxing Lin
b2d56898a8 rrweb: add selection observer (#936)
* rrweb: add selection observer

* Update packages/rrweb/src/record/observer.ts

Co-authored-by: Yun Feng <yun.feng0817@gmail.com>

* Update packages/rrweb/src/record/observer.ts

Co-authored-by: Yun Feng <yun.feng0817@gmail.com>

* Update packages/rrweb/src/replay/index.ts

Co-authored-by: Yun Feng <yun.feng0817@gmail.com>

* remove: repeat updateSelection

* Update packages/rrweb/src/record/observer.ts

Co-authored-by: Yun Feng <yun.feng0817@gmail.com>

* remove: utils sample events

Co-authored-by: Yun Feng <yun.feng0817@gmail.com>
2022-08-06 16:59:42 +08:00
Yanzhen Yu
abc035fd00 chore(release): publish new version
- rrdom-nodejs@0.1.4
 - rrdom@0.1.4
 - rrweb-player@1.0.0-alpha.1
 - rrweb-snapshot@2.0.0-alpha.1
 - rrweb@2.0.0-alpha.1
2022-07-31 11:48:29 +08:00
Yun Feng
cb24aaf6aa add benchmark for replayer's fast-forward mode (#947)
* add benchmark for replayer's fast-forward mode

* add comments

* change the title

* build: make benchmark a seperate command
2022-07-31 11:45:57 +08:00
Yun Feng
f1b23ddccc fix: canvas data in iframe wasn't applied in the fast-forward mode (#944)
* fix: canvas data in iframe wasn't applied in the fastforward mode

* add more comments

* Update packages/rrdom/src/diff.ts

Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>

* apply Juice10's suggestion

Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>
2022-07-31 09:01:04 +08:00
Yun Feng
aecaefbf45 chore: remove all typings, add them all to .gitignore file and update turbo.json (#949) 2022-07-31 08:38:22 +08:00
Eoghan Murray
b618f095df Remove typings files as these can be regenerated with npm run typings from their src/types.ts masters, and are an extra source of conflicts if they remain in git (#946) 2022-07-26 22:54:27 +08:00
Yanzhen Yu
16089fc6b5 fix console plugin example 2022-07-25 23:56:01 +08:00
Eoghan Murray
ba4bcbea8d Bump jsdom to latest version as was getting error TS2305: Module '"parse5"' has no exported member 'ElementLocation'. (#945) 2022-07-25 23:44:55 +08:00
Yun Feng
df9d5bb02c fix: eslint action error in a PR from a fork repo (#943)
* fix: eslint action error in a PR from a fork repo

error message: 'Resource not accessible by integration'

* try to fix the github action error
2022-07-23 12:51:51 +08:00
Yun Feng
f03504a731 fix issue #933 (#942)
* fix: style not applied to polyfillled shadow dom

* test: add integration test for shadydom and @lwc/synthetic-shadow

* improve the implementation of function isNativeShadowDom

* apply lele0108's review suggestion
2022-07-22 20:36:43 +08:00