Time Machine by xkcd

A few days ago I added visual testing to our ReactJS-based components library.

Pretty early in the process, I encountered a consistency problem that caused false positive errors.
The reason was, several components are using the current date/time, thus failing the tests.

My first thought was going with the “naive” approach - using a constant datetime along all relevant components visual examples (stories in Storybook, for example). Aside from not being an elegant solution, it requires anyone who writes a component in the future to keep in mind using const date and time. Not easily maintainable.

That’s when I found timemachine.

It is aimed to “test your time-dependent app by monkey patching the Date function and overriding your system time”

Usage

To set a date:

timemachine.config({
  dateString: 'March 4, 2017 18:21:11'
});

If you’re using Storybook, add it to your .storybook/config.js

Now with every new call to Date:

console.log(new Date()); // March 4, 2017 18:21:11

Reset:

timemachine.reset();

Installation

$ npm install --save-dev timemachine