Ok, admittedly it's more like the Way Back Machine than the H.G. Wells version.

I realized recently that there are a couple of challenges I face as Dev Manager that having a visual history of webpages would solve.

Challenge 1: Visual History

Once we've made a UI change, it's sometimes difficult to compare it to what it looked like previously. And even harder to review how the UI has changed over time.

I try to overcome this by asking devs to take a before/after screenshot and paste in the TFS (Team Foundation Server) work item but it's not something we do consistently.

Image caption: Tracking intended visual changes over time

Challenge 2: Spotting Visual Regressions

When undesired UI regressions sneak in (some unwanted padding here, a paragraph missing there..) they often get overlooked at the testing stage and not spotted until days or weeks later.

Image caption: Accidental visual changes sometimes can take a while to be noticed

The solution: A time machine

Well, as near as i'll probably ever get to creating a time machine..

If i'm perfectly honest, it's not as fancy as a time machine.

It's a .NET Core Console Application that I run whenever we do a deployment to Leasing.com (sometimes multiple times a day), that runs Selenium to take screenshots in Mobile, Desktop and Tablet dimensions of 30 main pages, then save them to Azure Blob Storage and Azure Table Storage.

Then a simple .NET Core MVC Web Application retrieves and displays those images from a particular 'run'.

I'd like to develop this even further to

• Identify visual changes between deployments by using an image diff library and highlighting image differences for easy visual detection or automated notification.
• Show the evolution of a page over time.

Summary: It will benefit us in 'the future'

The slightly annoying thing about this, is that it would have been a great thing to do about a year ago, then today I could go back in time to see UI changes on various pages.

That said, I don't think it will be long before the phrase "check the time machine" will become commonplace in the office after it has been in use for a number of weeks.

I'll create another post with some screenshots including image diffs hopefully.

-- Lee