From 71932ee530bc7e9fe6117c597cb139618f62d089 Mon Sep 17 00:00:00 2001 From: Yanzhen Yu Date: Tue, 16 Oct 2018 17:53:35 +0800 Subject: [PATCH] update README and add travis --- .travis.yml | 14 ++++++++++++++ README.md | 32 ++++++++++++++++++++++++++++++++ test/integration.ts | 1 - 3 files changed, 46 insertions(+), 1 deletion(-) create mode 100644 .travis.yml diff --git a/.travis.yml b/.travis.yml new file mode 100644 index 00000000..55653dd1 --- /dev/null +++ b/.travis.yml @@ -0,0 +1,14 @@ +language: node_js + +node_js: + - 10 + +cache: + directories: + - 'node_modules' + +install: + - npm install + +script: + - npm test diff --git a/README.md b/README.md index 854d85b9..1dcd2ada 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,36 @@ # rrweb-snapshot +[![Build Status](https://travis-ci.org/rrweb-io/rrweb-snapshot.svg?branch=master)](https://travis-ci.org/rrweb-io/rrweb-snapshot) + Snapshot the DOM into a stateful and serializable data structure. Also provide the ability to rebuild the DOM via snapshot. + +## API + +This module export 3 methods: + +### snapshot + +`snapshot` will traverse the DOM and return a stateful and serializable data structure which can represent the current DOM **view**. + +There are serveral things will be done during snapshot: + +1. Inline some DOM states into HTML attributes, e.g, HTMLInputElement's value. +2. Turn script tags into noscript tags to avoid scripts being executed. +3. Try to inline stylesheets to make sure local stylesheets can be used. +4. Make relative paths in href, src, css to be absolute paths. +5. Give a id to each Node, and return the id node map when snapshot finished. + +#### rebuild + +`rebuild` will build the DOM according to the taken snapshot. + +There are serveral things will be done during rebuild: + +1. Add data-rrid attribute if Node is an Element. +2. Create some extra DOM node like text node to place inline css and some states. +3. Add data-extra-child-index attribute if Node has some extra child DOM. + +#### serializeNodeWithId + +`serializeNodeWithId` can serialize a node into snapshot format with id. diff --git a/test/integration.ts b/test/integration.ts index 861c6580..700469f2 100644 --- a/test/integration.ts +++ b/test/integration.ts @@ -71,7 +71,6 @@ describe('integration tests', () => { this.server = await server(); this.browser = await puppeteer.launch({ // headless: false, - executablePath: '/home/yanzhen/Desktop/chrome-linux/chrome', }); const bundle = await rollup.rollup({