xuguopeng/rrweb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Keep blocked root elements as placeholders (#696)

Browse Source 
* Keep blocked root elements as placeholders

`serializeNode` turns blocked elements into placeholder nodes so we need to make sure we don't remove these elements from the mutations when they get added.
We do however need to keep removing any children of these blocked elements from getting added or mutated.

* Update packages/rrweb/src/record/mutation.ts
This commit is contained in:
Justin Halsall
2026-04-01 12:00:00 +08:00
committed by GitHub
parent d50094272e
commit bab5526dd5
3 changed files with 236 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
packages/rrweb/test/integration.test.ts
View File

@@ -185,7 +185,9 @@ describe('record integration tests', function (this: ISuite) {
// toggle the select box
await page.click('.select2-container', { clickCount: 2, delay: 100 });
// test storage of !important style
await page.evaluate('document.getElementById("select2-drop").setAttribute("style", document.getElementById("select2-drop").style.cssText + "color:black !important")');
await page.evaluate(
'document.getElementById("select2-drop").setAttribute("style", document.getElementById("select2-drop").style.cssText + "color:black !important")',
);
const snapshots = await page.evaluate('window.snapshots');
assertSnapshot(snapshots, __filename, 'select2');
});
@@ -317,6 +319,26 @@ describe('record integration tests', function (this: ISuite) {
assertSnapshot(snapshots, __filename, 'block');
});
it('should not record blocked elements dynamically added', async () => {
const page: puppeteer.Page = await this.browser.newPage();
await page.goto('about:blank');
await page.setContent(getHtml.call(this, 'block.html'));
await page.evaluate(() => {
const el = document.createElement('button');
el.className = 'rr-block';
el.style.width = '100px';
el.style.height = '100px';
el.innerText = 'Should not be recorded';
const nextElement = document.querySelector('.rr-block')!;
nextElement.parentNode!.insertBefore(el, nextElement);
});
const snapshots = await page.evaluate('window.snapshots');
assertSnapshot(snapshots, __filename, 'block 2');
});
it('should record DOM node movement 1', async () => {
const page: puppeteer.Page = await this.browser.newPage();
await page.goto('about:blank');