Add versions of stroke, fill, and clip that take a Path parameter.

LayoutTests/fast/canvas/script-tests/canvas-path-context-stroke.js

Index: LayoutTests/fast/canvas/script-tests/canvas-path-context-stroke.js
diff --git a/LayoutTests/fast/canvas/script-tests/canvas-path-context-stroke.js b/LayoutTests/fast/canvas/script-tests/canvas-path-context-stroke.js
new file mode 100644
index 0000000000000000000000000000000000000000..1c3ccee3510a61254d58174108162b2cdb20da13
--- /dev/null
+++ b/LayoutTests/fast/canvas/script-tests/canvas-path-context-stroke.js
@@ -0,0 +1,50 @@
+description("Series of tests to ensure stroke() works with optional path parameter.");
+
+var ctx = document.getElementById('canvas').getContext('2d');
+
+function pixelDataAtPoint() {
+  return ctx.getImageData(75, 75, 1, 1).data;
+}
+
+function checkResult(expectedColors, sigma) {
+    for (var i = 0; i < 4; i++)
+      shouldBeCloseTo("pixelDataAtPoint()[" + i + "]", expectedColors[i], sigma);
+}
+
+function drawRectangleOn(contextOrPath) {
+  contextOrPath.rect(25, 25, 50, 50);
+}
+
+function formatName(path) {
+  return 'stroke(' + (path ? 'path' : '') + ')';
+}
+
+function testStrokeWith(path) {
+    debug('Testing ' + formatName(path));
+    ctx.fillStyle = 'rgb(255,0,0)';
+    ctx.beginPath();
+    ctx.fillRect(0, 0, 100, 100);
+    ctx.strokeStyle = 'rgb(0,255,0)';
+    ctx.lineWidth = 5;
+    if (path) {
+      ctx.stroke(path);
+    } else {
+      ctx.beginPath();
+      drawRectangleOn(ctx);
+      ctx.stroke();
+    }
+    debug('');
+    checkResult([0, 255, 0, 255], 5);
+}
+
+// Execute test.
+function prepareTestScenario() {
+    var path = new Path();
+    drawRectangleOn(path);
+
+    testStrokeWith();
+    testStrokeWith(path);

[dshwang, 2014/01/23 21:17:17]

I'm curious how result is changed if following code added.

ctx.scale(2);
testStrokeWith();
testStrokeWith(path);

I guess testStrokeWith() draws x1 rect because ctx.scale(2) deals with ctx.path,
but testStrokeWith(path) draws x2 rect because ctx.scale(2) does not do anything
about path.

The spec is vague about this case.

[jcgregorio, 2014/01/29 17:51:49]

Actually, my reading of the spec is that they should both do the same thing,
i.e. both be
scaled by 2, that the current transformation matrix applies to both.

 
http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-elemen...

[dshwang, 2014/01/31 12:29:00]

Your impl scales by 2 into only path object.

See CanvasRenderingContext2D::scale(). All ctx transforms apply inverse matrix
to m_path. So the drawing results of m_path and new path object are different
after applying any transform.

void CanvasRenderingContext2D::scale(float sx, float sy)
{
    ...
    c->scale(FloatSize(sx, sy));
    m_path.transform(AffineTransform().scaleNonUniform(1.0 / sx, 1.0 / sy));
}

+}
+
+// Run test and allow variation of results.
+prepareTestScenario();