rrweb-io / rrweb

record and replay the web
https://www.rrweb.io/
MIT License
15.9k stars 1.38k forks source link

[Bug]: Duplicate Element Displayed and Warning Message 'Node with ID X Not Found' During Playback After Seeking Multiple Times. #1449

Open sandeshmurdia opened 2 months ago

sandeshmurdia commented 2 months ago

Preflight Checklist

What package is this bug report for?

rrweb

Version

v2.0.0-alpha.7

Expected Behavior

  1. Within the createPlayerService function, there's a call to applyEventsSynchronously(syncEvents) in machine.ts during replay.
  2. When seeking consecutively twice on the same inactive region, syncEvents should be empty.
  3. If syncEvents contain any incremental snapshots, the system will attempt to apply the mutation again and attempt to remove node once more.
  4. At that point, if there are sync events, that particular node would not be found, leading to potential issues.

Actual Behavior

It is showing syncEvents if we are seeking twice in a same region and throwing up error Node id not found when we are trying to apply mutation on it.

Steps to Reproduce

To record:

  1. Create a session with a tab containing two sections. Each section should be toggleable by clicking on the tabs. Ensure the parent class remains same while the content should be different between the tabs. You can have any other element or something too but it would be easy in tabs
  2. Start recording and engage in activity on tab1 for 5-6 seconds. Then, switch to tab2 and here don't perform any actions/activity for 1min appx.
  3. Allow for a 1-minute period of inactivity to occur. The issue would be recorded

When replaying:

  1. Disable the skip inactivity feature.
  2. Upon watching the session, you should observe it playing correctly.
  3. However, when u will seek more than 2 times in the big inactive region(the 1 min inactivity which we had done in the session) and then again play the session by seeking it to start or before the tab switch.
  4. You may encounter a warning stating "Node with id x not found."
  5. and also you'll notice duplicate elements for the parent, resulting in the table being displayed twice when u will play the replay again.

Testcase Gist URL

No response

Additional Information

No response

sandeshmurdia commented 2 months ago
image

Stack trace when the issue comes

Kayrim commented 1 month ago

I experience similar issues: image Duplicates left in the recording.

Similar warning logs: console.js:273 [replayer] Node with id '964' not found.

chetan-187 commented 1 month ago

image @sandeshmurdia I also faced a similar issue. Let me know if you find any solution. My replayer is stuck on a particular point.