Skip to main content

Stabilizing Dates

There are several strategies that can be used to stabilize the display of dates in screenshots:

Freezing the Date

If the displayed date is not the primary focus of the test, it may be helpful to freeze the date to a fixed value.

This can be done using the native command of your end-to-end testing framework, such as:

/* Cypress command to freeze date to 20 May 2030 */
const now = new Date(2030, 4, 20);

Alternatively, you can use an external library like MockDate to mock the current date.

Hiding the Date

If neither of these methods are effective, you can try hiding the node that displays the date from the screenshot using style injection. This can be done by adding the following CSS to your style injection:

[data-test-date] {
display: none !important;

Then, add the data-test-date attribute to the element that displays the date in your HTML. This will hide the element from the screenshot.