Create snapshots of API states in JavaScript, then replay them back as test data for your application code


Keywords
data, js, api, telemetry, test, testing
License
GPL-3.0
Install
npm install replay-telemetry@1.2.7

Documentation

replay-telemetry: record and replay state changes for regression testing

This library is used for recording UI state changes (i.e. mouse pointer moving, VR headset moving, etc.) over time, then serializing them to a format that can be reloaded at a later date and used to test software.

This is achieved by using a "state object" (defaulting to the window) in which you store the values to be changed, and indicating which fields you want to watch in that state object. Then, in an animation loop, you call "update", and the system checks for changes and records a "frame" of data. Only values that have changed get recorded. If no values have changed, an empty frame gets recorded, marking the passing of time.

Example

https://github.com/capnmidnight/replay-telemetry/blob/master/test.html

var ball = document.getElementById("ball"),
    stat = document.getElementById("status"),
    recording = true,
    recorder = new Replay.Recorder([ "left", "top" ], ball.style),
    player = new Replay.Player(ball.style);
    // also valid:
    //
    // recorder = new Replay.Recorder([ "style.left", "style.top" ], ball),
    // player = new Replay.Player(ball);
    //
    // or:
    // recorder = new Replay.Recorder([ "ball.style.left", "ball.style.top" ]),
    // player = new Replay.Player();

window.addEventListener("mousemove", mouseMove);
requestAnimationFrame(record);

function mouseMove(evt){
  if(recording){
    ball.style.left = evt.clientX + "px";
    ball.style.top = evt.clientY + "px";
  }
}

function record(t){
  var dt = t - recorder.startT;
  if(recorder.startT === null || dt < 3000){
    stat.innerHTML = "Recording - move mouse " + (3 - dt/1000).toFixed(1) + "s";
    recorder.update(t);
    requestAnimationFrame(record);
  }
  else{
    recording = false;
    player.reset();
    player.parse(recorder.toJSON());
    player.reverse();
    requestAnimationFrame(playback);
  }
}

function playback(t){
  var dt = t - player.startT;
  if(!player.done){
    stat.innerHTML = "Playback " + (3 - dt/1000).toFixed(1) + "s";
    player.update(t);
    requestAnimationFrame(playback);
  }
  else{
    recording = true;
    recorder.reset();
    requestAnimationFrame(record);
  }
}

Licensing

replay-telemetry is free, open source software (GPLv3) and may readily be used with other FOSS projects.

Contributions

To simplify licensing issues, contributions to replay-telemetry require a copyright assignment to me, Sean T. McBeth. Please include your name and email address in the CONTRIBUTORS.md file with your pull request. This will serve as your copyright assignment.