<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[277547] trunk</title>
</head>
<body>

<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt;  }
#msg dl a { font-weight: bold}
#msg dl a:link    { color:#fc3; }
#msg dl a:active  { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff  {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://trac.webkit.org/projects/webkit/changeset/277547">277547</a></dd>
<dt>Author</dt> <dd>said@apple.com</dd>
<dt>Date</dt> <dd>2021-05-15 13:46:56 -0700 (Sat, 15 May 2021)</dd>
</dl>

<h3>Log Message</h3>
<pre>Implement CanvasRenderingContext2D.createConicGradient
https://bugs.webkit.org/show_bug.cgi?id=225539

Reviewed by Sam Weinig.

LayoutTests/imported/w3c:

* web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.conic-expected.txt:

Source/WebCore:

Proposal document:
    https://github.com/fserb/canvas2D/blob/master/spec/conic-gradient.md

MDN documentation:
    https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/createConicGradient

Tests: fast/canvas/canvas-conic-gradient-angle.html
       fast/canvas/canvas-conic-gradient-center.html
       fast/canvas/conicGradient-infinite-values.html

* html/canvas/CanvasFillStrokeStyles.idl:
* html/canvas/CanvasGradient.cpp:
(WebCore::CanvasGradient::CanvasGradient):
(WebCore::m_canvas):
(WebCore::CanvasGradient::create):
* html/canvas/CanvasGradient.h:
* html/canvas/CanvasRenderingContext2DBase.cpp:
(WebCore::CanvasRenderingContext2DBase::createConicGradient):
* html/canvas/CanvasRenderingContext2DBase.h:

Source/WebInspectorUI:

* UserInterface/Models/NativeFunctionParameters.js:
* UserInterface/Models/Recording.js:
(WI.Recording.prototype.async swizzle):
* UserInterface/Views/RecordingActionTreeElement.js:
(WI.RecordingActionTreeElement._classNameForAction):

LayoutTests:

* fast/canvas/canvas-conic-gradient-angle-expected.html: Added.
* fast/canvas/canvas-conic-gradient-angle.html: Added.
* fast/canvas/canvas-conic-gradient-center-expected.html: Added.
* fast/canvas/canvas-conic-gradient-center.html: Added.
* fast/canvas/conicGradient-infinite-values-expected.txt: Added.
* fast/canvas/conicGradient-infinite-values.html: Added.
* inspector/canvas/recording-html-2d-expected.txt:
* inspector/canvas/recording-html-2d.html:
* platform/win/TestExpectations:</pre>

<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsChangeLog">trunk/LayoutTests/ChangeLog</a></li>
<li><a href="#trunkLayoutTestsimportedw3cChangeLog">trunk/LayoutTests/imported/w3c/ChangeLog</a></li>
<li><a href="#trunkLayoutTestsimportedw3cwebplatformtestshtmlcanvaselementfillandstrokestyles2dgradientconicexpectedtxt">trunk/LayoutTests/imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.conic-expected.txt</a></li>
<li><a href="#trunkLayoutTestsinspectorcanvasrecordinghtml2dexpectedtxt">trunk/LayoutTests/inspector/canvas/recording-html-2d-expected.txt</a></li>
<li><a href="#trunkLayoutTestsinspectorcanvasrecordinghtml2dhtml">trunk/LayoutTests/inspector/canvas/recording-html-2d.html</a></li>
<li><a href="#trunkLayoutTestsplatformwinTestExpectations">trunk/LayoutTests/platform/win/TestExpectations</a></li>
<li><a href="#trunkSourceWebCoreChangeLog">trunk/Source/WebCore/ChangeLog</a></li>
<li><a href="#trunkSourceWebCorehtmlcanvasCanvasFillStrokeStylesidl">trunk/Source/WebCore/html/canvas/CanvasFillStrokeStyles.idl</a></li>
<li><a href="#trunkSourceWebCorehtmlcanvasCanvasGradientcpp">trunk/Source/WebCore/html/canvas/CanvasGradient.cpp</a></li>
<li><a href="#trunkSourceWebCorehtmlcanvasCanvasGradienth">trunk/Source/WebCore/html/canvas/CanvasGradient.h</a></li>
<li><a href="#trunkSourceWebCorehtmlcanvasCanvasRenderingContext2DBasecpp">trunk/Source/WebCore/html/canvas/CanvasRenderingContext2DBase.cpp</a></li>
<li><a href="#trunkSourceWebCorehtmlcanvasCanvasRenderingContext2DBaseh">trunk/Source/WebCore/html/canvas/CanvasRenderingContext2DBase.h</a></li>
<li><a href="#trunkSourceWebInspectorUIChangeLog">trunk/Source/WebInspectorUI/ChangeLog</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceModelsNativeFunctionParametersjs">trunk/Source/WebInspectorUI/UserInterface/Models/NativeFunctionParameters.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceModelsRecordingjs">trunk/Source/WebInspectorUI/UserInterface/Models/Recording.js</a></li>
<li><a href="#trunkSourceWebInspectorUIUserInterfaceViewsRecordingActionTreeElementjs">trunk/Source/WebInspectorUI/UserInterface/Views/RecordingActionTreeElement.js</a></li>
</ul>

