Giters

rrweb-io / rrweb-snapshot

rrweb's snapshot and rebuild module

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

(Privacy) Blocking of elements does not work

kerwitz opened this issue · comments

commented

As per the docs of the master repo elements with .rr-block should not be recorded. I have two different scenarios where this does not seem to apply at all.

Updating text contents

<span id="random" class="rr-block"></span>

setInterval(() => document.getElementById('random').innerText = Math.random(), 1000);

The same applies when updating child nodes of the .rr-block element.

I observe events being collected for these changes (by console.logging them). This should not be happening I guess?

According to the code the .rr-block class seems to be only checked against the mutated element itself, not its parents. I realize this may be unfeasible to do on every mutation, but if an element is marked as "private" I would expect this to propagate to any of its children as well.

I am yet to dive deeper into these problems but it may turn out to be better to split this up into two separate issues (text node blocking and private child nodes).

commented

I think I get the point and will check this again later, looks like a bug.

commented

The current code will also block the child node by skipping serialization.

This bug happened because we are not checking whether a newly added node has an ancestor node which is blocked, and in your sample code a text node was added and tracked.
If you write code like this you will find child nodes were blocked:

- <span id="random" class="rr-block"></span>
+ <span id="random" class="rr-block">1</span>

setInterval(() => document.getElementById('random').innerText = Math.random(), 1000);

This bug will be fixed in the rrweb repo since the observer code was there, and also will add an improvement of not emit empty events.