setup tests
This commit is contained in:
Yanzhen Yu
@@ -1,4 +1,4 @@
|
||||
{
|
||||
"singleQuote": true,
|
||||
"trailingComma": "es5"
|
||||
}
|
||||
"trailingComma": "all"
|
||||
}
|
||||
|
||||
4
index.d.ts
vendored
Normal file
4
index.d.ts
vendored
Normal file
@@ -0,0 +1,4 @@
|
||||
declare module 'mocha-jsdom' {
|
||||
function mochaDom(options: any): void;
|
||||
export = mochaDom;
|
||||
}
|
||||
@@ -4,7 +4,7 @@
|
||||
"description": "rrweb's component to take a snapshot of DOM, aka DOM serializer",
|
||||
"main": "index.js",
|
||||
"scripts": {
|
||||
"test": "mocha -r ts-node/register src/**/*.test.ts"
|
||||
"test": "TS_NODE_FILES=true mocha -r ts-node/register test/**/*.ts"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
@@ -23,9 +23,13 @@
|
||||
"homepage": "https://github.com/rrweb-io/rrweb-snapshot#readme",
|
||||
"devDependencies": {
|
||||
"@types/chai": "^4.1.4",
|
||||
"@types/jsdom": "^11.12.0",
|
||||
"@types/mocha": "^5.2.5",
|
||||
"@types/node": "^10.11.3",
|
||||
"chai": "^4.1.2",
|
||||
"jsdom": "^12.1.0",
|
||||
"mocha": "^5.2.0",
|
||||
"mocha-jsdom": "^2.0.0",
|
||||
"ts-node": "^7.0.1",
|
||||
"tslint": "^4.5.1",
|
||||
"typescript": "^3.0.3"
|
||||
|
||||
@@ -14,7 +14,11 @@ function buildNode(n: serializedNodeWithId): Node | null {
|
||||
const node = document.createElement(n.tagName);
|
||||
for (const name in n.attributes) {
|
||||
if (n.attributes.hasOwnProperty(name)) {
|
||||
node.setAttribute(name, n.attributes[name]);
|
||||
try {
|
||||
node.setAttribute(name, n.attributes[name]);
|
||||
} catch (error) {
|
||||
// skip invalid attribute
|
||||
}
|
||||
}
|
||||
}
|
||||
return node;
|
||||
|
||||
57
test/html/about-mozilla.html
Normal file
57
test/html/about-mozilla.html
Normal file
@@ -0,0 +1,57 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>The Book of Mozilla, 11:9</title>
|
||||
<style type="text/css">
|
||||
html {
|
||||
background: maroon;
|
||||
color: white;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
#moztext {
|
||||
margin-top: 15%;
|
||||
font-size: 1.1em;
|
||||
font-family: serif;
|
||||
text-align: center;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
#from {
|
||||
font-size: 1.95em;
|
||||
font-family: serif;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
em {
|
||||
font-size: 1.3em;
|
||||
line-height: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<p id="moztext">
|
||||
Mammon slept. And the <em>beast reborn</em> spread over the earth and its numbers
|
||||
grew legion. And they proclaimed the times and <em>sacrificed</em> crops unto the
|
||||
fire, with the <em>cunning of foxes</em>. And they built a new world in their own
|
||||
image as promised by the <em><a href="http://www.mozilla.org/about/mozilla-manifesto.html">
|
||||
sacred words</a></em>, and <em><a href="http://wiki.mozilla.org/About:mozilla">spoke
|
||||
</a></em> of the beast with their children. Mammon awoke, and lo! it was
|
||||
<em>naught</em> but a follower.
|
||||
</p>
|
||||
|
||||
<p id="from">
|
||||
from <strong>The Book of Mozilla,</strong> 11:9<br /><small>(10th Edition)</small>
|
||||
</p>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
15
test/html/basic.html
Normal file
15
test/html/basic.html
Normal file
@@ -0,0 +1,15 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<title>Document</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
70
test/index.ts
Normal file
70
test/index.ts
Normal file
@@ -0,0 +1,70 @@
|
||||
import 'mocha';
|
||||
import mochaDom = require('mocha-jsdom');
|
||||
import { expect } from 'chai';
|
||||
import * as fs from 'fs';
|
||||
import * as path from 'path';
|
||||
import { JSDOM } from 'jsdom';
|
||||
import { snapshot, rebuild } from '../src';
|
||||
|
||||
const htmlFolder = path.join(__dirname, 'html');
|
||||
const htmls = fs.readdirSync(htmlFolder).map(filePath => {
|
||||
return {
|
||||
filePath,
|
||||
content: fs.readFileSync(path.resolve(htmlFolder, filePath), 'utf-8'),
|
||||
};
|
||||
});
|
||||
|
||||
describe('integration tests', () => {
|
||||
mochaDom({ url: 'http://localhost' });
|
||||
|
||||
it('will snapshot document type', () => {
|
||||
const raw = '<html></html>';
|
||||
const dom = new JSDOM(raw);
|
||||
const snap = snapshot(dom.window.document);
|
||||
expect(snap).to.deep.equal({
|
||||
type: 0,
|
||||
childNodes: [
|
||||
{
|
||||
type: 2,
|
||||
tagName: 'html',
|
||||
attributes: {},
|
||||
childNodes: [
|
||||
{
|
||||
type: 2,
|
||||
tagName: 'head',
|
||||
attributes: {},
|
||||
childNodes: [],
|
||||
id: 3,
|
||||
},
|
||||
{
|
||||
type: 2,
|
||||
tagName: 'body',
|
||||
attributes: {},
|
||||
childNodes: [],
|
||||
id: 4,
|
||||
},
|
||||
],
|
||||
id: 2,
|
||||
},
|
||||
],
|
||||
id: 1,
|
||||
});
|
||||
});
|
||||
|
||||
it('will not throw error with invalid attribute', () => {
|
||||
const raw = `<html foo='bar' ''></html>`;
|
||||
const dom = new JSDOM(raw);
|
||||
expect(() => rebuild(snapshot(dom.window.document))).not.to.throw();
|
||||
});
|
||||
|
||||
for (const html of htmls) {
|
||||
it('[html file]:' + html.filePath, () => {
|
||||
const dom = new JSDOM(html.content);
|
||||
const snap = snapshot(dom.window.document);
|
||||
const rebuildDom = rebuild(snap);
|
||||
expect((rebuildDom as Document).documentElement.outerHTML).to.equal(
|
||||
dom.window.document.documentElement.outerHTML,
|
||||
);
|
||||
});
|
||||
}
|
||||
});
|
||||
@@ -9,5 +9,7 @@
|
||||
"outDir": "build",
|
||||
"lib": ["es6", "dom"]
|
||||
},
|
||||
"compileOnSave": true
|
||||
"compileOnSave": true,
|
||||
"exclude": ["test"],
|
||||
"include": ["index.d.ts"]
|
||||
}
|
||||
|
||||
10
tslint.json
10
tslint.json
@@ -9,7 +9,13 @@
|
||||
"object-literal-sort-keys": false,
|
||||
"no-unused-variable": true,
|
||||
"object-literal-key-quotes": false,
|
||||
"variable-name": [true, "ban-keywords", "check-format", "allow-leading-underscore"]
|
||||
"variable-name": [
|
||||
true,
|
||||
"ban-keywords",
|
||||
"check-format",
|
||||
"allow-leading-underscore"
|
||||
],
|
||||
"arrow-parens": false
|
||||
},
|
||||
"rulesDirectory": []
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user