Thanks to some great work by Daniel Wabyick and his team, Hardy has had a bunch of improvements over the last few weeks.
The biggest change in this version is that, if you have GraphicsMagick installed on your machine, Hardy will use it for native image diffs but fall back to the built-in method if you don't. The current image diff technique involves creating an HTML page with a canvas, opening that with PhantomJS, loading the image into the canvas and using imagediff.js to calculate the diffs. It works everywhere PhantomJS works but it's slow. Daniel benchmarked the difference and it's a huge performance gain if you rely on image diff tests.
There's also some minor improvement around logging and the cucumber report format but I'll write about them later once I've had a chance to update the Hardy website.
I've been working on a new little side project recently (more info soon) which involves a Chrome Devtools extension. These are Chrome extensions that aren't targeted at changing your usual browsing experience like a normal extension but are actually aimed at modifying or providing extra behaviour for the Chrome Devtools panel. It's a little bit meta.
The theory behind them isn't that tricky and if you have any experience with standard Chrome extensions, you'd probably 'get' devtools extensions quite easily. Unfortunately, I was coming in with no prior knowledge at all and got quite lost for a few days. The docs are very helpful and the Google Group is handy but it still took me a while.
The main area I had difficulty with was the message passing. Sending info from my panel in the devtools window to the page being inspected and vice versa proved to be... complicated. I've used message events before but it still took me a while to figure out what was going where. It seems there are three individual execution contexts:
The Panel
The Background
The Page
They each have access to different bits of the Chrome Extension API and the inspected page. I won't go into details of that here as others haveexplained it better. What I will do, though, is share this project - Devtools Extension Starter Kit. This does nothing more than create a panel containing three buttons. The first executes a snippet of JS in the context of the inspected page, the second attaches a complete JS file to the inspected page (allowing execution) and the third replaces the entire inspected page with a button. When you click on this button, it will send data back from the inspected page to the devtools panel.
Essentially, it's all the communication channels I found I needed for my extension and should be a useful starting point for anyone wanting to do something similar.
I also heard today about a new Yeoman generator that makes building Chrome Extensions easier. It would probably have made the first bit of my investigations a lot easier if I'd known about that beforehand.
Continuing my attempts to convince the world that CSS testing is a good thing, I wrote an article for .net Magazine. Issue 240, to be precise. Page 88 to be exact.
It's one of the few things I've done recently that I can actually point my Mum at and say "That. That there, that's what I do for a living". Which is nice.
On Saturday 19th January, we hosted our first HERE Maps API hackathon here in Berlin. The weather (several degrees below freezing) meant a few no-shows but those came had a fun and productive day.
Hacks developed on the day included:
Cutting edge technologies
In between running around helping everybody else with their hacks, Max found the time to integrate the just-landed-in-webkit Web Speech API with a map. This means you can now speak to your computer and ask it to "Find me a restaurant". Also: "Find me monkeys. Lots of Monkeys". I kinda used that a lot while testing it out. In fact, I didn't use anything else while testing it, just that.
There were two projects that involved analysing the content of tweets and RSS from various news sources to determine areas around the world where the news is happening.
The majority of projects used the Web APIs but there was one team who developed a Windows Phone application. Using the concept of the 'Fog of War' from the classic Age of Empires, they brought together map exploration and POI discovery into a gamified location experience. This project was so thoroughly developed with consideration to future marketing potential that it was the overall winner for the day.
We might aim for another hackathon in the Summer so if you're anywhere near Berlin and fancy spending a day hacking on Geo API stuff, drop me a line.
