Issue 129732 in chromium

Context Fill is not working with arc

HTML

<!DOCTYPE html>
<html>
<body>

<canvas id="myCanvas1" width="400" height="164" style="border:1px solid #c3c3c3;">
Your browser does not support the canvas element.
</canvas>

<canvas id="myCanvas2" width="400" height="165" style="border:1px solid #c3c3c3;">
Your browser does not support the canvas element.
</canvas>

</body>
</html>

JavaScript

var c1 = document.getElementById("myCanvas1");
var c2 = document.getElementById("myCanvas2");

var ctx1 = c1.getContext("2d");
var ctx2 = c2.getContext("2d");

var width = 50;
var height = 50;
var radius = 5;

// Rounded rect method


function roundedRectFill(ctx, x, y, r, w, h, fillColor1, fillColor2, strokeColor) {

    // Draw rounded rect path
    ctx.beginPath();
    ctx.moveTo(x + r, y);
    ctx.lineTo(x + w - r, y);
    ctx.quadraticCurveTo(x + w, y, x + w, y + r);
    ctx.lineTo(x + w, y + h - r);
    ctx.quadraticCurveTo(x + w, y + h, x + w - r, y + h);
    ctx.lineTo(x + r, y + h);
    ctx.quadraticCurveTo(x, y + h, x, y + h - r);
    ctx.lineTo(x, y + r);
    ctx.quadraticCurveTo(x, y, x + r, y);
    ctx.closePath();

    // Fill rounded rect 
    if (fillColor2.length > 0) {
        ctx.fillStyle = ctx.createLinearGradient(x, y, x, (y) + h);
        ctx.fillStyle.addColorStop(0, fillColor1);
        ctx.fillStyle.addColorStop(1, fillColor2);
    }
    else {
        ctx.fillStyle = fillColor1;
    }

    ctx.fill();

    // Stroke rounded rect
    ctx.strokeStyle = strokeColor;
    ctx.stroke();

}

// Square rect method


function squareRectFill(ctx, x, y, w, h, fillColor1, fillColor2, strokeColor) {

    // Draw filled square rect
    if (fillColor2.length > 0) {
        ctx.fillStyle = ctx.createLinearGradient(x, y, x, (y) + h);
        ctx.fillStyle.addColorStop(0, fillColor1);
        ctx.fillStyle.addColorStop(1, fillColor2);
    }
    else {
        ctx.fillStyle = fillColor1;
    }

    ctx.fillRect(x, y, w, h);

    // Draw stroked square rect
    ctx.strokeStyle = strokeColor;
    ctx.strokeRect(x, y, w, h);

}

// Draw rounded and square rect (hex)
roundedRectFill(ctx1, 10, 10, radius, width, height, "#eeeeee", "#999999", "#000000");
squareRectFill(ctx1, 130, 10, width, height, "#eeeeee", "#999999", "#000000");

roundedRectFill(ctx1, 10, 70, radius, width, height, "#cccccc", "", "#000000");
squareRectFill(ctx1, 130, 70, width, height,...