❤
npm
Sign UpSign In

session-recorder
TypeScript icon, indicating that this package has built-in type declarations

1.1.1 • Public • Published

(🚧 WIP) Session Recorder

Imagine that a video camera continuously record the whole page

See also Session-Player for consuming Recorder's data

Record list:

  • DOM mutation
  • Network(xhr, fetch, beacon)
  • Global Error, Unhandled rejection
  • Mouse, Scroll
  • Console

Output like:

[
  {"t": 0, "type": "snapshot", "snapshot": "#document snapshot", "scroll": ... },
  { "t": 1, "type": "node", "add": [{ "html": "<div id>textContent</div>" }], "target": 6 },
  { "t": 2, "type": "form", "target": 16, "k": "value", "v": "2312" },
  { "t": 3, "type": "attr", "target": 14, "attr": { "k": "class", "v": "a" } },
  { "t": 4, "type": "scroll", "x": 0, "y": 10 },
  { "t": 5, "type": "click", "x": 71, "y": 13 },
  { "t": 6, "type": "form", "target": 19, "k": "checked", "v": true },
  { "t": 7, "type": "jserr", "msg": "Type Error: ...", "url": "...", "err": "..." },
  { "t": 8, "type": "xhr", "url": "...", "method": "GET", "response": "21asdcxz" },
  { "t": 9, "type": "fetch", "status": 503, "response": "21asdcxz" },
  { "t": 10, "type": "move", "x": 38, "y": 510 },
  { "t": 11, "type": "console", "l": "warn", "msg": "..." }
]

Code intergration:

import SessionRecorder from 'session-recorder'
 
const myReocrder = new SessionRecorder()
 
myReocrder.start() // make sure start after DOMContentLoaded
myReocrder.end() // stop record

TODO

  • Use VDOM record mutation
  • Using WebWorker store trail data

Build Setup

# serve file with hot reload at https://localhost:8000 
npm run dev
 
# build with tsc, complie into ESModule 
npm run build

Document (constructing)

Readme

Keywords

Package Sidebar

Install

npm i session-recorder

Repository

github.com/waynecz/session-recorder

Homepage

github.com/waynecz/session-recorder#readme

Weekly Downloads

24

Version

1.1.1

License

MIT

Unpacked Size

55.3 kB

Total Files

32

Last publish

Collaborators

  • waynecz
Try on RunKit
Report malware