diff --git a/tests/Renderer/test_Elements.html b/tests/Renderer/test_Elements.html
new file mode 100644
index 0000000000..eeca92a067
--- /dev/null
+++ b/tests/Renderer/test_Elements.html
@@ -0,0 +1,1428 @@
+<html>
+<head>
+<script src="../../lib/OpenLayers.js"></script>
+  <script type="text/javascript">
+
+    function test_Elements_constructor(t) {
+        t.plan(5);
+        var el = document.body;
+        el.id = "foo";
+        
+        OpenLayers.Renderer.Elements.prototype._createRenderRoot =
+            OpenLayers.Renderer.Elements.prototype.createRenderRoot;
+        
+        var rendererRoot = document.createElement("div");
+        OpenLayers.Renderer.Elements.prototype.createRenderRoot = function() {
+            return rendererRoot;
+        }
+        
+        OpenLayers.Renderer.Elements.prototype._createRoot =
+            OpenLayers.Renderer.Elements.prototype.createRoot;
+        
+        var root = document.createElement("div");
+        OpenLayers.Renderer.Elements.prototype.createRoot = function() {
+            return root;
+        }
+        
+        var r = new OpenLayers.Renderer.Elements("foo");
+        
+        t.ok(r instanceof OpenLayers.Renderer.Elements, "new OpenLayers.Renderer.Elements returns Elements object" );
+        t.ok(r.rendererRoot != null, "elements rendererRoot is not null");
+        t.ok(r.root != null, "elements root is not null");
+        
+        t.ok(r.root.parentNode == rendererRoot, "elements root is correctly appended to rendererRoot");
+        t.ok(r.rendererRoot.parentNode == document.body, "elements rendererRoot is correctly appended to container");
+        
+        OpenLayers.Renderer.Elements.prototype.createRenderRoot =
+            OpenLayers.Renderer.Elements.prototype._createRenderRoot;
+        OpenLayers.Renderer.Elements.prototype.createRoot =
+            OpenLayers.Renderer.Elements.prototype._createRoot;
+    }
+    
+    function test_Elements_destroy(t) {
+        t.plan(5);
+        
+        OpenLayers.Renderer.Elements.prototype._initialize =
+            OpenLayers.Renderer.Elements.prototype.initialize;
+        
+        OpenLayers.Renderer.Elements.prototype.initialize = function() {}
+        
+        var g_Clear = false, g_Destroy = false;
+        
+        OpenLayers.Renderer.prototype._destroy = 
+            OpenLayers.Renderer.prototype.destroy;
+            
+        OpenLayers.Renderer.prototype.destroy = function() {
+            g_Destroy = true;
+        }
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.clear = function() {
+            g_Clear = true;
+        }
+        r.rendererRoot = 'foo';
+        r.root = 'bar';
+        r.xmlns = 'dude';
+        
+        r.destroy();
+        
+        t.eq(g_Clear, true, "OpenLayers.Renderer.Elements.clear() called");
+        t.eq(r.rendererRoot, null, "rendererRoot nullified");
+        t.eq(r.root, null, "root nullified");
+        t.eq(r.xmlns, null, "xmlns nullified");
+        t.eq(g_Destroy, true, "OpenLayers.Renderer.destroy() called");
+        
+        OpenLayers.Renderer.Elements.prototype.initialize =
+            OpenLayers.Renderer.Elements.prototype._initialize;
+        OpenLayers.Renderer.prototype.destroy = 
+            OpenLayers.Renderer.prototype._destroy;
+    }
+    
+    function test_Elements_clear(t) {
+        t.plan(1);
+        
+        OpenLayers.Renderer.Elements.prototype._initialize =
+            OpenLayers.Renderer.Elements.prototype.initialize;
+        
+        OpenLayers.Renderer.Elements.prototype.initialize = function() {}
+        
+        var r = new OpenLayers.Renderer.Elements();
+        var element = document.createElement("div");
+        r.root = element;
+        
+        var node = document.createElement("div");
+        element.appendChild(node);
+        
+        r.clear();
+        
+        t.ok(r.root.childNodes.length == 0, "root is correctly cleared");
+        
+        OpenLayers.Renderer.Elements.prototype.initialize =
+            OpenLayers.Renderer.Elements.prototype._initialize;
+    }
+    
+    function test_Elements_drawGeometry(t) {
+        t.plan(4);
+        
+        OpenLayers.Renderer.Elements.prototype._initialize =
+            OpenLayers.Renderer.Elements.prototype.initialize;
+        
+        OpenLayers.Renderer.Elements.prototype.initialize = function() {};
+        
+        var r = new OpenLayers.Renderer.Elements();
+        
+        var element = document.createElement("div");
+        r.root = element;
+
+        r.nodeFactory = function(gid, nt, g) {
+            var element = document.createElement("div");
+            return element;
+        }
+        var g_Node = null;
+        r.drawGeometryNode = function(n, g) {
+            g_Node = n;
+            return;
+        }
+        r.getNodeType = function(geometry) {
+            return "div";
+        }
+        geometry = {
+            id: 'foo',
+            CLASS_NAME: 'bar'
+        };
+        var style = true;
+        var featureId = 'dude';
+        r.drawGeometry(geometry, style, featureId);
+        t.ok(g_Node.parentNode == r.root, "node is correctly appended to root");
+        t.eq(g_Node._featureId, 'dude', "_featureId is correct");
+        t.ok(g_Node._style, "_style is correct");
+        t.eq(g_Node._geometryClass, 'bar', "_geometryClass is correct");
+        
+        OpenLayers.Renderer.Elements.prototype.initialize =
+            OpenLayers.Renderer.Elements.prototype._initialize;
+    }
+
+    function test_Elements_drawGeometry_2(t) {
+        t.plan(9);
+        
+        OpenLayers.Renderer.Elements.prototype._initialize =
+            OpenLayers.Renderer.Elements.prototype.initialize;
+            
+        OpenLayers.Renderer.Elements.prototype.initialize = function() {};
+
+        var r = new OpenLayers.Renderer.Elements();
+        
+        var element = document.createElement("div");
+        r.root = element;
+        
+        r.nodeFactory = function(gid, nt, g) {
+            var element = document.createElement("div");
+            return element;
+        }
+        r.setStyle = function() {};
+        
+        // point
+        var properDraw = false;
+        r.drawPoint = function(node, geometry) {
+            properDraw = true;
+            node = node;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.Point'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawPoint when passed a point");
+
+        // line string
+        var properDraw = false;
+        r.drawLineString = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.LineString'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawLineString when passed a line string");
+
+        // linear ring
+        var properDraw = false;
+        r.drawLinearRing = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.LinearRing'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawLinearRing when passed a linear ring");
+
+        // polygon
+        var properDraw = false;
+        r.drawPolygon = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.Polygon'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawPolygon when passed a polygon");
+
+        // surface
+        var properDraw = false;
+        r.drawSurface = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.Surface'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawSurface when passed a surface");
+
+        // rectangle
+        var properDraw = false;
+        r.drawRectangle = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.Rectangle'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawRectangle when passed a rectangle");
+
+        // multi-point
+        var properDraw = false;
+        r.drawPoint = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {
+            CLASS_NAME: 'OpenLayers.Geometry.MultiPoint',
+            components: [{CLASS_NAME: 'OpenLayers.Geometry.Point'}]
+        };
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawPoint when passed a multi-point");
+
+        // multi-linestring
+        var properDraw = false;
+        r.drawLineString = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {
+            CLASS_NAME: 'OpenLayers.Geometry.MultiLineString',
+            components: [{CLASS_NAME: 'OpenLayers.Geometry.LineString'}]
+        };
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawLineString when passed a multi-linestring");
+
+        // multi-polygon
+        var properDraw = false;
+        r.drawPolygon = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {
+            CLASS_NAME: 'OpenLayers.Geometry.MultiPolygon',
+            components: [{CLASS_NAME: 'OpenLayers.Geometry.Polygon'}]
+        };
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawPolygon when passed a multi-polygon");
+        
+        OpenLayers.Renderer.Elements.prototype.initialize =
+            OpenLayers.Renderer.Elements.prototype._initialize;
+    }
+    
+    function test_Elements_getfeatureidfromevent(t) {
+        t.plan(2);
+        
+        var node = {
+            _featureId: 'foo'
+        }
+        var event = {
+            target: node
+        }
+        
+        var id = OpenLayers.Renderer.Elements.prototype.getFeatureIdFromEvent(event);
+        t.eq(id, 'foo', "returned id is correct when event with target is passed");
+        
+        var event = {
+            srcElement: node
+        }
+        
+        var id = OpenLayers.Renderer.Elements.prototype.getFeatureIdFromEvent(event);
+        t.eq(id, 'foo', "returned id is correct when event with srcElement is passed");
+    }
+    
+    function test_Elements_erasegeometry(t) {
+        t.plan(4);
+        
+        var el = document.createElement('div');
+        document.body.appendChild(el);
+        el.id = 'foo';
+        var geometry = {
+            id: 'foo'
+        };
+        
+        OpenLayers.Renderer.Elements.prototype.eraseGeometry(geometry);
+        t.ok(el.parentNode != document.body, "element correctly removed");
+
+
+        var el = document.createElement('div');
+        document.body.appendChild(el);
+        el.id = 'foo';
+        var geometry = {
+            CLASS_NAME: "OpenLayers.Geometry.MultiPoint",
+            components: [{
+                id: 'foo'
+            }]
+        };
+
+        OpenLayers.Renderer.Elements.prototype.eraseGeometry(geometry);
+        t.ok(el.parentNode != document.body, "geometry components correctly removed when passed a multipoint");
+        
+        var el = document.createElement('div');
+        document.body.appendChild(el);
+        el.id = 'foo';
+        var geometry = {
+            CLASS_NAME: "OpenLayers.Geometry.MultiLineString",
+            components: [{
+                id: 'foo'
+            }]
+        };
+        
+        OpenLayers.Renderer.Elements.prototype.eraseGeometry(geometry);
+        t.ok(el.parentNode != document.body, "geometry components correctly removed when passed a multilinestring");
+        
+        var el = document.createElement('div');
+        document.body.appendChild(el);
+        el.id = 'foo';
+        var geometry = {
+            CLASS_NAME: "OpenLayers.Geometry.MultiPolygon",
+            components: [{
+                id: 'foo'
+            }]
+        };
+        
+        OpenLayers.Renderer.Elements.prototype.eraseGeometry(geometry);
+        t.ok(el.parentNode != document.body, "geometry components correctly removed when passed a multipolygon");
+    }    
+
+  </script>
+</head>
+<body>
+<div id="map" style="width:500px;height:550px"></div>
+</body>
+</html>
+<html>
+<head>
+<script src="../../lib/OpenLayers.js"></script>
+  <script type="text/javascript">
+
+    function test_Elements_constructor(t) {
+        t.plan(5);
+        var el = document.body;
+        el.id = "foo";
+        
+        OpenLayers.Renderer.Elements.prototype._createRenderRoot =
+            OpenLayers.Renderer.Elements.prototype.createRenderRoot;
+        
+        var rendererRoot = document.createElement("div");
+        OpenLayers.Renderer.Elements.prototype.createRenderRoot = function() {
+            return rendererRoot;
+        }
+        
+        OpenLayers.Renderer.Elements.prototype._createRoot =
+            OpenLayers.Renderer.Elements.prototype.createRoot;
+        
+        var root = document.createElement("div");
+        OpenLayers.Renderer.Elements.prototype.createRoot = function() {
+            return root;
+        }
+        
+        var r = new OpenLayers.Renderer.Elements("foo");
+        
+        t.ok(r instanceof OpenLayers.Renderer.Elements, "new OpenLayers.Renderer.Elements returns Elements object" );
+        t.ok(r.rendererRoot != null, "elements rendererRoot is not null");
+        t.ok(r.root != null, "elements root is not null");
+        
+        t.ok(r.root.parentNode == rendererRoot, "elements root is correctly appended to rendererRoot");
+        t.ok(r.rendererRoot.parentNode == document.body, "elements rendererRoot is correctly appended to container");
+        
+        OpenLayers.Renderer.Elements.prototype.createRenderRoot =
+            OpenLayers.Renderer.Elements.prototype._createRenderRoot;
+        OpenLayers.Renderer.Elements.prototype.createRoot =
+            OpenLayers.Renderer.Elements.prototype._createRoot;
+    }
+    
+    function test_Elements_destroy(t) {
+        t.plan(5);
+        
+        OpenLayers.Renderer.Elements.prototype._initialize =
+            OpenLayers.Renderer.Elements.prototype.initialize;
+        
+        OpenLayers.Renderer.Elements.prototype.initialize = function() {}
+        
+        var g_Clear = false, g_Destroy = false;
+        
+        OpenLayers.Renderer.prototype._destroy = 
+            OpenLayers.Renderer.prototype.destroy;
+            
+        OpenLayers.Renderer.prototype.destroy = function() {
+            g_Destroy = true;
+        }
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.clear = function() {
+            g_Clear = true;
+        }
+        r.rendererRoot = 'foo';
+        r.root = 'bar';
+        r.xmlns = 'dude';
+        
+        r.destroy();
+        
+        t.eq(g_Clear, true, "OpenLayers.Renderer.Elements.clear() called");
+        t.eq(r.rendererRoot, null, "rendererRoot nullified");
+        t.eq(r.root, null, "root nullified");
+        t.eq(r.xmlns, null, "xmlns nullified");
+        t.eq(g_Destroy, true, "OpenLayers.Renderer.destroy() called");
+        
+        OpenLayers.Renderer.Elements.prototype.initialize =
+            OpenLayers.Renderer.Elements.prototype._initialize;
+        OpenLayers.Renderer.prototype.destroy = 
+            OpenLayers.Renderer.prototype._destroy;
+    }
+    
+    function test_Elements_clear(t) {
+        t.plan(1);
+        
+        OpenLayers.Renderer.Elements.prototype._initialize =
+            OpenLayers.Renderer.Elements.prototype.initialize;
+        
+        OpenLayers.Renderer.Elements.prototype.initialize = function() {}
+        
+        var r = new OpenLayers.Renderer.Elements();
+        var element = document.createElement("div");
+        r.root = element;
+        
+        var node = document.createElement("div");
+        element.appendChild(node);
+        
+        r.clear();
+        
+        t.ok(r.root.childNodes.length == 0, "root is correctly cleared");
+        
+        OpenLayers.Renderer.Elements.prototype.initialize =
+            OpenLayers.Renderer.Elements.prototype._initialize;
+    }
+    
+    function test_Elements_drawGeometry(t) {
+        t.plan(4);
+        
+        OpenLayers.Renderer.Elements.prototype._initialize =
+            OpenLayers.Renderer.Elements.prototype.initialize;
+        
+        OpenLayers.Renderer.Elements.prototype.initialize = function() {};
+        
+        var r = new OpenLayers.Renderer.Elements();
+        
+        var element = document.createElement("div");
+        r.root = element;
+
+        r.nodeFactory = function(gid, nt, g) {
+            var element = document.createElement("div");
+            return element;
+        }
+        var g_Node = null;
+        r.drawGeometryNode = function(n, g) {
+            g_Node = n;
+            return;
+        }
+        r.getNodeType = function(geometry) {
+            return "div";
+        }
+        geometry = {
+            id: 'foo',
+            CLASS_NAME: 'bar'
+        };
+        var style = true;
+        var featureId = 'dude';
+        r.drawGeometry(geometry, style, featureId);
+        t.ok(g_Node.parentNode == r.root, "node is correctly appended to root");
+        t.eq(g_Node._featureId, 'dude', "_featureId is correct");
+        t.ok(g_Node._style, "_style is correct");
+        t.eq(g_Node._geometryClass, 'bar', "_geometryClass is correct");
+        
+        OpenLayers.Renderer.Elements.prototype.initialize =
+            OpenLayers.Renderer.Elements.prototype._initialize;
+    }
+
+    function test_Elements_drawGeometry_2(t) {
+        t.plan(9);
+        
+        OpenLayers.Renderer.Elements.prototype._initialize =
+            OpenLayers.Renderer.Elements.prototype.initialize;
+            
+        OpenLayers.Renderer.Elements.prototype.initialize = function() {};
+
+        var r = new OpenLayers.Renderer.Elements();
+        
+        var element = document.createElement("div");
+        r.root = element;
+        
+        r.nodeFactory = function(gid, nt, g) {
+            var element = document.createElement("div");
+            return element;
+        }
+        r.setStyle = function() {};
+        
+        // point
+        var properDraw = false;
+        r.drawPoint = function(node, geometry) {
+            properDraw = true;
+            node = node;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.Point'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawPoint when passed a point");
+
+        // line string
+        var properDraw = false;
+        r.drawLineString = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.LineString'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawLineString when passed a line string");
+
+        // linear ring
+        var properDraw = false;
+        r.drawLinearRing = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.LinearRing'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawLinearRing when passed a linear ring");
+
+        // polygon
+        var properDraw = false;
+        r.drawPolygon = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.Polygon'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawPolygon when passed a polygon");
+
+        // surface
+        var properDraw = false;
+        r.drawSurface = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.Surface'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawSurface when passed a surface");
+
+        // rectangle
+        var properDraw = false;
+        r.drawRectangle = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.Rectangle'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawRectangle when passed a rectangle");
+
+        // multi-point
+        var properDraw = false;
+        r.drawPoint = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {
+            CLASS_NAME: 'OpenLayers.Geometry.MultiPoint',
+            components: [{CLASS_NAME: 'OpenLayers.Geometry.Point'}]
+        };
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawPoint when passed a multi-point");
+
+        // multi-linestring
+        var properDraw = false;
+        r.drawLineString = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {
+            CLASS_NAME: 'OpenLayers.Geometry.MultiLineString',
+            components: [{CLASS_NAME: 'OpenLayers.Geometry.LineString'}]
+        };
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawLineString when passed a multi-linestring");
+
+        // multi-polygon
+        var properDraw = false;
+        r.drawPolygon = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {
+            CLASS_NAME: 'OpenLayers.Geometry.MultiPolygon',
+            components: [{CLASS_NAME: 'OpenLayers.Geometry.Polygon'}]
+        };
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawPolygon when passed a multi-polygon");
+        
+        OpenLayers.Renderer.Elements.prototype.initialize =
+            OpenLayers.Renderer.Elements.prototype._initialize;
+    }
+    
+    function test_Elements_getfeatureidfromevent(t) {
+        t.plan(2);
+        
+        var node = {
+            _featureId: 'foo'
+        }
+        var event = {
+            target: node
+        }
+        
+        var id = OpenLayers.Renderer.Elements.prototype.getFeatureIdFromEvent(event);
+        t.eq(id, 'foo', "returned id is correct when event with target is passed");
+        
+        var event = {
+            srcElement: node
+        }
+        
+        var id = OpenLayers.Renderer.Elements.prototype.getFeatureIdFromEvent(event);
+        t.eq(id, 'foo', "returned id is correct when event with srcElement is passed");
+    }
+    
+    function test_Elements_erasegeometry(t) {
+        t.plan(4);
+        
+        var el = document.createElement('div');
+        document.body.appendChild(el);
+        el.id = 'foo';
+        var geometry = {
+            id: 'foo'
+        };
+        
+        OpenLayers.Renderer.Elements.prototype.eraseGeometry(geometry);
+        t.ok(el.parentNode != document.body, "element correctly removed");
+
+
+        var el = document.createElement('div');
+        document.body.appendChild(el);
+        el.id = 'foo';
+        var geometry = {
+            CLASS_NAME: "OpenLayers.Geometry.MultiPoint",
+            components: [{
+                id: 'foo'
+            }]
+        };
+
+        OpenLayers.Renderer.Elements.prototype.eraseGeometry(geometry);
+        t.ok(el.parentNode != document.body, "geometry components correctly removed when passed a multipoint");
+        
+        var el = document.createElement('div');
+        document.body.appendChild(el);
+        el.id = 'foo';
+        var geometry = {
+            CLASS_NAME: "OpenLayers.Geometry.MultiLineString",
+            components: [{
+                id: 'foo'
+            }]
+        };
+        
+        OpenLayers.Renderer.Elements.prototype.eraseGeometry(geometry);
+        t.ok(el.parentNode != document.body, "geometry components correctly removed when passed a multilinestring");
+        
+        var el = document.createElement('div');
+        document.body.appendChild(el);
+        el.id = 'foo';
+        var geometry = {
+            CLASS_NAME: "OpenLayers.Geometry.MultiPolygon",
+            components: [{
+                id: 'foo'
+            }]
+        };
+        
+        OpenLayers.Renderer.Elements.prototype.eraseGeometry(geometry);
+        t.ok(el.parentNode != document.body, "geometry components correctly removed when passed a multipolygon");
+    }    
+
+  </script>
+</head>
+<body>
+<div id="map" style="width:500px;height:550px"></div>
+</body>
+</html>
+<html>
+<head>
+<script src="../../lib/OpenLayers.js"></script>
+  <script type="text/javascript">
+
+    function test_Elements_constructor(t) {
+        t.plan(5);
+        var el = document.body;
+        el.id = "foo";
+        
+        OpenLayers.Renderer.Elements.prototype._createRenderRoot =
+            OpenLayers.Renderer.Elements.prototype.createRenderRoot;
+        
+        var rendererRoot = document.createElement("div");
+        OpenLayers.Renderer.Elements.prototype.createRenderRoot = function() {
+            return rendererRoot;
+        }
+        
+        OpenLayers.Renderer.Elements.prototype._createRoot =
+            OpenLayers.Renderer.Elements.prototype.createRoot;
+        
+        var root = document.createElement("div");
+        OpenLayers.Renderer.Elements.prototype.createRoot = function() {
+            return root;
+        }
+        
+        var r = new OpenLayers.Renderer.Elements("foo");
+        
+        t.ok(r instanceof OpenLayers.Renderer.Elements, "new OpenLayers.Renderer.Elements returns Elements object" );
+        t.ok(r.rendererRoot != null, "elements rendererRoot is not null");
+        t.ok(r.root != null, "elements root is not null");
+        
+        t.ok(r.root.parentNode == rendererRoot, "elements root is correctly appended to rendererRoot");
+        t.ok(r.rendererRoot.parentNode == document.body, "elements rendererRoot is correctly appended to container");
+        
+        OpenLayers.Renderer.Elements.prototype.createRenderRoot =
+            OpenLayers.Renderer.Elements.prototype._createRenderRoot;
+        OpenLayers.Renderer.Elements.prototype.createRoot =
+            OpenLayers.Renderer.Elements.prototype._createRoot;
+    }
+    
+    function test_Elements_destroy(t) {
+        t.plan(5);
+        
+        OpenLayers.Renderer.Elements.prototype._initialize =
+            OpenLayers.Renderer.Elements.prototype.initialize;
+        
+        OpenLayers.Renderer.Elements.prototype.initialize = function() {}
+        
+        var g_Clear = false, g_Destroy = false;
+        
+        OpenLayers.Renderer.prototype._destroy = 
+            OpenLayers.Renderer.prototype.destroy;
+            
+        OpenLayers.Renderer.prototype.destroy = function() {
+            g_Destroy = true;
+        }
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.clear = function() {
+            g_Clear = true;
+        }
+        r.rendererRoot = 'foo';
+        r.root = 'bar';
+        r.xmlns = 'dude';
+        
+        r.destroy();
+        
+        t.eq(g_Clear, true, "OpenLayers.Renderer.Elements.clear() called");
+        t.eq(r.rendererRoot, null, "rendererRoot nullified");
+        t.eq(r.root, null, "root nullified");
+        t.eq(r.xmlns, null, "xmlns nullified");
+        t.eq(g_Destroy, true, "OpenLayers.Renderer.destroy() called");
+        
+        OpenLayers.Renderer.Elements.prototype.initialize =
+            OpenLayers.Renderer.Elements.prototype._initialize;
+        OpenLayers.Renderer.prototype.destroy = 
+            OpenLayers.Renderer.prototype._destroy;
+    }
+    
+    function test_Elements_clear(t) {
+        t.plan(1);
+        
+        OpenLayers.Renderer.Elements.prototype._initialize =
+            OpenLayers.Renderer.Elements.prototype.initialize;
+        
+        OpenLayers.Renderer.Elements.prototype.initialize = function() {}
+        
+        var r = new OpenLayers.Renderer.Elements();
+        var element = document.createElement("div");
+        r.root = element;
+        
+        var node = document.createElement("div");
+        element.appendChild(node);
+        
+        r.clear();
+        
+        t.ok(r.root.childNodes.length == 0, "root is correctly cleared");
+        
+        OpenLayers.Renderer.Elements.prototype.initialize =
+            OpenLayers.Renderer.Elements.prototype._initialize;
+    }
+    
+    function test_Elements_drawGeometry(t) {
+        t.plan(4);
+        
+        OpenLayers.Renderer.Elements.prototype._initialize =
+            OpenLayers.Renderer.Elements.prototype.initialize;
+        
+        OpenLayers.Renderer.Elements.prototype.initialize = function() {};
+        
+        var r = new OpenLayers.Renderer.Elements();
+        
+        var element = document.createElement("div");
+        r.root = element;
+
+        r.nodeFactory = function(gid, nt, g) {
+            var element = document.createElement("div");
+            return element;
+        }
+        var g_Node = null;
+        r.drawGeometryNode = function(n, g) {
+            g_Node = n;
+            return;
+        }
+        r.getNodeType = function(geometry) {
+            return "div";
+        }
+        geometry = {
+            id: 'foo',
+            CLASS_NAME: 'bar'
+        };
+        var style = true;
+        var featureId = 'dude';
+        r.drawGeometry(geometry, style, featureId);
+        t.ok(g_Node.parentNode == r.root, "node is correctly appended to root");
+        t.eq(g_Node._featureId, 'dude', "_featureId is correct");
+        t.ok(g_Node._style, "_style is correct");
+        t.eq(g_Node._geometryClass, 'bar', "_geometryClass is correct");
+        
+        OpenLayers.Renderer.Elements.prototype.initialize =
+            OpenLayers.Renderer.Elements.prototype._initialize;
+    }
+
+    function test_Elements_drawGeometry_2(t) {
+        t.plan(9);
+        
+        OpenLayers.Renderer.Elements.prototype._initialize =
+            OpenLayers.Renderer.Elements.prototype.initialize;
+            
+        OpenLayers.Renderer.Elements.prototype.initialize = function() {};
+
+        var r = new OpenLayers.Renderer.Elements();
+        
+        var element = document.createElement("div");
+        r.root = element;
+        
+        r.nodeFactory = function(gid, nt, g) {
+            var element = document.createElement("div");
+            return element;
+        }
+        r.setStyle = function() {};
+        
+        // point
+        var properDraw = false;
+        r.drawPoint = function(node, geometry) {
+            properDraw = true;
+            node = node;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.Point'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawPoint when passed a point");
+
+        // line string
+        var properDraw = false;
+        r.drawLineString = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.LineString'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawLineString when passed a line string");
+
+        // linear ring
+        var properDraw = false;
+        r.drawLinearRing = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.LinearRing'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawLinearRing when passed a linear ring");
+
+        // polygon
+        var properDraw = false;
+        r.drawPolygon = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.Polygon'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawPolygon when passed a polygon");
+
+        // surface
+        var properDraw = false;
+        r.drawSurface = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.Surface'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawSurface when passed a surface");
+
+        // rectangle
+        var properDraw = false;
+        r.drawRectangle = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.Rectangle'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawRectangle when passed a rectangle");
+
+        // multi-point
+        var properDraw = false;
+        r.drawPoint = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {
+            CLASS_NAME: 'OpenLayers.Geometry.MultiPoint',
+            components: [{CLASS_NAME: 'OpenLayers.Geometry.Point'}]
+        };
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawPoint when passed a multi-point");
+
+        // multi-linestring
+        var properDraw = false;
+        r.drawLineString = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {
+            CLASS_NAME: 'OpenLayers.Geometry.MultiLineString',
+            components: [{CLASS_NAME: 'OpenLayers.Geometry.LineString'}]
+        };
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawLineString when passed a multi-linestring");
+
+        // multi-polygon
+        var properDraw = false;
+        r.drawPolygon = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {
+            CLASS_NAME: 'OpenLayers.Geometry.MultiPolygon',
+            components: [{CLASS_NAME: 'OpenLayers.Geometry.Polygon'}]
+        };
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawPolygon when passed a multi-polygon");
+        
+        OpenLayers.Renderer.Elements.prototype.initialize =
+            OpenLayers.Renderer.Elements.prototype._initialize;
+    }
+    
+    function test_Elements_getfeatureidfromevent(t) {
+        t.plan(2);
+        
+        var node = {
+            _featureId: 'foo'
+        }
+        var event = {
+            target: node
+        }
+        
+        var id = OpenLayers.Renderer.Elements.prototype.getFeatureIdFromEvent(event);
+        t.eq(id, 'foo', "returned id is correct when event with target is passed");
+        
+        var event = {
+            srcElement: node
+        }
+        
+        var id = OpenLayers.Renderer.Elements.prototype.getFeatureIdFromEvent(event);
+        t.eq(id, 'foo', "returned id is correct when event with srcElement is passed");
+    }
+    
+    function test_Elements_erasegeometry(t) {
+        t.plan(4);
+        
+        var el = document.createElement('div');
+        document.body.appendChild(el);
+        el.id = 'foo';
+        var geometry = {
+            id: 'foo'
+        };
+        
+        OpenLayers.Renderer.Elements.prototype.eraseGeometry(geometry);
+        t.ok(el.parentNode != document.body, "element correctly removed");
+
+
+        var el = document.createElement('div');
+        document.body.appendChild(el);
+        el.id = 'foo';
+        var geometry = {
+            CLASS_NAME: "OpenLayers.Geometry.MultiPoint",
+            components: [{
+                id: 'foo'
+            }]
+        };
+
+        OpenLayers.Renderer.Elements.prototype.eraseGeometry(geometry);
+        t.ok(el.parentNode != document.body, "geometry components correctly removed when passed a multipoint");
+        
+        var el = document.createElement('div');
+        document.body.appendChild(el);
+        el.id = 'foo';
+        var geometry = {
+            CLASS_NAME: "OpenLayers.Geometry.MultiLineString",
+            components: [{
+                id: 'foo'
+            }]
+        };
+        
+        OpenLayers.Renderer.Elements.prototype.eraseGeometry(geometry);
+        t.ok(el.parentNode != document.body, "geometry components correctly removed when passed a multilinestring");
+        
+        var el = document.createElement('div');
+        document.body.appendChild(el);
+        el.id = 'foo';
+        var geometry = {
+            CLASS_NAME: "OpenLayers.Geometry.MultiPolygon",
+            components: [{
+                id: 'foo'
+            }]
+        };
+        
+        OpenLayers.Renderer.Elements.prototype.eraseGeometry(geometry);
+        t.ok(el.parentNode != document.body, "geometry components correctly removed when passed a multipolygon");
+    }    
+
+  </script>
+</head>
+<body>
+<div id="map" style="width:500px;height:550px"></div>
+</body>
+</html>
+<html>
+<head>
+<script src="../../lib/OpenLayers.js"></script>
+  <script type="text/javascript">
+
+    function test_Elements_constructor(t) {
+        t.plan(5);
+        var el = document.body;
+        el.id = "foo";
+        
+        OpenLayers.Renderer.Elements.prototype._createRenderRoot =
+            OpenLayers.Renderer.Elements.prototype.createRenderRoot;
+        
+        var rendererRoot = document.createElement("div");
+        OpenLayers.Renderer.Elements.prototype.createRenderRoot = function() {
+            return rendererRoot;
+        }
+        
+        OpenLayers.Renderer.Elements.prototype._createRoot =
+            OpenLayers.Renderer.Elements.prototype.createRoot;
+        
+        var root = document.createElement("div");
+        OpenLayers.Renderer.Elements.prototype.createRoot = function() {
+            return root;
+        }
+        
+        var r = new OpenLayers.Renderer.Elements("foo");
+        
+        t.ok(r instanceof OpenLayers.Renderer.Elements, "new OpenLayers.Renderer.Elements returns Elements object" );
+        t.ok(r.rendererRoot != null, "elements rendererRoot is not null");
+        t.ok(r.root != null, "elements root is not null");
+        
+        t.ok(r.root.parentNode == rendererRoot, "elements root is correctly appended to rendererRoot");
+        t.ok(r.rendererRoot.parentNode == document.body, "elements rendererRoot is correctly appended to container");
+        
+        OpenLayers.Renderer.Elements.prototype.createRenderRoot =
+            OpenLayers.Renderer.Elements.prototype._createRenderRoot;
+        OpenLayers.Renderer.Elements.prototype.createRoot =
+            OpenLayers.Renderer.Elements.prototype._createRoot;
+    }
+    
+    function test_Elements_destroy(t) {
+        t.plan(5);
+        
+        OpenLayers.Renderer.Elements.prototype._initialize =
+            OpenLayers.Renderer.Elements.prototype.initialize;
+        
+        OpenLayers.Renderer.Elements.prototype.initialize = function() {}
+        
+        var g_Clear = false, g_Destroy = false;
+        
+        OpenLayers.Renderer.prototype._destroy = 
+            OpenLayers.Renderer.prototype.destroy;
+            
+        OpenLayers.Renderer.prototype.destroy = function() {
+            g_Destroy = true;
+        }
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.clear = function() {
+            g_Clear = true;
+        }
+        r.rendererRoot = 'foo';
+        r.root = 'bar';
+        r.xmlns = 'dude';
+        
+        r.destroy();
+        
+        t.eq(g_Clear, true, "OpenLayers.Renderer.Elements.clear() called");
+        t.eq(r.rendererRoot, null, "rendererRoot nullified");
+        t.eq(r.root, null, "root nullified");
+        t.eq(r.xmlns, null, "xmlns nullified");
+        t.eq(g_Destroy, true, "OpenLayers.Renderer.destroy() called");
+        
+        OpenLayers.Renderer.Elements.prototype.initialize =
+            OpenLayers.Renderer.Elements.prototype._initialize;
+        OpenLayers.Renderer.prototype.destroy = 
+            OpenLayers.Renderer.prototype._destroy;
+    }
+    
+    function test_Elements_clear(t) {
+        t.plan(1);
+        
+        OpenLayers.Renderer.Elements.prototype._initialize =
+            OpenLayers.Renderer.Elements.prototype.initialize;
+        
+        OpenLayers.Renderer.Elements.prototype.initialize = function() {}
+        
+        var r = new OpenLayers.Renderer.Elements();
+        var element = document.createElement("div");
+        r.root = element;
+        
+        var node = document.createElement("div");
+        element.appendChild(node);
+        
+        r.clear();
+        
+        t.ok(r.root.childNodes.length == 0, "root is correctly cleared");
+        
+        OpenLayers.Renderer.Elements.prototype.initialize =
+            OpenLayers.Renderer.Elements.prototype._initialize;
+    }
+    
+    function test_Elements_drawGeometry(t) {
+        t.plan(4);
+        
+        OpenLayers.Renderer.Elements.prototype._initialize =
+            OpenLayers.Renderer.Elements.prototype.initialize;
+        
+        OpenLayers.Renderer.Elements.prototype.initialize = function() {};
+        
+        var r = new OpenLayers.Renderer.Elements();
+        
+        var element = document.createElement("div");
+        r.root = element;
+
+        r.nodeFactory = function(gid, nt, g) {
+            var element = document.createElement("div");
+            return element;
+        }
+        var g_Node = null;
+        r.drawGeometryNode = function(n, g) {
+            g_Node = n;
+            return;
+        }
+        r.getNodeType = function(geometry) {
+            return "div";
+        }
+        geometry = {
+            id: 'foo',
+            CLASS_NAME: 'bar'
+        };
+        var style = true;
+        var featureId = 'dude';
+        r.drawGeometry(geometry, style, featureId);
+        t.ok(g_Node.parentNode == r.root, "node is correctly appended to root");
+        t.eq(g_Node._featureId, 'dude', "_featureId is correct");
+        t.ok(g_Node._style, "_style is correct");
+        t.eq(g_Node._geometryClass, 'bar', "_geometryClass is correct");
+        
+        OpenLayers.Renderer.Elements.prototype.initialize =
+            OpenLayers.Renderer.Elements.prototype._initialize;
+    }
+
+    function test_Elements_drawGeometry_2(t) {
+        t.plan(9);
+        
+        OpenLayers.Renderer.Elements.prototype._initialize =
+            OpenLayers.Renderer.Elements.prototype.initialize;
+            
+        OpenLayers.Renderer.Elements.prototype.initialize = function() {};
+
+        var r = new OpenLayers.Renderer.Elements();
+        
+        var element = document.createElement("div");
+        r.root = element;
+        
+        r.nodeFactory = function(gid, nt, g) {
+            var element = document.createElement("div");
+            return element;
+        }
+        r.setStyle = function() {};
+        
+        // point
+        var properDraw = false;
+        r.drawPoint = function(node, geometry) {
+            properDraw = true;
+            node = node;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.Point'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawPoint when passed a point");
+
+        // line string
+        var properDraw = false;
+        r.drawLineString = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.LineString'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawLineString when passed a line string");
+
+        // linear ring
+        var properDraw = false;
+        r.drawLinearRing = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.LinearRing'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawLinearRing when passed a linear ring");
+
+        // polygon
+        var properDraw = false;
+        r.drawPolygon = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.Polygon'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawPolygon when passed a polygon");
+
+        // surface
+        var properDraw = false;
+        r.drawSurface = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.Surface'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawSurface when passed a surface");
+
+        // rectangle
+        var properDraw = false;
+        r.drawRectangle = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {CLASS_NAME: 'OpenLayers.Geometry.Rectangle'};
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawRectangle when passed a rectangle");
+
+        // multi-point
+        var properDraw = false;
+        r.drawPoint = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {
+            CLASS_NAME: 'OpenLayers.Geometry.MultiPoint',
+            components: [{CLASS_NAME: 'OpenLayers.Geometry.Point'}]
+        };
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawPoint when passed a multi-point");
+
+        // multi-linestring
+        var properDraw = false;
+        r.drawLineString = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {
+            CLASS_NAME: 'OpenLayers.Geometry.MultiLineString',
+            components: [{CLASS_NAME: 'OpenLayers.Geometry.LineString'}]
+        };
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawLineString when passed a multi-linestring");
+
+        // multi-polygon
+        var properDraw = false;
+        r.drawPolygon = function(g) {
+            properDraw = true;
+            return {};
+        }
+        geometry = {
+            CLASS_NAME: 'OpenLayers.Geometry.MultiPolygon',
+            components: [{CLASS_NAME: 'OpenLayers.Geometry.Polygon'}]
+        };
+        style = true;
+        r.drawGeometry(geometry, style);
+        t.ok(properDraw, "drawGeometry called drawPolygon when passed a multi-polygon");
+        
+        OpenLayers.Renderer.Elements.prototype.initialize =
+            OpenLayers.Renderer.Elements.prototype._initialize;
+    }
+    
+    function test_Elements_getfeatureidfromevent(t) {
+        t.plan(2);
+        
+        var node = {
+            _featureId: 'foo'
+        }
+        var event = {
+            target: node
+        }
+        
+        var id = OpenLayers.Renderer.Elements.prototype.getFeatureIdFromEvent(event);
+        t.eq(id, 'foo', "returned id is correct when event with target is passed");
+        
+        var event = {
+            srcElement: node
+        }
+        
+        var id = OpenLayers.Renderer.Elements.prototype.getFeatureIdFromEvent(event);
+        t.eq(id, 'foo', "returned id is correct when event with srcElement is passed");
+    }
+    
+    function test_Elements_erasegeometry(t) {
+        t.plan(4);
+        
+        var el = document.createElement('div');
+        document.body.appendChild(el);
+        el.id = 'foo';
+        var geometry = {
+            id: 'foo'
+        };
+        
+        OpenLayers.Renderer.Elements.prototype.eraseGeometry(geometry);
+        t.ok(el.parentNode != document.body, "element correctly removed");
+
+
+        var el = document.createElement('div');
+        document.body.appendChild(el);
+        el.id = 'foo';
+        var geometry = {
+            CLASS_NAME: "OpenLayers.Geometry.MultiPoint",
+            components: [{
+                id: 'foo'
+            }]
+        };
+
+        OpenLayers.Renderer.Elements.prototype.eraseGeometry(geometry);
+        t.ok(el.parentNode != document.body, "geometry components correctly removed when passed a multipoint");
+        
+        var el = document.createElement('div');
+        document.body.appendChild(el);
+        el.id = 'foo';
+        var geometry = {
+            CLASS_NAME: "OpenLayers.Geometry.MultiLineString",
+            components: [{
+                id: 'foo'
+            }]
+        };
+        
+        OpenLayers.Renderer.Elements.prototype.eraseGeometry(geometry);
+        t.ok(el.parentNode != document.body, "geometry components correctly removed when passed a multilinestring");
+        
+        var el = document.createElement('div');
+        document.body.appendChild(el);
+        el.id = 'foo';
+        var geometry = {
+            CLASS_NAME: "OpenLayers.Geometry.MultiPolygon",
+            components: [{
+                id: 'foo'
+            }]
+        };
+        
+        OpenLayers.Renderer.Elements.prototype.eraseGeometry(geometry);
+        t.ok(el.parentNode != document.body, "geometry components correctly removed when passed a multipolygon");
+    }    
+
+  </script>
+</head>
+<body>
+<div id="map" style="width:500px;height:550px"></div>
+</body>
+</html>
diff --git a/tests/Renderer/test_SVG.html b/tests/Renderer/test_SVG.html
new file mode 100644
index 0000000000..a5968674e8
--- /dev/null
+++ b/tests/Renderer/test_SVG.html
@@ -0,0 +1,1472 @@
+<html>
+<head>
+<script src="../../lib/OpenLayers.js"></script>
+  <script type="text/javascript">
+
+    var geometry = null, node = null;
+    
+    function test_SVG_constructor(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        t.ok(r instanceof OpenLayers.Renderer.SVG, "new OpenLayers.Renderer.SVG returns SVG object" );
+    }
+    
+    function test_SVG_destroy(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var g_Destroy = false;
+        
+        OpenLayers.Renderer.Elements.prototype._destroy = 
+            OpenLayers.Renderer.Elements.prototype.destroy;
+            
+        OpenLayers.Renderer.prototype.destroy = function() {
+            g_Destroy = true;
+        }
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.destroy();
+        
+        t.eq(g_Destroy, true, "OpenLayers.Renderer.Elements.destroy() called");
+        
+        OpenLayers.Renderer.prototype.destroy = 
+            OpenLayers.Renderer.prototype._destroy;
+    }
+    
+    function test_SVG_setextent(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(5);
+        
+        OpenLayers.Renderer.Elements.prototype._setExtent =
+            OpenLayers.Renderer.Elements.prototype.setExtent;
+        
+        var g_SetExtent = false;
+        OpenLayers.Renderer.Elements.prototype.setExtent = function() {
+            g_SetExtent = true;
+        }
+                
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.map = {
+            getResolution: function() {
+                return 0.5;
+            }
+        }
+        
+        var extent = new OpenLayers.Bounds(1,2,3,4);
+        r.setExtent(extent);
+        
+        t.eq(g_SetExtent, true, "Elements.setExtent() called");
+        
+        t.eq(r.left, -2, "left is correct");
+        t.eq(r.top, 8, "top is correct");
+        
+        t.eq(r.rendererRoot.getAttributeNS(null, "viewBox"), "0 0 4 4", "rendererRoot viewBox is correct");
+        
+        // test extent changes
+        var extent = new OpenLayers.Bounds(4,3,2,1);
+        r.setExtent(extent);
+        t.eq(r.rendererRoot.getAttributeNS(null, "viewBox"), "6 6 -4 -4", "rendererRoot viewBox is correct after a new setExtent");
+
+        OpenLayers.Renderer.Elements.prototype.setExtent =
+            OpenLayers.Renderer.Elements.prototype._setExtent;
+    }
+    
+    function test_SVG_setsize(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(2);
+                
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var size = new OpenLayers.Size(1,2);
+        r.setSize(size);
+        t.eq(r.rendererRoot.getAttributeNS(null, "width"), size.w.toString(), "width is correct");
+        t.eq(r.rendererRoot.getAttributeNS(null, "height"), size.h.toString(), "height is correct");
+    }
+    
+    function test_SVG_drawpoint(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+    
+        t.plan(1);
+
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var properDraw = false;
+        var g_Radius = null;
+        r.drawCircle = function(n, g, r) {
+            properDraw = true;
+            g_Radius = 1;
+        }
+        r.drawPoint();
+        
+        t.ok(properDraw && g_Radius == 1, "drawPoint called drawCircle with radius set to 1");
+    }
+    
+    function test_SVG_drawcircle(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(3);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.resolution = 0.5;
+        r.left = 0;
+        r.top = 0;
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            x: 1,
+            y: 2
+        }
+        
+        r.drawCircle(node, geometry, 3);
+        
+        t.eq(node.getAttributeNS(null, 'cx'), '2', "cx is correct");
+        t.eq(node.getAttributeNS(null, 'cy'), '4', "cy is correct");
+        t.eq(node.getAttributeNS(null, 'r'), '3', "r is correct");
+    }
+    
+    function test_SVG_drawlinestring(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(2);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            components: "foo"
+        }
+        g_GetString = false;
+        g_Components = null;
+        r.getComponentsString = function(c) {
+            g_GetString = true;
+            g_Components = c;
+            return "bar";
+        }
+        
+        r.drawLineString(node, geometry);
+        
+        t.ok(g_GetString && g_Components == "foo", "getComponentString is called with valid arguments");
+        t.eq(node.getAttributeNS(null, "points"), "bar", "points attribute is correct");
+    }
+    
+    function test_SVG_drawlinearring(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(2);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            components: "foo"
+        }
+        g_GetString = false;
+        g_Components = null;
+        r.getComponentsString = function(c) {
+            g_GetString = true;
+            g_Components = c;
+            return "bar";
+        }
+        
+        r.drawLinearRing(node, geometry);
+        
+        t.ok(g_GetString, "getComponentString is called with valid arguments");
+        t.eq(node.getAttributeNS(null, "points"), "bar", "points attribute is correct");
+    }
+
+    function test_SVG_drawpolygon(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(4);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var node = document.createElement('div');
+        
+        var linearRings = [{
+            components: ["foo"]
+        },{
+            components: ["bar"]
+        }]
+        
+        var geometry = {
+            components: linearRings
+        }
+        g_GetString = false;
+        r.getShortString = function(c) {
+            g_GetString = true;
+            return c;
+        }
+        
+        r.drawPolygon(node, geometry);
+        
+        t.ok(g_GetString, "getShortString is called");
+        t.eq(node.getAttributeNS(null, "d"), " M foo M bar z", "d attribute is correctly set");
+        t.eq(node.getAttributeNS(null, "fill-rule"), "evenodd", "fill-rule attribute is correctly set");
+        
+        r.getShortString = function(c) {
+            return false;
+        }
+        r.drawPolygon(node, geometry);
+        t.eq(node.getAttributeNS(null, "d"), "", "d attribute is empty if one linearRing cannot be drawn");
+    }
+
+    function test_SVG_drawrectangle(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(4);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.resolution = 0.5;
+        r.left = 0;
+        r.top = 0;
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            x: 1,
+            y: 2,
+            width: 3,
+            height: 4
+        }
+        
+        r.drawRectangle(node, geometry);
+        
+        t.eq(node.getAttributeNS(null, "x"), "2", "x attribute is correctly set");
+        t.eq(node.getAttributeNS(null, "y"), "4", "y attribute is correctly set");
+        t.eq(node.getAttributeNS(null, "width"), "6", "width attribute is correctly set");
+        t.eq(node.getAttributeNS(null, "height"), "8", "height attribute is correctly set");
+    }
+    
+    function test_SVG_drawsurface(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(3);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            components: ['foo', 'bar', 'dude']
+        }
+        g_GetString = false;
+        r.getShortString = function(c) {
+            g_GetString = true;
+            return c;
+        }
+        
+        r.drawSurface(node, geometry);
+        
+        t.ok(g_GetString, "getShortString is called");
+        
+        t.eq(node.getAttributeNS(null, "d"), "M foo C bar dude Z", "d attribute is correctly set");
+        
+        r.getShortString = function(c) {
+            return false;
+        }
+        r.drawSurface(node, geometry);
+        t.eq(node.getAttributeNS(null, "d"), "", "d attribute is empty if one linearRing cannot be drawn");
+    }
+    
+    function test_SVG_getcomponentsstring(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var components = ['foo', 'bar'];
+        
+        OpenLayers.Renderer.SVG.prototype._getShortString = 
+            OpenLayers.Renderer.SVG.prototype.getShortString;
+            
+        OpenLayers.Renderer.SVG.prototype.getShortString = function(p) {
+            return p;
+        };
+        
+        var string = OpenLayers.Renderer.SVG.prototype.getComponentsString(components);
+        t.eq(string, "foo,bar", "returned string is correct");
+        
+        OpenLayers.Renderer.SVG.prototype.getShortString = 
+            OpenLayers.Renderer.SVG.prototype._getShortString;
+    }
+    
+    
+    
+    function test_SVG_getshortstring(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.resolution = 0.5;
+        r.left = 0;
+        r.top = 0;
+        
+        var point = {
+            x: 1,
+            y: 2
+        };
+        
+        var string = r.getShortString(point);
+        t.eq(string, "2,4", "returned string is correct");
+    }
+    
+    
+
+  </script>
+</head>
+<body>
+<div id="map" style="width:500px;height:550px"></div>
+</body>
+</html>
+<html>
+<head>
+<script src="../../lib/OpenLayers.js"></script>
+  <script type="text/javascript">
+
+    var geometry = null, node = null;
+    
+    function test_SVG_constructor(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        t.ok(r instanceof OpenLayers.Renderer.SVG, "new OpenLayers.Renderer.SVG returns SVG object" );
+    }
+    
+    function test_SVG_destroy(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var g_Destroy = false;
+        
+        OpenLayers.Renderer.Elements.prototype._destroy = 
+            OpenLayers.Renderer.Elements.prototype.destroy;
+            
+        OpenLayers.Renderer.prototype.destroy = function() {
+            g_Destroy = true;
+        }
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.destroy();
+        
+        t.eq(g_Destroy, true, "OpenLayers.Renderer.Elements.destroy() called");
+        
+        OpenLayers.Renderer.prototype.destroy = 
+            OpenLayers.Renderer.prototype._destroy;
+    }
+    
+    function test_SVG_setextent(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(5);
+        
+        OpenLayers.Renderer.Elements.prototype._setExtent =
+            OpenLayers.Renderer.Elements.prototype.setExtent;
+        
+        var g_SetExtent = false;
+        OpenLayers.Renderer.Elements.prototype.setExtent = function() {
+            g_SetExtent = true;
+        }
+                
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.map = {
+            getResolution: function() {
+                return 0.5;
+            }
+        }
+        
+        var extent = new OpenLayers.Bounds(1,2,3,4);
+        r.setExtent(extent);
+        
+        t.eq(g_SetExtent, true, "Elements.setExtent() called");
+        
+        t.eq(r.left, -2, "left is correct");
+        t.eq(r.top, 8, "top is correct");
+        
+        t.eq(r.rendererRoot.getAttributeNS(null, "viewBox"), "0 0 4 4", "rendererRoot viewBox is correct");
+        
+        // test extent changes
+        var extent = new OpenLayers.Bounds(4,3,2,1);
+        r.setExtent(extent);
+        t.eq(r.rendererRoot.getAttributeNS(null, "viewBox"), "6 6 -4 -4", "rendererRoot viewBox is correct after a new setExtent");
+
+        OpenLayers.Renderer.Elements.prototype.setExtent =
+            OpenLayers.Renderer.Elements.prototype._setExtent;
+    }
+    
+    function test_SVG_setsize(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(2);
+                
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var size = new OpenLayers.Size(1,2);
+        r.setSize(size);
+        t.eq(r.rendererRoot.getAttributeNS(null, "width"), size.w.toString(), "width is correct");
+        t.eq(r.rendererRoot.getAttributeNS(null, "height"), size.h.toString(), "height is correct");
+    }
+    
+    function test_SVG_drawpoint(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+    
+        t.plan(1);
+
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var properDraw = false;
+        var g_Radius = null;
+        r.drawCircle = function(n, g, r) {
+            properDraw = true;
+            g_Radius = 1;
+        }
+        r.drawPoint();
+        
+        t.ok(properDraw && g_Radius == 1, "drawPoint called drawCircle with radius set to 1");
+    }
+    
+    function test_SVG_drawcircle(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(3);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.resolution = 0.5;
+        r.left = 0;
+        r.top = 0;
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            x: 1,
+            y: 2
+        }
+        
+        r.drawCircle(node, geometry, 3);
+        
+        t.eq(node.getAttributeNS(null, 'cx'), '2', "cx is correct");
+        t.eq(node.getAttributeNS(null, 'cy'), '4', "cy is correct");
+        t.eq(node.getAttributeNS(null, 'r'), '3', "r is correct");
+    }
+    
+    function test_SVG_drawlinestring(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(2);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            components: "foo"
+        }
+        g_GetString = false;
+        g_Components = null;
+        r.getComponentsString = function(c) {
+            g_GetString = true;
+            g_Components = c;
+            return "bar";
+        }
+        
+        r.drawLineString(node, geometry);
+        
+        t.ok(g_GetString && g_Components == "foo", "getComponentString is called with valid arguments");
+        t.eq(node.getAttributeNS(null, "points"), "bar", "points attribute is correct");
+    }
+    
+    function test_SVG_drawlinearring(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(2);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            components: "foo"
+        }
+        g_GetString = false;
+        g_Components = null;
+        r.getComponentsString = function(c) {
+            g_GetString = true;
+            g_Components = c;
+            return "bar";
+        }
+        
+        r.drawLinearRing(node, geometry);
+        
+        t.ok(g_GetString, "getComponentString is called with valid arguments");
+        t.eq(node.getAttributeNS(null, "points"), "bar", "points attribute is correct");
+    }
+
+    function test_SVG_drawpolygon(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(4);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var node = document.createElement('div');
+        
+        var linearRings = [{
+            components: ["foo"]
+        },{
+            components: ["bar"]
+        }]
+        
+        var geometry = {
+            components: linearRings
+        }
+        g_GetString = false;
+        r.getShortString = function(c) {
+            g_GetString = true;
+            return c;
+        }
+        
+        r.drawPolygon(node, geometry);
+        
+        t.ok(g_GetString, "getShortString is called");
+        t.eq(node.getAttributeNS(null, "d"), " M foo M bar z", "d attribute is correctly set");
+        t.eq(node.getAttributeNS(null, "fill-rule"), "evenodd", "fill-rule attribute is correctly set");
+        
+        r.getShortString = function(c) {
+            return false;
+        }
+        r.drawPolygon(node, geometry);
+        t.eq(node.getAttributeNS(null, "d"), "", "d attribute is empty if one linearRing cannot be drawn");
+    }
+
+    function test_SVG_drawrectangle(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(4);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.resolution = 0.5;
+        r.left = 0;
+        r.top = 0;
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            x: 1,
+            y: 2,
+            width: 3,
+            height: 4
+        }
+        
+        r.drawRectangle(node, geometry);
+        
+        t.eq(node.getAttributeNS(null, "x"), "2", "x attribute is correctly set");
+        t.eq(node.getAttributeNS(null, "y"), "4", "y attribute is correctly set");
+        t.eq(node.getAttributeNS(null, "width"), "6", "width attribute is correctly set");
+        t.eq(node.getAttributeNS(null, "height"), "8", "height attribute is correctly set");
+    }
+    
+    function test_SVG_drawsurface(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(3);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            components: ['foo', 'bar', 'dude']
+        }
+        g_GetString = false;
+        r.getShortString = function(c) {
+            g_GetString = true;
+            return c;
+        }
+        
+        r.drawSurface(node, geometry);
+        
+        t.ok(g_GetString, "getShortString is called");
+        
+        t.eq(node.getAttributeNS(null, "d"), "M foo C bar dude Z", "d attribute is correctly set");
+        
+        r.getShortString = function(c) {
+            return false;
+        }
+        r.drawSurface(node, geometry);
+        t.eq(node.getAttributeNS(null, "d"), "", "d attribute is empty if one linearRing cannot be drawn");
+    }
+    
+    function test_SVG_getcomponentsstring(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var components = ['foo', 'bar'];
+        
+        OpenLayers.Renderer.SVG.prototype._getShortString = 
+            OpenLayers.Renderer.SVG.prototype.getShortString;
+            
+        OpenLayers.Renderer.SVG.prototype.getShortString = function(p) {
+            return p;
+        };
+        
+        var string = OpenLayers.Renderer.SVG.prototype.getComponentsString(components);
+        t.eq(string, "foo,bar", "returned string is correct");
+        
+        OpenLayers.Renderer.SVG.prototype.getShortString = 
+            OpenLayers.Renderer.SVG.prototype._getShortString;
+    }
+    
+    
+    
+    function test_SVG_getshortstring(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.resolution = 0.5;
+        r.left = 0;
+        r.top = 0;
+        
+        var point = {
+            x: 1,
+            y: 2
+        };
+        
+        var string = r.getShortString(point);
+        t.eq(string, "2,4", "returned string is correct");
+    }
+    
+    
+
+  </script>
+</head>
+<body>
+<div id="map" style="width:500px;height:550px"></div>
+</body>
+</html>
+<html>
+<head>
+<script src="../../lib/OpenLayers.js"></script>
+  <script type="text/javascript">
+
+    var geometry = null, node = null;
+    
+    function test_SVG_constructor(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        t.ok(r instanceof OpenLayers.Renderer.SVG, "new OpenLayers.Renderer.SVG returns SVG object" );
+    }
+    
+    function test_SVG_destroy(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var g_Destroy = false;
+        
+        OpenLayers.Renderer.Elements.prototype._destroy = 
+            OpenLayers.Renderer.Elements.prototype.destroy;
+            
+        OpenLayers.Renderer.prototype.destroy = function() {
+            g_Destroy = true;
+        }
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.destroy();
+        
+        t.eq(g_Destroy, true, "OpenLayers.Renderer.Elements.destroy() called");
+        
+        OpenLayers.Renderer.prototype.destroy = 
+            OpenLayers.Renderer.prototype._destroy;
+    }
+    
+    function test_SVG_setextent(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(5);
+        
+        OpenLayers.Renderer.Elements.prototype._setExtent =
+            OpenLayers.Renderer.Elements.prototype.setExtent;
+        
+        var g_SetExtent = false;
+        OpenLayers.Renderer.Elements.prototype.setExtent = function() {
+            g_SetExtent = true;
+        }
+                
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.map = {
+            getResolution: function() {
+                return 0.5;
+            }
+        }
+        
+        var extent = new OpenLayers.Bounds(1,2,3,4);
+        r.setExtent(extent);
+        
+        t.eq(g_SetExtent, true, "Elements.setExtent() called");
+        
+        t.eq(r.left, -2, "left is correct");
+        t.eq(r.top, 8, "top is correct");
+        
+        t.eq(r.rendererRoot.getAttributeNS(null, "viewBox"), "0 0 4 4", "rendererRoot viewBox is correct");
+        
+        // test extent changes
+        var extent = new OpenLayers.Bounds(4,3,2,1);
+        r.setExtent(extent);
+        t.eq(r.rendererRoot.getAttributeNS(null, "viewBox"), "6 6 -4 -4", "rendererRoot viewBox is correct after a new setExtent");
+
+        OpenLayers.Renderer.Elements.prototype.setExtent =
+            OpenLayers.Renderer.Elements.prototype._setExtent;
+    }
+    
+    function test_SVG_setsize(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(2);
+                
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var size = new OpenLayers.Size(1,2);
+        r.setSize(size);
+        t.eq(r.rendererRoot.getAttributeNS(null, "width"), size.w.toString(), "width is correct");
+        t.eq(r.rendererRoot.getAttributeNS(null, "height"), size.h.toString(), "height is correct");
+    }
+    
+    function test_SVG_drawpoint(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+    
+        t.plan(1);
+
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var properDraw = false;
+        var g_Radius = null;
+        r.drawCircle = function(n, g, r) {
+            properDraw = true;
+            g_Radius = 1;
+        }
+        r.drawPoint();
+        
+        t.ok(properDraw && g_Radius == 1, "drawPoint called drawCircle with radius set to 1");
+    }
+    
+    function test_SVG_drawcircle(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(3);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.resolution = 0.5;
+        r.left = 0;
+        r.top = 0;
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            x: 1,
+            y: 2
+        }
+        
+        r.drawCircle(node, geometry, 3);
+        
+        t.eq(node.getAttributeNS(null, 'cx'), '2', "cx is correct");
+        t.eq(node.getAttributeNS(null, 'cy'), '4', "cy is correct");
+        t.eq(node.getAttributeNS(null, 'r'), '3', "r is correct");
+    }
+    
+    function test_SVG_drawlinestring(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(2);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            components: "foo"
+        }
+        g_GetString = false;
+        g_Components = null;
+        r.getComponentsString = function(c) {
+            g_GetString = true;
+            g_Components = c;
+            return "bar";
+        }
+        
+        r.drawLineString(node, geometry);
+        
+        t.ok(g_GetString && g_Components == "foo", "getComponentString is called with valid arguments");
+        t.eq(node.getAttributeNS(null, "points"), "bar", "points attribute is correct");
+    }
+    
+    function test_SVG_drawlinearring(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(2);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            components: "foo"
+        }
+        g_GetString = false;
+        g_Components = null;
+        r.getComponentsString = function(c) {
+            g_GetString = true;
+            g_Components = c;
+            return "bar";
+        }
+        
+        r.drawLinearRing(node, geometry);
+        
+        t.ok(g_GetString, "getComponentString is called with valid arguments");
+        t.eq(node.getAttributeNS(null, "points"), "bar", "points attribute is correct");
+    }
+
+    function test_SVG_drawpolygon(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(4);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var node = document.createElement('div');
+        
+        var linearRings = [{
+            components: ["foo"]
+        },{
+            components: ["bar"]
+        }]
+        
+        var geometry = {
+            components: linearRings
+        }
+        g_GetString = false;
+        r.getShortString = function(c) {
+            g_GetString = true;
+            return c;
+        }
+        
+        r.drawPolygon(node, geometry);
+        
+        t.ok(g_GetString, "getShortString is called");
+        t.eq(node.getAttributeNS(null, "d"), " M foo M bar z", "d attribute is correctly set");
+        t.eq(node.getAttributeNS(null, "fill-rule"), "evenodd", "fill-rule attribute is correctly set");
+        
+        r.getShortString = function(c) {
+            return false;
+        }
+        r.drawPolygon(node, geometry);
+        t.eq(node.getAttributeNS(null, "d"), "", "d attribute is empty if one linearRing cannot be drawn");
+    }
+
+    function test_SVG_drawrectangle(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(4);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.resolution = 0.5;
+        r.left = 0;
+        r.top = 0;
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            x: 1,
+            y: 2,
+            width: 3,
+            height: 4
+        }
+        
+        r.drawRectangle(node, geometry);
+        
+        t.eq(node.getAttributeNS(null, "x"), "2", "x attribute is correctly set");
+        t.eq(node.getAttributeNS(null, "y"), "4", "y attribute is correctly set");
+        t.eq(node.getAttributeNS(null, "width"), "6", "width attribute is correctly set");
+        t.eq(node.getAttributeNS(null, "height"), "8", "height attribute is correctly set");
+    }
+    
+    function test_SVG_drawsurface(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(3);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            components: ['foo', 'bar', 'dude']
+        }
+        g_GetString = false;
+        r.getShortString = function(c) {
+            g_GetString = true;
+            return c;
+        }
+        
+        r.drawSurface(node, geometry);
+        
+        t.ok(g_GetString, "getShortString is called");
+        
+        t.eq(node.getAttributeNS(null, "d"), "M foo C bar dude Z", "d attribute is correctly set");
+        
+        r.getShortString = function(c) {
+            return false;
+        }
+        r.drawSurface(node, geometry);
+        t.eq(node.getAttributeNS(null, "d"), "", "d attribute is empty if one linearRing cannot be drawn");
+    }
+    
+    function test_SVG_getcomponentsstring(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var components = ['foo', 'bar'];
+        
+        OpenLayers.Renderer.SVG.prototype._getShortString = 
+            OpenLayers.Renderer.SVG.prototype.getShortString;
+            
+        OpenLayers.Renderer.SVG.prototype.getShortString = function(p) {
+            return p;
+        };
+        
+        var string = OpenLayers.Renderer.SVG.prototype.getComponentsString(components);
+        t.eq(string, "foo,bar", "returned string is correct");
+        
+        OpenLayers.Renderer.SVG.prototype.getShortString = 
+            OpenLayers.Renderer.SVG.prototype._getShortString;
+    }
+    
+    
+    
+    function test_SVG_getshortstring(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.resolution = 0.5;
+        r.left = 0;
+        r.top = 0;
+        
+        var point = {
+            x: 1,
+            y: 2
+        };
+        
+        var string = r.getShortString(point);
+        t.eq(string, "2,4", "returned string is correct");
+    }
+    
+    
+
+  </script>
+</head>
+<body>
+<div id="map" style="width:500px;height:550px"></div>
+</body>
+</html>
+<html>
+<head>
+<script src="../../lib/OpenLayers.js"></script>
+  <script type="text/javascript">
+
+    var geometry = null, node = null;
+    
+    function test_SVG_constructor(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        t.ok(r instanceof OpenLayers.Renderer.SVG, "new OpenLayers.Renderer.SVG returns SVG object" );
+    }
+    
+    function test_SVG_destroy(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var g_Destroy = false;
+        
+        OpenLayers.Renderer.Elements.prototype._destroy = 
+            OpenLayers.Renderer.Elements.prototype.destroy;
+            
+        OpenLayers.Renderer.prototype.destroy = function() {
+            g_Destroy = true;
+        }
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.destroy();
+        
+        t.eq(g_Destroy, true, "OpenLayers.Renderer.Elements.destroy() called");
+        
+        OpenLayers.Renderer.prototype.destroy = 
+            OpenLayers.Renderer.prototype._destroy;
+    }
+    
+    function test_SVG_setextent(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(5);
+        
+        OpenLayers.Renderer.Elements.prototype._setExtent =
+            OpenLayers.Renderer.Elements.prototype.setExtent;
+        
+        var g_SetExtent = false;
+        OpenLayers.Renderer.Elements.prototype.setExtent = function() {
+            g_SetExtent = true;
+        }
+                
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.map = {
+            getResolution: function() {
+                return 0.5;
+            }
+        }
+        
+        var extent = new OpenLayers.Bounds(1,2,3,4);
+        r.setExtent(extent);
+        
+        t.eq(g_SetExtent, true, "Elements.setExtent() called");
+        
+        t.eq(r.left, -2, "left is correct");
+        t.eq(r.top, 8, "top is correct");
+        
+        t.eq(r.rendererRoot.getAttributeNS(null, "viewBox"), "0 0 4 4", "rendererRoot viewBox is correct");
+        
+        // test extent changes
+        var extent = new OpenLayers.Bounds(4,3,2,1);
+        r.setExtent(extent);
+        t.eq(r.rendererRoot.getAttributeNS(null, "viewBox"), "6 6 -4 -4", "rendererRoot viewBox is correct after a new setExtent");
+
+        OpenLayers.Renderer.Elements.prototype.setExtent =
+            OpenLayers.Renderer.Elements.prototype._setExtent;
+    }
+    
+    function test_SVG_setsize(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(2);
+                
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var size = new OpenLayers.Size(1,2);
+        r.setSize(size);
+        t.eq(r.rendererRoot.getAttributeNS(null, "width"), size.w.toString(), "width is correct");
+        t.eq(r.rendererRoot.getAttributeNS(null, "height"), size.h.toString(), "height is correct");
+    }
+    
+    function test_SVG_drawpoint(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+    
+        t.plan(1);
+
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var properDraw = false;
+        var g_Radius = null;
+        r.drawCircle = function(n, g, r) {
+            properDraw = true;
+            g_Radius = 1;
+        }
+        r.drawPoint();
+        
+        t.ok(properDraw && g_Radius == 1, "drawPoint called drawCircle with radius set to 1");
+    }
+    
+    function test_SVG_drawcircle(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(3);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.resolution = 0.5;
+        r.left = 0;
+        r.top = 0;
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            x: 1,
+            y: 2
+        }
+        
+        r.drawCircle(node, geometry, 3);
+        
+        t.eq(node.getAttributeNS(null, 'cx'), '2', "cx is correct");
+        t.eq(node.getAttributeNS(null, 'cy'), '4', "cy is correct");
+        t.eq(node.getAttributeNS(null, 'r'), '3', "r is correct");
+    }
+    
+    function test_SVG_drawlinestring(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(2);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            components: "foo"
+        }
+        g_GetString = false;
+        g_Components = null;
+        r.getComponentsString = function(c) {
+            g_GetString = true;
+            g_Components = c;
+            return "bar";
+        }
+        
+        r.drawLineString(node, geometry);
+        
+        t.ok(g_GetString && g_Components == "foo", "getComponentString is called with valid arguments");
+        t.eq(node.getAttributeNS(null, "points"), "bar", "points attribute is correct");
+    }
+    
+    function test_SVG_drawlinearring(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(2);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            components: "foo"
+        }
+        g_GetString = false;
+        g_Components = null;
+        r.getComponentsString = function(c) {
+            g_GetString = true;
+            g_Components = c;
+            return "bar";
+        }
+        
+        r.drawLinearRing(node, geometry);
+        
+        t.ok(g_GetString, "getComponentString is called with valid arguments");
+        t.eq(node.getAttributeNS(null, "points"), "bar", "points attribute is correct");
+    }
+
+    function test_SVG_drawpolygon(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(4);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var node = document.createElement('div');
+        
+        var linearRings = [{
+            components: ["foo"]
+        },{
+            components: ["bar"]
+        }]
+        
+        var geometry = {
+            components: linearRings
+        }
+        g_GetString = false;
+        r.getShortString = function(c) {
+            g_GetString = true;
+            return c;
+        }
+        
+        r.drawPolygon(node, geometry);
+        
+        t.ok(g_GetString, "getShortString is called");
+        t.eq(node.getAttributeNS(null, "d"), " M foo M bar z", "d attribute is correctly set");
+        t.eq(node.getAttributeNS(null, "fill-rule"), "evenodd", "fill-rule attribute is correctly set");
+        
+        r.getShortString = function(c) {
+            return false;
+        }
+        r.drawPolygon(node, geometry);
+        t.eq(node.getAttributeNS(null, "d"), "", "d attribute is empty if one linearRing cannot be drawn");
+    }
+
+    function test_SVG_drawrectangle(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(4);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.resolution = 0.5;
+        r.left = 0;
+        r.top = 0;
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            x: 1,
+            y: 2,
+            width: 3,
+            height: 4
+        }
+        
+        r.drawRectangle(node, geometry);
+        
+        t.eq(node.getAttributeNS(null, "x"), "2", "x attribute is correctly set");
+        t.eq(node.getAttributeNS(null, "y"), "4", "y attribute is correctly set");
+        t.eq(node.getAttributeNS(null, "width"), "6", "width attribute is correctly set");
+        t.eq(node.getAttributeNS(null, "height"), "8", "height attribute is correctly set");
+    }
+    
+    function test_SVG_drawsurface(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(3);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            components: ['foo', 'bar', 'dude']
+        }
+        g_GetString = false;
+        r.getShortString = function(c) {
+            g_GetString = true;
+            return c;
+        }
+        
+        r.drawSurface(node, geometry);
+        
+        t.ok(g_GetString, "getShortString is called");
+        
+        t.eq(node.getAttributeNS(null, "d"), "M foo C bar dude Z", "d attribute is correctly set");
+        
+        r.getShortString = function(c) {
+            return false;
+        }
+        r.drawSurface(node, geometry);
+        t.eq(node.getAttributeNS(null, "d"), "", "d attribute is empty if one linearRing cannot be drawn");
+    }
+    
+    function test_SVG_getcomponentsstring(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var components = ['foo', 'bar'];
+        
+        OpenLayers.Renderer.SVG.prototype._getShortString = 
+            OpenLayers.Renderer.SVG.prototype.getShortString;
+            
+        OpenLayers.Renderer.SVG.prototype.getShortString = function(p) {
+            return p;
+        };
+        
+        var string = OpenLayers.Renderer.SVG.prototype.getComponentsString(components);
+        t.eq(string, "foo,bar", "returned string is correct");
+        
+        OpenLayers.Renderer.SVG.prototype.getShortString = 
+            OpenLayers.Renderer.SVG.prototype._getShortString;
+    }
+    
+    
+    
+    function test_SVG_getshortstring(t) {
+        if (!OpenLayers.Renderer.SVG.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var r = new OpenLayers.Renderer.SVG(document.body);
+        r.resolution = 0.5;
+        r.left = 0;
+        r.top = 0;
+        
+        var point = {
+            x: 1,
+            y: 2
+        };
+        
+        var string = r.getShortString(point);
+        t.eq(string, "2,4", "returned string is correct");
+    }
+    
+    
+
+  </script>
+</head>
+<body>
+<div id="map" style="width:500px;height:550px"></div>
+</body>
+</html>
diff --git a/tests/Renderer/test_VML.html b/tests/Renderer/test_VML.html
new file mode 100644
index 0000000000..2226ff9dc3
--- /dev/null
+++ b/tests/Renderer/test_VML.html
@@ -0,0 +1,915 @@
+<html>
+<head>
+<script src="../../lib/OpenLayers.js"></script>
+  <script type="text/javascript">
+
+    var geometry = null, node = null;
+
+    function test_VML_constructor(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        var r = new OpenLayers.Renderer.VML(document.body);
+        t.ok(r instanceof OpenLayers.Renderer.VML, "new OpenLayers.Renderer.VML returns VML object" );
+    }
+    
+    function test_VML_destroy(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var g_Destroy = false;
+        
+        OpenLayers.Renderer.Elements.prototype._destroy = 
+            OpenLayers.Renderer.Elements.prototype.destroy;
+            
+        OpenLayers.Renderer.prototype.destroy = function() {
+            g_Destroy = true;
+        }
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        r.destroy();
+        
+        t.eq(g_Destroy, true, "OpenLayers.Renderer.Elements.destroy() called");
+        
+        OpenLayers.Renderer.prototype.destroy = 
+            OpenLayers.Renderer.prototype._destroy;
+    }
+    
+    function test_VML_setextent(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(3);
+        
+        OpenLayers.Renderer.Elements.prototype._setExtent =
+            OpenLayers.Renderer.Elements.prototype.setExtent;
+        
+        var g_SetExtent = false;
+        OpenLayers.Renderer.Elements.prototype.setExtent = function() {
+            g_SetExtent = true;
+        }
+                
+        var r = new OpenLayers.Renderer.VML(document.body);
+        r.map = {
+            getResolution: function() {
+                return 0.5;
+            }
+        }
+        
+        var extent = new OpenLayers.Bounds(1,2,3,4);
+        r.setExtent(extent);
+        
+        t.eq(g_SetExtent, true, "Elements.setExtent() called");
+        
+        t.ok(r.root.coordorigin == "2,8", "coordorigin is correct");
+        t.ok(r.root.coordsize == "4,-4", "coordsize is correct");
+        
+        OpenLayers.Renderer.Elements.prototype.setExtent =
+            OpenLayers.Renderer.Elements.prototype._setExtent;
+    }
+
+    function test_VML_setsize(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(4);
+                
+        var r = new OpenLayers.Renderer.VML(document.body);
+        
+        var size = new OpenLayers.Size(1,2);
+        r.setSize(size);
+        t.eq(r.rendererRoot.style.width, "1px", "rendererRoot width is correct");
+        t.eq(r.rendererRoot.style.height, "2px", "rendererRoot height is correct");
+        
+        t.eq(r.root.style.width, "100%", "root width is correct");
+        t.eq(r.root.style.height, "100%", "root height is correct");
+    }
+
+    function test_VML_drawpoint(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+    
+        t.plan(1);
+
+        var r = new OpenLayers.Renderer.VML(document.body);
+        
+        var properDraw = false;
+        var g_Radius = null;
+        r.drawCircle = function(n, g, r) {
+            properDraw = true;
+            g_Radius = 1;
+        }
+        r.drawPoint();
+        
+        t.ok(properDraw && g_Radius == 1, "drawPoint called drawCircle with radius set to 1");
+    }
+
+    function test_VML_drawcircle(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(4);
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        r.resolution = 0.5;
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            x: 1,
+            y: 2
+        }
+        
+        var radius = 3;
+        r.drawCircle(node, geometry, radius);
+        
+        t.eq(node.style.left, '-1px', "left is correct");
+        t.eq(node.style.top, '1px', "top is correct");
+        t.eq(node.style.width, (2 * radius) + "px", "width is correct");
+        t.eq(node.style.height, (2 * radius) + "px", "height is correct");
+    }
+
+    function test_VML_drawlinestring(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        
+        g_DrawLine = false;
+        r.drawLine = function(c) {
+            g_DrawLine = true;
+        }
+        
+        r.drawLineString(node, geometry);
+        
+        t.ok(g_DrawLine, "drawLine is called");
+    }
+    
+    function test_VML_drawlinearring(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        
+        g_DrawLine = false;
+        r.drawLine = function(c) {
+            g_DrawLine = true;
+        }
+        
+        r.drawLinearRing(node, geometry);
+        
+        t.ok(g_DrawLine, "drawLine is called");
+    }
+
+    function test_VML_drawline(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(8);
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        r.resolution = 0.5;
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            components: [{
+                x: 1,
+                y: 2
+            },{
+                x: 3,
+                y: 4
+            }],
+            getBounds: function() {
+                return new OpenLayers.Bounds(5,6,7,8);
+            }
+        };
+        
+        r.drawLine(node, geometry, true);
+        t.ok(node.path.indexOf("x") != -1, "path attribute is correct when passed closeLine = true");
+        
+        
+        r.drawLine(node, geometry, false);
+        t.eq(node.path, "m 2,4 l  6,8 l  e", "path attribute is correct");
+        t.eq(node.style.left, "10px", "node.style.left is correct");
+        t.eq(node.style.top, "16px", "node.style.top is correct");
+        t.eq(node.style.width, "4px", "node.style.width is correct");
+        t.eq(node.style.height, "4px", "node.style.height is correct");
+        t.eq(node.coordorigin, "10 16", "node.coordorigin is correct");
+        t.eq(node.coordsize, "4 4", "node.coordsize is correct");
+    }
+    
+    function test_VML_drawpolygon(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(2);
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        r.resolution = 0.5;
+        
+        g_SetNodeDimension = false;
+        r.setNodeDimension = function(){
+            g_SetNodeDimension = true;
+        };
+        
+        var node = document.createElement('div');
+        
+        var linearRing = {
+            components: [{
+                x: 1,
+                y: 2
+            },{
+                x: 3,
+                y: 4
+            }]
+        };
+        var linearRing2 = {
+            components: [{
+                x: 5,
+                y: 6
+            },{
+                x: 7,
+                y: 8
+            }]
+        };
+        var geometry = {
+            components: [linearRing, linearRing2]
+        };
+        r.drawPolygon(node, geometry, true);
+        t.ok(g_SetNodeDimension, "setNodeDimension is called");
+        t.eq(node.path, "m 2,4 l 6,8 x m 10,12 l 14,16 x e", "path attribute is correct");
+    }
+    
+    function test_VML_drawrectangle(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(4);
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        r.resolution = 0.5;
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            x: 1,
+            y: 2,
+            width: 3,
+            height: 4
+        }
+        
+        r.drawRectangle(node, geometry);
+        
+        t.eq(node.style.left, "2px", "node.style.left is correct");
+        t.eq(node.style.top, "4px", "node.style.top is correct");
+        t.eq(node.style.width, "6px", "node.style.width is correct");
+        t.eq(node.style.height, "8px", "node.style.height is correct");
+    }
+    
+
+  </script>
+</head>
+<body>
+<div id="map" style="width:500px;height:550px"></div>
+</body>
+</html>
+<html>
+<head>
+<script src="../../lib/OpenLayers.js"></script>
+  <script type="text/javascript">
+
+    var geometry = null, node = null;
+
+    function test_VML_constructor(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        var r = new OpenLayers.Renderer.VML(document.body);
+        t.ok(r instanceof OpenLayers.Renderer.VML, "new OpenLayers.Renderer.VML returns VML object" );
+    }
+    
+    function test_VML_destroy(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var g_Destroy = false;
+        
+        OpenLayers.Renderer.Elements.prototype._destroy = 
+            OpenLayers.Renderer.Elements.prototype.destroy;
+            
+        OpenLayers.Renderer.prototype.destroy = function() {
+            g_Destroy = true;
+        }
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        r.destroy();
+        
+        t.eq(g_Destroy, true, "OpenLayers.Renderer.Elements.destroy() called");
+        
+        OpenLayers.Renderer.prototype.destroy = 
+            OpenLayers.Renderer.prototype._destroy;
+    }
+    
+    function test_VML_setextent(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(3);
+        
+        OpenLayers.Renderer.Elements.prototype._setExtent =
+            OpenLayers.Renderer.Elements.prototype.setExtent;
+        
+        var g_SetExtent = false;
+        OpenLayers.Renderer.Elements.prototype.setExtent = function() {
+            g_SetExtent = true;
+        }
+                
+        var r = new OpenLayers.Renderer.VML(document.body);
+        r.map = {
+            getResolution: function() {
+                return 0.5;
+            }
+        }
+        
+        var extent = new OpenLayers.Bounds(1,2,3,4);
+        r.setExtent(extent);
+        
+        t.eq(g_SetExtent, true, "Elements.setExtent() called");
+        
+        t.ok(r.root.coordorigin == "2,8", "coordorigin is correct");
+        t.ok(r.root.coordsize == "4,-4", "coordsize is correct");
+        
+        OpenLayers.Renderer.Elements.prototype.setExtent =
+            OpenLayers.Renderer.Elements.prototype._setExtent;
+    }
+
+    function test_VML_setsize(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(4);
+                
+        var r = new OpenLayers.Renderer.VML(document.body);
+        
+        var size = new OpenLayers.Size(1,2);
+        r.setSize(size);
+        t.eq(r.rendererRoot.style.width, "1px", "rendererRoot width is correct");
+        t.eq(r.rendererRoot.style.height, "2px", "rendererRoot height is correct");
+        
+        t.eq(r.root.style.width, "100%", "root width is correct");
+        t.eq(r.root.style.height, "100%", "root height is correct");
+    }
+
+    function test_VML_drawpoint(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+    
+        t.plan(1);
+
+        var r = new OpenLayers.Renderer.VML(document.body);
+        
+        var properDraw = false;
+        var g_Radius = null;
+        r.drawCircle = function(n, g, r) {
+            properDraw = true;
+            g_Radius = 1;
+        }
+        r.drawPoint();
+        
+        t.ok(properDraw && g_Radius == 1, "drawPoint called drawCircle with radius set to 1");
+    }
+
+    function test_VML_drawcircle(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(4);
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        r.resolution = 0.5;
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            x: 1,
+            y: 2
+        }
+        
+        var radius = 3;
+        r.drawCircle(node, geometry, radius);
+        
+        t.eq(node.style.left, '-1px', "left is correct");
+        t.eq(node.style.top, '1px', "top is correct");
+        t.eq(node.style.width, (2 * radius) + "px", "width is correct");
+        t.eq(node.style.height, (2 * radius) + "px", "height is correct");
+    }
+
+    function test_VML_drawlinestring(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        
+        g_DrawLine = false;
+        r.drawLine = function(c) {
+            g_DrawLine = true;
+        }
+        
+        r.drawLineString(node, geometry);
+        
+        t.ok(g_DrawLine, "drawLine is called");
+    }
+    
+    function test_VML_drawlinearring(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        
+        g_DrawLine = false;
+        r.drawLine = function(c) {
+            g_DrawLine = true;
+        }
+        
+        r.drawLinearRing(node, geometry);
+        
+        t.ok(g_DrawLine, "drawLine is called");
+    }
+
+    function test_VML_drawline(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(8);
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        r.resolution = 0.5;
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            components: [{
+                x: 1,
+                y: 2
+            },{
+                x: 3,
+                y: 4
+            }],
+            getBounds: function() {
+                return new OpenLayers.Bounds(5,6,7,8);
+            }
+        };
+        
+        r.drawLine(node, geometry, true);
+        t.ok(node.path.indexOf("x") != -1, "path attribute is correct when passed closeLine = true");
+        
+        
+        r.drawLine(node, geometry, false);
+        t.eq(node.path, "m 2,4 l  6,8 l  e", "path attribute is correct");
+        t.eq(node.style.left, "10px", "node.style.left is correct");
+        t.eq(node.style.top, "16px", "node.style.top is correct");
+        t.eq(node.style.width, "4px", "node.style.width is correct");
+        t.eq(node.style.height, "4px", "node.style.height is correct");
+        t.eq(node.coordorigin, "10 16", "node.coordorigin is correct");
+        t.eq(node.coordsize, "4 4", "node.coordsize is correct");
+    }
+    
+    function test_VML_drawpolygon(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(2);
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        r.resolution = 0.5;
+        
+        g_SetNodeDimension = false;
+        r.setNodeDimension = function(){
+            g_SetNodeDimension = true;
+        };
+        
+        var node = document.createElement('div');
+        
+        var linearRing = {
+            components: [{
+                x: 1,
+                y: 2
+            },{
+                x: 3,
+                y: 4
+            }]
+        };
+        var linearRing2 = {
+            components: [{
+                x: 5,
+                y: 6
+            },{
+                x: 7,
+                y: 8
+            }]
+        };
+        var geometry = {
+            components: [linearRing, linearRing2]
+        };
+        r.drawPolygon(node, geometry, true);
+        t.ok(g_SetNodeDimension, "setNodeDimension is called");
+        t.eq(node.path, "m 2,4 l 6,8 x m 10,12 l 14,16 x e", "path attribute is correct");
+    }
+    
+    function test_VML_drawrectangle(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(4);
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        r.resolution = 0.5;
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            x: 1,
+            y: 2,
+            width: 3,
+            height: 4
+        }
+        
+        r.drawRectangle(node, geometry);
+        
+        t.eq(node.style.left, "2px", "node.style.left is correct");
+        t.eq(node.style.top, "4px", "node.style.top is correct");
+        t.eq(node.style.width, "6px", "node.style.width is correct");
+        t.eq(node.style.height, "8px", "node.style.height is correct");
+    }
+    
+
+  </script>
+</head>
+<body>
+<div id="map" style="width:500px;height:550px"></div>
+</body>
+</html>
+<html>
+<head>
+<script src="../../lib/OpenLayers.js"></script>
+  <script type="text/javascript">
+
+    var geometry = null, node = null;
+
+    function test_VML_constructor(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        var r = new OpenLayers.Renderer.VML(document.body);
+        t.ok(r instanceof OpenLayers.Renderer.VML, "new OpenLayers.Renderer.VML returns VML object" );
+    }
+    
+    function test_VML_destroy(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var g_Destroy = false;
+        
+        OpenLayers.Renderer.Elements.prototype._destroy = 
+            OpenLayers.Renderer.Elements.prototype.destroy;
+            
+        OpenLayers.Renderer.prototype.destroy = function() {
+            g_Destroy = true;
+        }
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        r.destroy();
+        
+        t.eq(g_Destroy, true, "OpenLayers.Renderer.Elements.destroy() called");
+        
+        OpenLayers.Renderer.prototype.destroy = 
+            OpenLayers.Renderer.prototype._destroy;
+    }
+    
+    function test_VML_setextent(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(3);
+        
+        OpenLayers.Renderer.Elements.prototype._setExtent =
+            OpenLayers.Renderer.Elements.prototype.setExtent;
+        
+        var g_SetExtent = false;
+        OpenLayers.Renderer.Elements.prototype.setExtent = function() {
+            g_SetExtent = true;
+        }
+                
+        var r = new OpenLayers.Renderer.VML(document.body);
+        r.map = {
+            getResolution: function() {
+                return 0.5;
+            }
+        }
+        
+        var extent = new OpenLayers.Bounds(1,2,3,4);
+        r.setExtent(extent);
+        
+        t.eq(g_SetExtent, true, "Elements.setExtent() called");
+        
+        t.ok(r.root.coordorigin == "2,8", "coordorigin is correct");
+        t.ok(r.root.coordsize == "4,-4", "coordsize is correct");
+        
+        OpenLayers.Renderer.Elements.prototype.setExtent =
+            OpenLayers.Renderer.Elements.prototype._setExtent;
+    }
+
+    function test_VML_setsize(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(4);
+                
+        var r = new OpenLayers.Renderer.VML(document.body);
+        
+        var size = new OpenLayers.Size(1,2);
+        r.setSize(size);
+        t.eq(r.rendererRoot.style.width, "1px", "rendererRoot width is correct");
+        t.eq(r.rendererRoot.style.height, "2px", "rendererRoot height is correct");
+        
+        t.eq(r.root.style.width, "100%", "root width is correct");
+        t.eq(r.root.style.height, "100%", "root height is correct");
+    }
+
+    function test_VML_drawpoint(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+    
+        t.plan(1);
+
+        var r = new OpenLayers.Renderer.VML(document.body);
+        
+        var properDraw = false;
+        var g_Radius = null;
+        r.drawCircle = function(n, g, r) {
+            properDraw = true;
+            g_Radius = 1;
+        }
+        r.drawPoint();
+        
+        t.ok(properDraw && g_Radius == 1, "drawPoint called drawCircle with radius set to 1");
+    }
+
+    function test_VML_drawcircle(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(4);
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        r.resolution = 0.5;
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            x: 1,
+            y: 2
+        }
+        
+        var radius = 3;
+        r.drawCircle(node, geometry, radius);
+        
+        t.eq(node.style.left, '-1px', "left is correct");
+        t.eq(node.style.top, '1px', "top is correct");
+        t.eq(node.style.width, (2 * radius) + "px", "width is correct");
+        t.eq(node.style.height, (2 * radius) + "px", "height is correct");
+    }
+
+    function test_VML_drawlinestring(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        
+        g_DrawLine = false;
+        r.drawLine = function(c) {
+            g_DrawLine = true;
+        }
+        
+        r.drawLineString(node, geometry);
+        
+        t.ok(g_DrawLine, "drawLine is called");
+    }
+    
+    function test_VML_drawlinearring(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(1);
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        
+        g_DrawLine = false;
+        r.drawLine = function(c) {
+            g_DrawLine = true;
+        }
+        
+        r.drawLinearRing(node, geometry);
+        
+        t.ok(g_DrawLine, "drawLine is called");
+    }
+
+    function test_VML_drawline(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(8);
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        r.resolution = 0.5;
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            components: [{
+                x: 1,
+                y: 2
+            },{
+                x: 3,
+                y: 4
+            }],
+            getBounds: function() {
+                return new OpenLayers.Bounds(5,6,7,8);
+            }
+        };
+        
+        r.drawLine(node, geometry, true);
+        t.ok(node.path.indexOf("x") != -1, "path attribute is correct when passed closeLine = true");
+        
+        
+        r.drawLine(node, geometry, false);
+        t.eq(node.path, "m 2,4 l  6,8 l  e", "path attribute is correct");
+        t.eq(node.style.left, "10px", "node.style.left is correct");
+        t.eq(node.style.top, "16px", "node.style.top is correct");
+        t.eq(node.style.width, "4px", "node.style.width is correct");
+        t.eq(node.style.height, "4px", "node.style.height is correct");
+        t.eq(node.coordorigin, "10 16", "node.coordorigin is correct");
+        t.eq(node.coordsize, "4 4", "node.coordsize is correct");
+    }
+    
+    function test_VML_drawpolygon(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(2);
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        r.resolution = 0.5;
+        
+        g_SetNodeDimension = false;
+        r.setNodeDimension = function(){
+            g_SetNodeDimension = true;
+        };
+        
+        var node = document.createElement('div');
+        
+        var linearRing = {
+            components: [{
+                x: 1,
+                y: 2
+            },{
+                x: 3,
+                y: 4
+            }]
+        };
+        var linearRing2 = {
+            components: [{
+                x: 5,
+                y: 6
+            },{
+                x: 7,
+                y: 8
+            }]
+        };
+        var geometry = {
+            components: [linearRing, linearRing2]
+        };
+        r.drawPolygon(node, geometry, true);
+        t.ok(g_SetNodeDimension, "setNodeDimension is called");
+        t.eq(node.path, "m 2,4 l 6,8 x m 10,12 l 14,16 x e", "path attribute is correct");
+    }
+    
+    function test_VML_drawrectangle(t) {
+        if (!OpenLayers.Renderer.VML.prototype.supported()) {
+            t.plan(0);
+            return;
+        }
+        
+        t.plan(4);
+        
+        var r = new OpenLayers.Renderer.VML(document.body);
+        r.resolution = 0.5;
+        
+        var node = document.createElement('div');
+        
+        var geometry = {
+            x: 1,
+            y: 2,
+            width: 3,
+            height: 4
+        }
+        
+        r.drawRectangle(node, geometry);
+        
+        t.eq(node.style.left, "2px", "node.style.left is correct");
+        t.eq(node.style.top, "4px", "node.style.top is correct");
+        t.eq(node.style.width, "6px", "node.style.width is correct");
+        t.eq(node.style.height, "8px", "node.style.height is correct");
+    }
+    
+
+  </script>
+</head>
+<body>
+<div id="map" style="width:500px;height:550px"></div>
+</body>
+</html>