<h3>Added Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsfastcanvascanvasconicgradientangleexpectedhtml">trunk/LayoutTests/fast/canvas/canvas-conic-gradient-angle-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastcanvascanvasconicgradientanglehtml">trunk/LayoutTests/fast/canvas/canvas-conic-gradient-angle.html</a></li>
<li><a href="#trunkLayoutTestsfastcanvascanvasconicgradientcenterexpectedhtml">trunk/LayoutTests/fast/canvas/canvas-conic-gradient-center-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastcanvascanvasconicgradientcenterhtml">trunk/LayoutTests/fast/canvas/canvas-conic-gradient-center.html</a></li>
<li><a href="#trunkLayoutTestsfastcanvasconicGradientinfinitevaluesexpectedtxt">trunk/LayoutTests/fast/canvas/conicGradient-infinite-values-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastcanvasconicGradientinfinitevalueshtml">trunk/LayoutTests/fast/canvas/conicGradient-infinite-values.html</a></li>
</ul>

</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkLayoutTestsChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/ChangeLog (277546 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/ChangeLog      2021-05-15 20:22:37 UTC (rev 277546)
+++ trunk/LayoutTests/ChangeLog 2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -1,3 +1,20 @@
</span><ins>+2021-05-15  Said Abou-Hallawa  <said@apple.com>
+
+        Implement CanvasRenderingContext2D.createConicGradient
+        https://bugs.webkit.org/show_bug.cgi?id=225539
+
+        Reviewed by Sam Weinig.
+
+        * fast/canvas/canvas-conic-gradient-angle-expected.html: Added.
+        * fast/canvas/canvas-conic-gradient-angle.html: Added.
+        * fast/canvas/canvas-conic-gradient-center-expected.html: Added.
+        * fast/canvas/canvas-conic-gradient-center.html: Added.
+        * fast/canvas/conicGradient-infinite-values-expected.txt: Added.
+        * fast/canvas/conicGradient-infinite-values.html: Added.
+        * inspector/canvas/recording-html-2d-expected.txt:
+        * inspector/canvas/recording-html-2d.html:
+        * platform/win/TestExpectations:
+
</ins><span class="cx"> 2021-05-15  Antti Koivisto  <antti@apple.com>
</span><span class="cx"> 
</span><span class="cx">         Don't allow :visited link style in subtrees that use mix-blend-mode
</span></span></pre></div>
<a id="trunkLayoutTestsfastcanvascanvasconicgradientangleexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/canvas-conic-gradient-angle-expected.html (0 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/canvas-conic-gradient-angle-expected.html                          (rev 0)
+++ trunk/LayoutTests/fast/canvas/canvas-conic-gradient-angle-expected.html     2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -0,0 +1,28 @@
</span><ins>+<style>
+    canvas {
+        border: 1px solid;
+    }
+</style>
+<body>
+    <canvas id="c1" width="100" height="100"></canvas>
+    <canvas id="c2" width="100" height="100"></canvas>
+    <canvas id="c3" width="100" height="100"></canvas>
+    <canvas id="c4" width="100" height="100"></canvas>
+    <script>
+        function fillCanvasWithSolidColor(canvasId, x, y, width, height) {
+            const canvas = document.getElementById(canvasId);
+            const ctx = canvas.getContext('2d');
+            ctx.fillStyle = "black";
+            ctx.fillRect(x, y, width, height);
+        }
+
+        fillCanvasWithSolidColor("c1", 50,  0, 50, 50);
+        fillCanvasWithSolidColor("c1",  0, 50, 50, 50);
+        fillCanvasWithSolidColor("c2",  0,  0, 50, 50);
+        fillCanvasWithSolidColor("c2", 50, 50, 50, 50);
+        fillCanvasWithSolidColor("c3",  0, 50, 50, 50);
+        fillCanvasWithSolidColor("c3", 50,  0, 50, 50);
+        fillCanvasWithSolidColor("c4",  0,  0, 50, 50);
+        fillCanvasWithSolidColor("c4", 50, 50, 50, 50);
+    </script>
+</body>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcanvascanvasconicgradientanglehtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/canvas-conic-gradient-angle.html (0 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/canvas-conic-gradient-angle.html                           (rev 0)
+++ trunk/LayoutTests/fast/canvas/canvas-conic-gradient-angle.html      2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -0,0 +1,34 @@
</span><ins>+<style>
+    canvas {
+        border: 1px solid;
+    }
+</style>
+<body>
+    <canvas id="c1" width="100" height="100"></canvas>
+    <canvas id="c2" width="100" height="100"></canvas>
+    <canvas id="c3" width="100" height="100"></canvas>
+    <canvas id="c4" width="100" height="100"></canvas>
+    <script>
+        function fillCanvasWithConicGradient(canvasId, angle, x, y) {
+            const canvas = document.getElementById(canvasId);
+            const ctx = canvas.getContext('2d');
+            const gradient = ctx.createConicGradient(angle, x, y);
+
+            gradient.addColorStop(0, "black");
+            gradient.addColorStop(0.25, "black");
+            gradient.addColorStop(0.25, "transparent");
+            gradient.addColorStop(0.5, "transparent");
+            gradient.addColorStop(0.5, "black");
+            gradient.addColorStop(0.75, "black");
+            gradient.addColorStop(0.75, "transparent");
+
+            ctx.fillStyle = gradient;
+            ctx.fillRect(0, 0, 100, 100);
+        }
+
+        fillCanvasWithConicGradient("c1", 0, 50, 50);
+        fillCanvasWithConicGradient("c2", Math.PI / 2, 50, 50);
+        fillCanvasWithConicGradient("c3", Math.PI, 50, 50);
+        fillCanvasWithConicGradient("c4", Math.PI * 3 / 2, 50, 50);
+    </script>
+</body>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcanvascanvasconicgradientcenterexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/canvas-conic-gradient-center-expected.html (0 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/canvas-conic-gradient-center-expected.html                         (rev 0)
+++ trunk/LayoutTests/fast/canvas/canvas-conic-gradient-center-expected.html    2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -0,0 +1,28 @@
</span><ins>+<style>
+    canvas {
+        border: 1px solid;
+    }
+</style>
+<body>
+    <canvas id="c1" width="100" height="100"></canvas>
+    <canvas id="c2" width="100" height="100"></canvas>
+    <canvas id="c3" width="100" height="100"></canvas>
+    <canvas id="c4" width="100" height="100"></canvas>
+    <script>
+        function fillCanvasWithSolidColor(canvasId, x, y, width, height) {
+            const canvas = document.getElementById(canvasId);
+            const ctx = canvas.getContext('2d');
+            ctx.fillStyle = "black";
+            ctx.fillRect(x, y, width, height);
+        }
+
+        fillCanvasWithSolidColor("c1", 20,  0, 80, 20);
+        fillCanvasWithSolidColor("c1",  0, 20, 20, 80);
+        fillCanvasWithSolidColor("c2", 80,  0, 20, 20);
+        fillCanvasWithSolidColor("c2",  0, 20, 80, 80);
+        fillCanvasWithSolidColor("c3", 20,  0, 80, 80);
+        fillCanvasWithSolidColor("c3",  0, 80, 20, 20);
+        fillCanvasWithSolidColor("c4", 80,  0, 20, 80);
+        fillCanvasWithSolidColor("c4",  0, 80, 80, 20);
+    </script>
+</body>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcanvascanvasconicgradientcenterhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/canvas-conic-gradient-center.html (0 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/canvas-conic-gradient-center.html                          (rev 0)
+++ trunk/LayoutTests/fast/canvas/canvas-conic-gradient-center.html     2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -0,0 +1,34 @@
</span><ins>+<style>
+    canvas {
+        border: 1px solid;
+    }
+</style>
+<body>
+    <canvas id="c1" width="100" height="100"></canvas>
+    <canvas id="c2" width="100" height="100"></canvas>
+    <canvas id="c3" width="100" height="100"></canvas>
+    <canvas id="c4" width="100" height="100"></canvas>
+    <script>
+        function fillCanvasWithConicGradient(canvasId, angle, x, y) {
+            const canvas = document.getElementById(canvasId);
+            const ctx = canvas.getContext('2d');
+            const gradient = ctx.createConicGradient(angle, x, y);
+
+            gradient.addColorStop(0, "black");
+            gradient.addColorStop(0.25, "black");
+            gradient.addColorStop(0.25, "transparent");
+            gradient.addColorStop(0.5, "transparent");
+            gradient.addColorStop(0.5, "black");
+            gradient.addColorStop(0.75, "black");
+            gradient.addColorStop(0.75, "transparent");
+
+            ctx.fillStyle = gradient;
+            ctx.fillRect(0, 0, 100, 100);
+        }
+
+        fillCanvasWithConicGradient("c1", 0, 20, 20);
+        fillCanvasWithConicGradient("c2", 0, 80, 20);
+        fillCanvasWithConicGradient("c3", 0, 20, 80);
+        fillCanvasWithConicGradient("c4", 0, 80, 80);
+    </script>
+</body>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcanvasconicGradientinfinitevaluesexpectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/conicGradient-infinite-values-expected.txt (0 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/conicGradient-infinite-values-expected.txt                         (rev 0)
+++ trunk/LayoutTests/fast/canvas/conicGradient-infinite-values-expected.txt    2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -0,0 +1,18 @@
</span><ins>+This test checks createConicGradient with infinite values
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+PASS ctx.createConicGradient(0, 100, NaN) threw exception TypeError: The provided value is non-finite.
+PASS ctx.createConicGradient(0, 100, Infinity) threw exception TypeError: The provided value is non-finite.
+PASS ctx.createConicGradient(0, 100, -Infinity) threw exception TypeError: The provided value is non-finite.
+PASS ctx.createConicGradient(0, NaN, 100) threw exception TypeError: The provided value is non-finite.
+PASS ctx.createConicGradient(0, Infinity, 100) threw exception TypeError: The provided value is non-finite.
+PASS ctx.createConicGradient(0, -Infinity, 100) threw exception TypeError: The provided value is non-finite.
+PASS ctx.createConicGradient(NaN, 100, 100) threw exception TypeError: The provided value is non-finite.
+PASS ctx.createConicGradient(Infinity, 100, 100) threw exception TypeError: The provided value is non-finite.
+PASS ctx.createConicGradient(-Infinity, 100, 100) threw exception TypeError: The provided value is non-finite.
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcanvasconicGradientinfinitevalueshtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/conicGradient-infinite-values.html (0 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/conicGradient-infinite-values.html                         (rev 0)
+++ trunk/LayoutTests/fast/canvas/conicGradient-infinite-values.html    2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -0,0 +1,26 @@
</span><ins>+<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
+<html>
+<head>
+<script src="../../resources/js-test-pre.js"></script>
+</head>
+<body>
+<script>
+description(
+'This test checks createConicGradient with infinite values'
+);
+
+var ctx = document.createElement('canvas').getContext('2d');
+
+shouldThrow("ctx.createConicGradient(0, 100, NaN)", "'TypeError: The provided value is non-finite'");
+shouldThrow("ctx.createConicGradient(0, 100, Infinity)", "'TypeError: The provided value is non-finite'");
+shouldThrow("ctx.createConicGradient(0, 100, -Infinity)", "'TypeError: The provided value is non-finite'");
+shouldThrow("ctx.createConicGradient(0, NaN, 100)", "'TypeError: The provided value is non-finite'");
+shouldThrow("ctx.createConicGradient(0, Infinity, 100)", "'TypeError: The provided value is non-finite'");
+shouldThrow("ctx.createConicGradient(0, -Infinity, 100)", "'TypeError: The provided value is non-finite'");
+shouldThrow("ctx.createConicGradient(NaN, 100, 100)", "'TypeError: The provided value is non-finite'");
+shouldThrow("ctx.createConicGradient(Infinity, 100, 100)", "'TypeError: The provided value is non-finite'");
+shouldThrow("ctx.createConicGradient(-Infinity, 100, 100)", "'TypeError: The provided value is non-finite'");
+</script>
+<script src="../../resources/js-test-post.js"></script>
+</body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsimportedw3cChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/imported/w3c/ChangeLog (277546 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/imported/w3c/ChangeLog 2021-05-15 20:22:37 UTC (rev 277546)
+++ trunk/LayoutTests/imported/w3c/ChangeLog    2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -1,3 +1,12 @@
</span><ins>+2021-05-15  Said Abou-Hallawa  <said@apple.com>
+
+        Implement CanvasRenderingContext2D.createConicGradient
+        https://bugs.webkit.org/show_bug.cgi?id=225539
+
+        Reviewed by Sam Weinig.
+
+        * web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.conic-expected.txt:
+
</ins><span class="cx"> 2021-05-14  Darin Adler  <darin@apple.com>
</span><span class="cx"> 
</span><span class="cx">         output element doesn't react properly to node tree mutations
</span></span></pre></div>
<a id="trunkLayoutTestsimportedw3cwebplatformtestshtmlcanvaselementfillandstrokestyles2dgradientconicexpectedtxt"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.conic-expected.txt (277546 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.conic-expected.txt      2021-05-15 20:22:37 UTC (rev 277546)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.conic-expected.txt 2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -4,5 +4,5 @@
</span><span class="cx"> Expected output:
</span><span class="cx"> 
</span><span class="cx"> 
</span><del>-FAIL Conic gradient function exists ctx.createConicGradient is not a function. (In 'ctx.createConicGradient(0, 0, 25)', 'ctx.createConicGradient' is undefined)
</del><ins>+PASS Conic gradient function exists
</ins><span class="cx"> 
</span></span></pre></div>
<a id="trunkLayoutTestsinspectorcanvasrecordinghtml2dexpectedtxt"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/inspector/canvas/recording-html-2d-expected.txt (277546 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/inspector/canvas/recording-html-2d-expected.txt        2021-05-15 20:22:37 UTC (rev 277546)
+++ trunk/LayoutTests/inspector/canvas/recording-html-2d-expected.txt   2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -128,6 +128,7 @@
</span><span class="cx">         context.fillStyle = objects[4];
</span><span class="cx">         context.fillStyle = objects[5];
</span><span class="cx">         context.fillStyle = objects[6];
</span><ins>+        context.fillStyle = objects[7];
</ins><span class="cx">     },
</span><span class="cx">     function frame2() {
</span><span class="cx">         context.beginPath();
</span><span class="lines">@@ -136,19 +137,19 @@
</span><span class="cx">         context.moveTo(1, 2);
</span><span class="cx">     },
</span><span class="cx">     function frame4() {
</span><del>-        context.drawImage(objects[7], 11, 12);
</del><ins>+        context.drawImage(objects[8], 11, 12);
</ins><span class="cx">     },
</span><span class="cx">     function frame5() {
</span><del>-        context.createImageData(objects[8]);
</del><ins>+        context.createImageData(objects[9]);
</ins><span class="cx">     },
</span><span class="cx">     function frame6() {
</span><del>-        context.drawImage(objects[9], 11, 12);
</del><ins>+        context.drawImage(objects[10], 11, 12);
</ins><span class="cx">     },
</span><span class="cx">     function frame7() {
</span><del>-        context.setTransform(objects[10]);
</del><ins>+        context.setTransform(objects[11]);
</ins><span class="cx">     },
</span><span class="cx">     function frame8() {
</span><del>-        // context.drawFocusIfNeeded(objects[11], "Element");
</del><ins>+        // context.drawFocusIfNeeded(objects[12], "Element");
</ins><span class="cx">     },
</span><span class="cx">     function stopRecording() {
</span><span class="cx">         if (typeof console.recordEnd === "function")
</span><span class="lines">@@ -160,8 +161,10 @@
</span><span class="cx">     let gradient = null;
</span><span class="cx">     if (data.type === "radial-gradient")
</span><span class="cx">         gradient = context.createRadialGradient(data.points[0], data.points[1], data.points[2], data.points[3], data.points[4], data.points[5]);
</span><ins>+    else if (data.type === "linear-gradient")
+        gradient = context.createLinearGradient(data.points[0], data.points[1], data.points[2], data.points[3]);
</ins><span class="cx">     else
</span><del>-        gradient = context.createLinearGradient(data.points[0], data.points[1], data.points[2], data.points[3]);
</del><ins>+        gradient = context.createConicGradient(data.points[0], data.points[1], data.points[2]);
</ins><span class="cx">     for (let stop of data.stops)
</span><span class="cx">         gradient.addColorStop(stop.offset, stop.color);
</span><span class="cx">     objects[key] = gradient;
</span><span class="lines">@@ -220,12 +223,13 @@
</span><span class="cx"> rebuildPath2D(3, "");
</span><span class="cx"> rebuildCanvasGradient(4, {"type":"linear-gradient","points":[1,2,3,4],"stops":[{"offset":1,"color":"rgb(255, 0, 0)"},{"offset":1,"color":"rgb(0, 0, 255)"}]});
</span><span class="cx"> rebuildCanvasGradient(5, {"type":"radial-gradient","points":[1,2,3,4,5,6],"stops":[]});
</span><del>-rebuildCanvasPattern(6, {"image":<filtered>,"repeat":"no-repeat"});
-rebuildImage(7, <filtered>);
-rebuildImageData(8, {"data":[0,0,0,0,0,0,0,0],"width":1,"height":2});
-rebuildImageBitmap(9, <filtered>);
-rebuildDOMMatrix(10, "matrix(1, 2, 3, 4, 5, 6)");
-rebuildPath2D(11, "M1 2");
</del><ins>+rebuildCanvasGradient(6, {"type":"conic-gradient","points":[2,3,1],"stops":[{"offset":1,"color":"rgb(0, 128, 0)"}]});
+rebuildCanvasPattern(7, {"image":<filtered>,"repeat":"no-repeat"});
+rebuildImage(8, <filtered>);
+rebuildImageData(9, {"data":[0,0,0,0,0,0,0,0],"width":1,"height":2});
+rebuildImageBitmap(10, <filtered>);
+rebuildDOMMatrix(11, "matrix(1, 2, 3, 4, 5, 6)");
+rebuildPath2D(12, "M1 2");
</ins><span class="cx"> 
</span><span class="cx"> Promise.all(promises).then(function() {
</span><span class="cx">     window.requestAnimationFrame(function executeFrame() {
</span></span></pre></div>
<a id="trunkLayoutTestsinspectorcanvasrecordinghtml2dhtml"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/inspector/canvas/recording-html-2d.html (277546 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/inspector/canvas/recording-html-2d.html        2021-05-15 20:22:37 UTC (rev 277546)
+++ trunk/LayoutTests/inspector/canvas/recording-html-2d.html   2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -18,6 +18,8 @@
</span><span class="cx"> 
</span><span class="cx"> let radialGradient = null;
</span><span class="cx"> 
</span><ins>+let conicGradient = null;
+
</ins><span class="cx"> let pattern = null;
</span><span class="cx"> 
</span><span class="cx"> let path2D = new Path2D("M 1 2");
</span><span class="lines">@@ -35,6 +37,9 @@
</span><span class="cx">     radialGradient = context.createRadialGradient(1, 2, 3, 4, 5, 6);
</span><span class="cx">     linearGradient.addColorStop(1, "blue");
</span><span class="cx"> 
</span><ins>+    conicGradient = context.createConicGradient(1, 2, 3);
+    conicGradient.addColorStop(1, "green");
+
</ins><span class="cx">     pattern = context.createPattern(image, "no-repeat");
</span><span class="cx"> 
</span><span class="cx">     imageBitmap = await createImageBitmap(image);
</span><span class="lines">@@ -74,6 +79,7 @@
</span><span class="cx">             context.fillStyle = "test";
</span><span class="cx">             context.fillStyle = linearGradient;
</span><span class="cx">             context.fillStyle = radialGradient;
</span><ins>+            context.fillStyle = conicGradient;
</ins><span class="cx">             context.fillStyle = pattern;
</span><span class="cx">         },
</span><span class="cx">         () => {
</span></span></pre></div>
<a id="trunkLayoutTestsplatformwinTestExpectations"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/platform/win/TestExpectations (277546 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/platform/win/TestExpectations  2021-05-15 20:22:37 UTC (rev 277546)
+++ trunk/LayoutTests/platform/win/TestExpectations     2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -287,6 +287,8 @@
</span><span class="cx"> fast/gradients/conic-gradient-extended-stops.html [ Skip ]
</span><span class="cx"> fast/gradients/conic-gradient.html [ Skip ]
</span><span class="cx"> fast/gradients/conic-two-hints.html [ Skip ]
</span><ins>+fast/canvas/canvas-conic-gradient-angle.html [ Skip ]
+fast/canvas/canvas-conic-gradient-center.html [ Skip ]
</ins><span class="cx"> 
</span><span class="cx"> # TODO Investigate why these mouse scroll tests are failing.
</span><span class="cx"> fast/events/scroll-in-scaled-page-with-overflow-hidden.html [ Failure ]
</span></span></pre></div>
<a id="trunkSourceWebCoreChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/ChangeLog (277546 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/ChangeLog   2021-05-15 20:22:37 UTC (rev 277546)
+++ trunk/Source/WebCore/ChangeLog      2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -1,3 +1,30 @@
</span><ins>+2021-05-15  Said Abou-Hallawa  <said@apple.com>
+
+        Implement CanvasRenderingContext2D.createConicGradient
+        https://bugs.webkit.org/show_bug.cgi?id=225539
+
+        Reviewed by Sam Weinig.
+
+        Proposal document:
+            https://github.com/fserb/canvas2D/blob/master/spec/conic-gradient.md
+
+        MDN documentation:
+            https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/createConicGradient
+
+        Tests: fast/canvas/canvas-conic-gradient-angle.html
+               fast/canvas/canvas-conic-gradient-center.html
+               fast/canvas/conicGradient-infinite-values.html
+
+        * html/canvas/CanvasFillStrokeStyles.idl:
+        * html/canvas/CanvasGradient.cpp:
+        (WebCore::CanvasGradient::CanvasGradient):
+        (WebCore::m_canvas):
+        (WebCore::CanvasGradient::create):
+        * html/canvas/CanvasGradient.h:
+        * html/canvas/CanvasRenderingContext2DBase.cpp:
+        (WebCore::CanvasRenderingContext2DBase::createConicGradient):
+        * html/canvas/CanvasRenderingContext2DBase.h:
+
</ins><span class="cx"> 2021-05-15  Alan Bujtas  <zalan@apple.com>
</span><span class="cx"> 
</span><span class="cx">         [LFC] Move table formatting quirks to its own class
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlcanvasCanvasFillStrokeStylesidl"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/canvas/CanvasFillStrokeStyles.idl (277546 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/canvas/CanvasFillStrokeStyles.idl      2021-05-15 20:22:37 UTC (rev 277546)
+++ trunk/Source/WebCore/html/canvas/CanvasFillStrokeStyles.idl 2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -42,8 +42,8 @@
</span><span class="cx">     attribute (DOMString or CanvasGradient or CanvasPattern) strokeStyle; // (default black)
</span><span class="cx">     attribute (DOMString or CanvasGradient or CanvasPattern) fillStyle; // (default black)
</span><span class="cx"> 
</span><del>-    // FIXME: All the float parameters below should be doubles.
-    CanvasGradient createLinearGradient(float x0, float y0, float x1, float y1);
-    CanvasGradient createRadialGradient(float x0, float y0, float r0, float x1, float y1, float r1);
</del><ins>+    CanvasGradient createLinearGradient(double x0, double y0, double x1, double y1);
+    CanvasGradient createRadialGradient(double x0, double y0, double r0, double x1, double y1, double r1);
+    CanvasGradient createConicGradient(double angle, double x, double y);
</ins><span class="cx">     CanvasPattern? createPattern(CanvasImageSource image, [LegacyNullToEmptyString] DOMString repetition);
</span><span class="cx"> };
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlcanvasCanvasGradientcpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/canvas/CanvasGradient.cpp (277546 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/canvas/CanvasGradient.cpp      2021-05-15 20:22:37 UTC (rev 277546)
+++ trunk/Source/WebCore/html/canvas/CanvasGradient.cpp 2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -45,6 +45,12 @@
</span><span class="cx"> {
</span><span class="cx"> }
</span><span class="cx"> 
</span><ins>+CanvasGradient::CanvasGradient(const FloatPoint& centerPoint, float angleInRadians, CanvasBase& canvasBase)
+    : m_gradient(Gradient::create(Gradient::ConicData { centerPoint, angleInRadians }))
+    , m_canvas(canvasBase)
+{
+}
+
</ins><span class="cx"> Ref<CanvasGradient> CanvasGradient::create(const FloatPoint& p0, const FloatPoint& p1, CanvasBase& canvasBase)
</span><span class="cx"> {
</span><span class="cx">     return adoptRef(*new CanvasGradient(p0, p1, canvasBase));
</span><span class="lines">@@ -55,6 +61,11 @@
</span><span class="cx">     return adoptRef(*new CanvasGradient(p0, r0, p1, r1, canvasBase));
</span><span class="cx"> }
</span><span class="cx"> 
</span><ins>+Ref<CanvasGradient> CanvasGradient::create(const FloatPoint& centerPoint, float angleInRadians, CanvasBase& canvasBase)
+{
+    return adoptRef(*new CanvasGradient(centerPoint, angleInRadians, canvasBase));
+}
+
</ins><span class="cx"> CanvasGradient::~CanvasGradient() = default;
</span><span class="cx"> 
</span><span class="cx"> ExceptionOr<void> CanvasGradient::addColorStop(float value, const String& colorString)
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlcanvasCanvasGradienth"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/canvas/CanvasGradient.h (277546 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/canvas/CanvasGradient.h        2021-05-15 20:22:37 UTC (rev 277546)
+++ trunk/Source/WebCore/html/canvas/CanvasGradient.h   2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -38,6 +38,7 @@
</span><span class="cx"> public:
</span><span class="cx">     static Ref<CanvasGradient> create(const FloatPoint& p0, const FloatPoint& p1, CanvasBase&);
</span><span class="cx">     static Ref<CanvasGradient> create(const FloatPoint& p0, float r0, const FloatPoint& p1, float r1, CanvasBase&);
</span><ins>+    static Ref<CanvasGradient> create(const FloatPoint& centerPoint, float angleInRadians, CanvasBase&);
</ins><span class="cx">     ~CanvasGradient();
</span><span class="cx"> 
</span><span class="cx">     Gradient& gradient() { return m_gradient; }
</span><span class="lines">@@ -48,6 +49,7 @@
</span><span class="cx"> private:
</span><span class="cx">     CanvasGradient(const FloatPoint& p0, const FloatPoint& p1, CanvasBase&);
</span><span class="cx">     CanvasGradient(const FloatPoint& p0, float r0, const FloatPoint& p1, float r1, CanvasBase&);
</span><ins>+    CanvasGradient(const FloatPoint& centerPoint, float angleInRadians, CanvasBase&);
</ins><span class="cx"> 
</span><span class="cx">     Ref<Gradient> m_gradient;
</span><span class="cx">     CanvasBase& m_canvas;
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlcanvasCanvasRenderingContext2DBasecpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/canvas/CanvasRenderingContext2DBase.cpp (277546 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/canvas/CanvasRenderingContext2DBase.cpp        2021-05-15 20:22:37 UTC (rev 277546)
+++ trunk/Source/WebCore/html/canvas/CanvasRenderingContext2DBase.cpp   2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -1951,6 +1951,14 @@
</span><span class="cx">     return CanvasGradient::create(FloatPoint(x0, y0), r0, FloatPoint(x1, y1), r1, canvasBase());
</span><span class="cx"> }
</span><span class="cx"> 
</span><ins>+ExceptionOr<Ref<CanvasGradient>> CanvasRenderingContext2DBase::createConicGradient(float angleInRadians, float x, float y)
+{
+    if (!std::isfinite(angleInRadians) || !std::isfinite(x) || !std::isfinite(y))
+        return Exception { NotSupportedError };
+
+    return CanvasGradient::create(FloatPoint(x, y), angleInRadians, canvasBase());
+}
+
</ins><span class="cx"> ExceptionOr<RefPtr<CanvasPattern>> CanvasRenderingContext2DBase::createPattern(CanvasImageSource&& image, const String& repetition)
</span><span class="cx"> {
</span><span class="cx">     bool repeatX, repeatY;
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlcanvasCanvasRenderingContext2DBaseh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/canvas/CanvasRenderingContext2DBase.h (277546 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/canvas/CanvasRenderingContext2DBase.h  2021-05-15 20:22:37 UTC (rev 277546)
+++ trunk/Source/WebCore/html/canvas/CanvasRenderingContext2DBase.h     2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -189,6 +189,7 @@
</span><span class="cx"> 
</span><span class="cx">     ExceptionOr<Ref<CanvasGradient>> createLinearGradient(float x0, float y0, float x1, float y1);
</span><span class="cx">     ExceptionOr<Ref<CanvasGradient>> createRadialGradient(float x0, float y0, float r0, float x1, float y1, float r1);
</span><ins>+    ExceptionOr<Ref<CanvasGradient>> createConicGradient(float angleInRadians, float x, float y);
</ins><span class="cx">     ExceptionOr<RefPtr<CanvasPattern>> createPattern(CanvasImageSource&&, const String& repetition);
</span><span class="cx"> 
</span><span class="cx">     RefPtr<ImageData> createImageData(ImageData&) const;
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/ChangeLog (277546 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/ChangeLog    2021-05-15 20:22:37 UTC (rev 277546)
+++ trunk/Source/WebInspectorUI/ChangeLog       2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -1,3 +1,16 @@
</span><ins>+2021-05-15  Said Abou-Hallawa  <said@apple.com>
+
+        Implement CanvasRenderingContext2D.createConicGradient
+        https://bugs.webkit.org/show_bug.cgi?id=225539
+
+        Reviewed by Sam Weinig.
+
+        * UserInterface/Models/NativeFunctionParameters.js:
+        * UserInterface/Models/Recording.js:
+        (WI.Recording.prototype.async swizzle):
+        * UserInterface/Views/RecordingActionTreeElement.js:
+        (WI.RecordingActionTreeElement._classNameForAction):
+
</ins><span class="cx"> 2021-05-10  Devin Rousso  <drousso@apple.com>
</span><span class="cx"> 
</span><span class="cx">         Web Inspector: Network: rename "XHR" to "XHR/Fetch"
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceModelsNativeFunctionParametersjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Models/NativeFunctionParameters.js (277546 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Models/NativeFunctionParameters.js     2021-05-15 20:22:37 UTC (rev 277546)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/NativeFunctionParameters.js        2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -646,6 +646,7 @@
</span><span class="cx">         clearRect: "x, y, width, height",
</span><span class="cx">         clip: "path, [winding]",
</span><span class="cx">         createImageData: "imagedata",
</span><ins>+        createConicGradient: "angle, x, y",
</ins><span class="cx">         createLinearGradient: "x0, y0, x1, y1",
</span><span class="cx">         createPattern: "canvas, repetitionType",
</span><span class="cx">         createRadialGradient: "x0, y0, r0, x1, y1, r1",
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceModelsRecordingjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Models/Recording.js (277546 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Models/Recording.js    2021-05-15 20:22:37 UTC (rev 277546)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/Recording.js       2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -408,7 +408,12 @@
</span><span class="cx">                     points = await Promise.all(points.map((item) => this.swizzle(item, WI.Recording.Swizzle.Number)));
</span><span class="cx"> 
</span><span class="cx">                     WI.ImageUtilities.scratchCanvasContext2D((context) => {
</span><del>-                        this._swizzle[index][type] = gradientType === "radial-gradient" ? context.createRadialGradient(...points) : context.createLinearGradient(...points);
</del><ins>+                        if (gradientType == "radial-gradient")
+                            this._swizzle[index][type] = context.createRadialGradient(...points);
+                        else if (gradientType == "linear-gradient")
+                            this._swizzle[index][type] = context.createLinearGradient(...points);
+                        else
+                            this._swizzle[index][type] = context.createConicGradient(...points);
</ins><span class="cx">                     });
</span><span class="cx"> 
</span><span class="cx">                     let stops = [];
</span><span class="lines">@@ -663,8 +668,10 @@
</span><span class="cx">                 lines.push(`    let gradient = null;`);
</span><span class="cx">                 lines.push(`    if (data.type === "radial-gradient")`);
</span><span class="cx">                 lines.push(`        gradient = context.createRadialGradient(data.points[0], data.points[1], data.points[2], data.points[3], data.points[4], data.points[5]);`);
</span><ins>+                lines.push(`    else if (data.type === "linear-gradient")`);
+                lines.push(`        gradient = context.createLinearGradient(data.points[0], data.points[1], data.points[2], data.points[3]);`);
</ins><span class="cx">                 lines.push(`    else`);
</span><del>-                lines.push(`        gradient = context.createLinearGradient(data.points[0], data.points[1], data.points[2], data.points[3]);`);
</del><ins>+                lines.push(`        gradient = context.createConicGradient(data.points[0], data.points[1], data.points[2]);`);
</ins><span class="cx">                 lines.push(`    for (let stop of data.stops)`);
</span><span class="cx">                 lines.push(`        gradient.addColorStop(stop.offset, stop.color);`);
</span><span class="cx">                 lines.push(`    objects[key] = gradient;`);
</span></span></pre></div>
<a id="trunkSourceWebInspectorUIUserInterfaceViewsRecordingActionTreeElementjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebInspectorUI/UserInterface/Views/RecordingActionTreeElement.js (277546 => 277547)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebInspectorUI/UserInterface/Views/RecordingActionTreeElement.js    2021-05-15 20:22:37 UTC (rev 277546)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RecordingActionTreeElement.js       2021-05-15 20:46:56 UTC (rev 277547)
</span><span class="lines">@@ -332,6 +332,7 @@
</span><span class="cx">         case "shadowOffsetY":
</span><span class="cx">             return "shadow";
</span><span class="cx"> 
</span><ins>+        case "createConicGradient":
</ins><span class="cx">         case "createLinearGradient":
</span><span class="cx">         case "createPattern":
</span><span class="cx">         case "createRadialGradient":
</span></span></pre>
</div>
</div>

</body>
</html>