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

rrdom (#613)

Browse Source 
* create rrdom package

* test(rrdom): add unit tests for polyfill.ts

* fix(rrweb snapshot): type check errors

Errors are caused by the declaration similarity of @types/mocha and @types/jest if we install both of them in the whole project.

* Set tagNames to upper case by default

This mirrors the `Element.tagName` implementation:

```
For DOM trees which represent HTML documents, the returned tag name is always in the canonical upper-case form. For example, tagName called on a <div> element returns "DIV".
```
https://developer.mozilla.org/en-US/docs/Web/API/Element/tagName

* Add workspace file

* VSCode settings for rrdom tests

* Add basic test for RRDocument

* Only setup jest tests for rrdom

* mock Node type and Event type for nodejs environment

* test(rrdom): add snapshot for document.test.ts

* fix issue of nwsapi import and add unit tests for rrdom

* fix: querySelectorAll returns nothing when querying elements with ids and classNames

* fix: error of unit test for Event polyfill

Since Event class is built in nodejs after v15.0.0

* add a dummy implementation of canvas

* add style element support

* add unit test for style element

Co-authored-by: Justin Halsall <Juice10@users.noreply.github.com>
This commit is contained in:
Lucky Feng
2026-04-01 12:00:00 +08:00
committed by GitHub
parent 044e1c1408
commit dd2cdedcd6
19 changed files with 2566 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
packages/rrdom/test/html/main.html Normal file
View File

@@ -0,0 +1,40 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Main</title>
<link rel="stylesheet" href="somelink">
<style>
h1 {
color: 'black';
}
.blocks {
padding: 0;
}
.blocks1 {
margin: 0;
}
#block1 {
width: 100px;
height: 200px;
}
@import url("main.css");
</style>
</head>
<body>
<h1>This is a h1 heading</h1>
<h1 style="font-size: 16px">This is a h1 heading with styles</h1>
<div id="block1" class="blocks blocks1">
<div id="block2" class="blocks blocks1 :hover">
Text 1
<div id="block3">
<p>This is a paragraph</p>
<button>button1</button>
</div>
Text 2
</div>
<img src="somelink" alt="This is an image" />
</div>
</body>
</html>