CSS shapes support in Web Inspector

LayoutTests/http/tests/inspector/elements-test.js

 var initialize_ElementTest = function() {
 
 InspectorTest.findNode = function(matchFunction, callback)
 {
     callback = InspectorTest.safeWrap(callback);
     var result = null;
     var pendingRequests = 0;
     function processChildren(node)
     {
         try {
@@ skipping 730 matching lines @@
 {
     var rectNames = ["margin", "border", "padding", "content"];
     var rects = window.internals.inspectorHighlightRects(document);
     for (var i = 0; i < rects.length; i++)
     {
         var rectName = (i < rectNames.length ? rectNames[i] : "untitled");
         var rect = rects.item(i);
         output(rectName + " rect is " + rect.width + " x " + rect.height + " at (" + rect.left + ", " + rect.top + ")");
     }
 }
+
+function dumpInspectorHighlightCSSShape()
+{
+    var shapes = window.internals.inspectorHighlightCSSShapes(node);
+    var commands = shapes.shape;
+    for(var commandsIndex = 0; commandsIndex < commands.length; commandsIndex++) {
+        if (commands[commandsIndex] == 'M') {
+            command = "moveTo";
+            point1 = commands[commandsIndex+1];
+            point2 = commands[commandsIndex+2];
+            commandsIndex += 2;
+            output("command: moveTo, shapes point are: "+  point1 + " " + point2);

[Bear Travis, 2014/04/17 20:26:45]

Is this long form more useful than just the SVG-style path syntax? It seems to
generate a lot of text.

[Habib Virji, 2014/04/23 16:28:33]

Done.

+        } else if (commands[commandsIndex] == 'L') {
+            command = "lineTo";
+            point1 = commands[commandsIndex+1];
+            point2 = commands[commandsIndex+2];
+            commandsIndex += 2;
+            output("command: lineTo, shapes point are: "+  point1 + " " + point2);
+        } else if (commands[commandsIndex] == 'C') {
+            command = "bezierCurveTo";
+            point1 = commands[commandsIndex+1];
+            point2 = commands[commandsIndex+2];
+            point3 = commands[commandsIndex+3];
+            point4 = commands[commandsIndex+4];
+            point5 = commands[commandsIndex+5];
+            point6 = commands[commandsIndex+6];
+            commandsIndex += 6;
+            output("command: bezierCurveTo, shapes point are: "+  point1 + " " + point2 + " " + point3 + " " + point4+ " " + point5+ " "+ point6);
+        } else if (commands[commandsIndex] == 'Q') {
+            command = "quadraticTo";
+            point1 = commands[commandsIndex+1];
+            point2 = commands[commandsIndex+2];
+            point3 = commands[commandsIndex+3];
+            point4 = commands[commandsIndex+4];
+            commandsIndex += 4;
+            output("command: quadraticTo, shapes point are "+  point1 + " " + point2 + " " + point3 + " " + point4);
+        }
+    }
+}