Friday, November 16, 2012

Testing OpenLayers with Selenium (Patch)

To improve the quality of both my sleep and Mappu development I have started using Selenium IDE for automated testing of Mappu's UI.

It was kind of hard at the beginning, being the UI based on Sproutcore which has the annoying habit of changing the controls ids with every page load, but after a while I was able to get it rolling quite nicely. Then I hit a major roadblock: the OpenLayers-based map control wouldn't react to clicks, mousedown, mouseup, fireEvent or anything else I threw at it.

At first I thought I was sending the events to the wrong element (and I was, at the beginning), but after a while I realized there was something else.

So I forked OL and started hacking away. To make a long story short I debugged the OpenLayers code until I figured it out. The details are in this cold and lonely thread on the openlayers-users mailing list.
Honestly I don't know why Selenium IDE is sending that event with negative coords (which is not triggered during normal user interation), but it seems like the fix I came up with is mostly harmless as all the tests still pass.

So if you want to use Selenium and OpenLayers and you're willing to put up with the risk of monkey patching OpenLayers you can just add this fragment of code in your page after OpenLayers has loaded and before using any OpenLayers object:

OpenLayers.Handler.Click.prototype.mousedown=function(evt) {
     if(evt.xy && (evt.xy.x <= 0.0 && evt.xy.y <= 0.0)) {
         return true;
     }
     this.down = this.getEventInfo(evt);
     this.last = this.getEventInfo(evt);
     return true;
 };

Tested with OpenLayer 2.11 and 2.12. Use at your own risk.

No comments: