Diff
Modified: trunk/LayoutTests/ChangeLog (236026 => 236027)
--- trunk/LayoutTests/ChangeLog 2018-09-15 00:22:46 UTC (rev 236026)
+++ trunk/LayoutTests/ChangeLog 2018-09-15 00:33:58 UTC (rev 236027)
@@ -1,3 +1,27 @@
+2018-09-14 Megan Gardner <[email protected]>
+
+ Additional tests for conic gradients
+ https://bugs.webkit.org/show_bug.cgi?id=189566
+
+ Reviewed by Simon Fraser.
+
+ Adding tests that actually test the gradient nature of gradients.
+ This is done by using an svg filter to consolidate the sections
+ of the gradient to sections we can actuall test the color of. Also,
+ the seams are clipped out, to reduce noise. Since gradients are
+ highly noise prone, this is the best way to check and make sure
+ that gradients are functional without sevear noise issues.
+
+ * TestExpectations:
+ * fast/gradients/conic-gradient-alpha-expected.html: Added.
+ * fast/gradients/conic-gradient-alpha.html: Added.
+ * fast/gradients/conic-gradient-expected.html: Added.
+ * fast/gradients/conic-gradient-extended-stops-expected.html: Added.
+ * fast/gradients/conic-gradient-extended-stops.html: Added.
+ * fast/gradients/conic-gradient.html: Added.
+ * platform/ios-12/TestExpectations:
+ * platform/mac/TestExpectations:
+
2018-09-14 Justin Fan <[email protected]>
WebGL 2 conformance: rgb-format-support.html
Modified: trunk/LayoutTests/TestExpectations (236026 => 236027)
--- trunk/LayoutTests/TestExpectations 2018-09-15 00:22:46 UTC (rev 236026)
+++ trunk/LayoutTests/TestExpectations 2018-09-15 00:33:58 UTC (rev 236027)
@@ -2243,5 +2243,8 @@
fast/gradients/conic-extended-stops.html [ Skip ]
fast/gradients/conic-from-angle.html [ Skip ]
fast/gradients/conic-repeating-last-stop.html [ Skip ]
+fast/gradients/conic-gradient-alpha.html [ Skip ]
+fast/gradients/conic-gradient-extended-stops.html [ Skip ]
+fast/gradients/conic-gradient.html [ Skip ]
webkit.org/b/187773 http/tests/webAPIStatistics [ Skip ]
Added: trunk/LayoutTests/fast/gradients/conic-gradient-alpha-expected.html (0 => 236027)
--- trunk/LayoutTests/fast/gradients/conic-gradient-alpha-expected.html (rev 0)
+++ trunk/LayoutTests/fast/gradients/conic-gradient-alpha-expected.html 2018-09-15 00:33:58 UTC (rev 236027)
@@ -0,0 +1,67 @@
+<html>
+<head>
+ <style>
+ div {
+ width: 200px;
+ height: 200px;
+ float: left;
+ }
+ /*tweak this until it's actually right... */
+ #topleft {
+ width: 0;
+ height: 0;
+ border-left: 100px solid rgb(64,87,64);
+ border-top: 100px solid rgb(32,32,32);
+ }
+ #topright {
+ width: 0;
+ height: 0;
+ border-right: 100px solid rgb(225,246,225);
+ border-top: 100px solid rgb(254,254,254);
+ }
+ #bottomleft {
+ clear: left;
+ width: 0;
+ height: 0;
+ border-left: 100px solid rgb(96,135,96);
+ border-bottom: 100px solid rgb(128,175,128);
+ }
+ #bottomright {
+ width: 0;
+ height: 0;
+ border-right: 100px solid rgb(193,231,193);
+ border-bottom: 100px solid rgb(160,207,160);
+ }
+ .box {
+ position: absolute;
+ }
+ .x {
+ position: absolute;
+ -webkit-clip-path: polygon(0% 0%, 0% 8%, 42% 50%, 0% 92%, 0% 100%, 8% 100%, 50% 58%, 92% 100%, 100% 100%, 100% 92%, 58% 50%, 100% 8%, 100% 0%, 92% 0%, 50% 42%, 8% 0%);
+ }
+ #x {
+ background-color:white;
+ }
+ .plus {
+ position: absolute;
+ -webkit-clip-path: polygon(45% 0%, 55% 0%, 55% 45%, 100% 45%, 100% 55%, 55% 55%, 55% 100%, 45% 100%, 45% 55%, 0% 55%, 0% 45%, 45% 45%);
+ }
+ #plus {
+ background-color:white;
+ }
+
+ </style>
+</head>
+<body>
+ <div>
+ <div class="box">
+ <div id="topleft"></div>
+ <div id="topright"></div>
+ <div id="bottomleft"></div>
+ <div id="bottomright"></div>
+ </div>
+ <div id="x" class="x"></div>
+ <div id="plus" class="plus"></div>
+ </div>
+</body>
+</html>
Added: trunk/LayoutTests/fast/gradients/conic-gradient-alpha.html (0 => 236027)
--- trunk/LayoutTests/fast/gradients/conic-gradient-alpha.html (rev 0)
+++ trunk/LayoutTests/fast/gradients/conic-gradient-alpha.html 2018-09-15 00:33:58 UTC (rev 236027)
@@ -0,0 +1,56 @@
+<html>
+<head>
+<style>
+ svg {
+ width: 800px;
+ display: none;
+ }
+ div {
+ width: 200px;
+ height: 200px;
+ }
+ #gradient {
+ position: absolute;
+ width: 200px;
+ height: 200px;
+ background-image: conic-gradient(rgba(0,255,0,0), black);
+ filter: url(#posterize);
+ }
+
+ .x {
+ position: absolute;
+ -webkit-clip-path: polygon(0% 0%, 0% 8%, 42% 50%, 0% 92%, 0% 100%, 8% 100%, 50% 58%, 92% 100%, 100% 100%, 100% 92%, 58% 50%, 100% 8%, 100% 0%, 92% 0%, 50% 42%, 8% 0%);
+ }
+ #x {
+ background-color:white;
+ }
+ .plus {
+ position: absolute;
+ -webkit-clip-path: polygon(45% 0%, 55% 0%, 55% 45%, 100% 45%, 100% 55%, 55% 55%, 55% 100%, 45% 100%, 45% 55%, 0% 55%, 0% 45%, 45% 45%);
+ }
+ #plus {
+ background-color:white;
+ }
+</style>
+</head>
+
+<body>
+<svg viewBox="0 0 700 100">
+<defs>
+ <filter id="posterize" filterUnits="objectBoundingBox" primitiveUnits="objectBoundingBox">
+ <feComponentTransfer>
+ <feFuncR type="discrete" tableValues="0 0.125 0.25 0.375 0.5 0.625 0.75 0.875"/>
+ <feFuncG type="discrete" tableValues="0 0.125 0.25 0.375 0.5 0.625 0.75 0.875"/>
+ <feFuncB type="discrete" tableValues="0 0.125 0.25 0.375 0.5 0.625 0.75 0.875"/>
+ <feFuncA type="discrete" tableValues="0 0.125 0.25 0.375 0.5 0.625 0.75 0.875"/>
+ </feComponentTransfer>
+ </filter>
+</defs>
+</svg>
+
+<div>
+ <div id="gradient"></div>
+ <div id="x" class="x"></div>
+ <div id="plus" class="plus"></div>
+</div>
+</html>
Added: trunk/LayoutTests/fast/gradients/conic-gradient-expected.html (0 => 236027)
--- trunk/LayoutTests/fast/gradients/conic-gradient-expected.html (rev 0)
+++ trunk/LayoutTests/fast/gradients/conic-gradient-expected.html 2018-09-15 00:33:58 UTC (rev 236027)
@@ -0,0 +1,66 @@
+<html>
+<head>
+ <style>
+ div {
+ width: 200px;
+ height: 200px;
+ float: left;
+ }
+ #topleft {
+ width: 0;
+ height: 0;
+ border-left: 100px solid rgb(0,32,0);
+ border-top: 100px solid rgb(0,0,0);
+ }
+ #topright {
+ width: 0;
+ height: 0;
+ border-right: 100px solid rgb(0,192,0);
+ border-top: 100px solid rgb(0,224,0);
+ }
+ #bottomleft {
+ clear: left;
+ width: 0;
+ height: 0;
+ border-left: 100px solid rgb(0,64,0);
+ border-bottom: 100px solid rgb(0,96,0);
+ }
+ #bottomright {
+ width: 0;
+ height: 0;
+ border-right: 100px solid rgb(0,160,0);
+ border-bottom: 100px solid rgb(0,128,0);
+ }
+ .box {
+ position: absolute;
+ }
+ .x {
+ position: absolute;
+ -webkit-clip-path: polygon(0% 0%, 0% 5%, 45% 50%, 0% 95%, 0% 100%, 5% 100%, 50% 55%, 95% 100%, 100% 100%, 100% 95%, 55% 50%, 100% 5%, 100% 0%, 95% 0%, 50% 45%, 5% 0%);
+ }
+ #x {
+ background-color:black;
+ }
+ .plus {
+ position: absolute;
+ -webkit-clip-path: polygon(45% 0%, 55% 0%, 55% 45%, 100% 45%, 100% 55%, 55% 55%, 55% 100%, 45% 100%, 45% 55%, 0% 55%, 0% 45%, 45% 45%);
+ }
+ #plus {
+ background-color:black;
+ }
+
+ </style>
+</head>
+<body>
+ <div>
+ <div class="box">
+ <div id="topleft"></div>
+ <div id="topright"></div>
+ <div id="bottomleft"></div>
+ <div id="bottomright"></div>
+ </div>
+ <div id="x" class="x"></div>
+ <div id="plus" class="plus"></div>
+ </div>
+</body>
+</html>
Added: trunk/LayoutTests/fast/gradients/conic-gradient-extended-stops-expected.html (0 => 236027)
--- trunk/LayoutTests/fast/gradients/conic-gradient-extended-stops-expected.html (rev 0)
+++ trunk/LayoutTests/fast/gradients/conic-gradient-extended-stops-expected.html 2018-09-15 00:33:58 UTC (rev 236027)
@@ -0,0 +1,66 @@
+<html>
+<head>
+ <style>
+ div {
+ width: 200px;
+ height: 200px;
+ float: left;
+ }
+ #topleft {
+ width: 0;
+ height: 0;
+ border-left: 100px solid rgb(0,80,0);
+ border-top: 100px solid rgb(0,64,0);
+ }
+ #topright {
+ width: 0;
+ height: 0;
+ border-right: 100px solid rgb(0,160,0);
+ border-top: 100px solid rgb(0,176,0);
+ }
+ #bottomleft {
+ clear: left;
+ width: 0;
+ height: 0;
+ border-left: 100px solid rgb(0,96,0);
+ border-bottom: 100px solid rgb(0,112,0);
+ }
+ #bottomright {
+ width: 0;
+ height: 0;
+ border-right: 100px solid rgb(0,144,0);
+ border-bottom: 100px solid rgb(0,128,0);
+ }
+ .box {
+ position: absolute;
+ }
+ .x {
+ position: absolute;
+ -webkit-clip-path: polygon(0% 0%, 0% 5%, 45% 50%, 0% 95%, 0% 100%, 5% 100%, 50% 55%, 95% 100%, 100% 100%, 100% 95%, 55% 50%, 100% 5%, 100% 0%, 95% 0%, 50% 45%, 5% 0%);
+ }
+ #x {
+ background-color:black;
+ }
+ .plus {
+ position: absolute;
+ -webkit-clip-path: polygon(45% 0%, 55% 0%, 55% 45%, 100% 45%, 100% 55%, 55% 55%, 55% 100%, 45% 100%, 45% 55%, 0% 55%, 0% 45%, 45% 45%);
+ }
+ #plus {
+ background-color:black;
+ }
+
+ </style>
+</head>
+<body>
+ <div>
+ <div class="box">
+ <div id="topleft"></div>
+ <div id="topright"></div>
+ <div id="bottomleft"></div>
+ <div id="bottomright"></div>
+ </div>
+ <div id="x" class="x"></div>
+ <div id="plus" class="plus"></div>
+ </div>
+</body>
+</html>
Added: trunk/LayoutTests/fast/gradients/conic-gradient-extended-stops.html (0 => 236027)
--- trunk/LayoutTests/fast/gradients/conic-gradient-extended-stops.html (rev 0)
+++ trunk/LayoutTests/fast/gradients/conic-gradient-extended-stops.html 2018-09-15 00:33:58 UTC (rev 236027)
@@ -0,0 +1,55 @@
+<html>
+<head>
+<style>
+ svg {
+ width: 800px;
+ display: none;
+ }
+ div {
+ width: 200px;
+ height: 200px;
+ }
+ #gradient {
+ position: absolute;
+ width: 200px;
+ height: 200px;
+ background-image: conic-gradient(lime -180deg, black 540deg);
+ filter: url(#posterize);
+ }
+
+ .x {
+ position: absolute;
+ -webkit-clip-path: polygon(0% 0%, 0% 5%, 45% 50%, 0% 95%, 0% 100%, 5% 100%, 50% 55%, 95% 100%, 100% 100%, 100% 95%, 55% 50%, 100% 5%, 100% 0%, 95% 0%, 50% 45%, 5% 0%);
+ }
+ #x {
+ background-color:black;
+ }
+ .plus {
+ position: absolute;
+ -webkit-clip-path: polygon(45% 0%, 55% 0%, 55% 45%, 100% 45%, 100% 55%, 55% 55%, 55% 100%, 45% 100%, 45% 55%, 0% 55%, 0% 45%, 45% 45%);
+ }
+ #plus {
+ background-color:black;
+ }
+</style>
+</head>
+
+<body>
+<svg viewBox="0 0 700 100">
+<defs>
+ <filter id="posterize" filterUnits="objectBoundingBox" primitiveUnits="objectBoundingBox">
+ <feComponentTransfer>
+ <feFuncR type="discrete" tableValues="0 0.0625 0.125 0.1875 0.25 0.3125 0.375 0.4375 0.5 0.5625 0.625 0.6875 0.75 0.8125 0.875 0.9375"/>
+ <feFuncG type="discrete" tableValues="0 0.0625 0.125 0.1875 0.25 0.3125 0.375 0.4375 0.5 0.5625 0.625 0.6875 0.75 0.8125 0.875 0.9375"/>
+ <feFuncB type="discrete" tableValues="0 0.0625 0.125 0.1875 0.25 0.3125 0.375 0.4375 0.5 0.5625 0.625 0.6875 0.75 0.8125 0.875 0.9375"/>
+ </feComponentTransfer>
+ </filter>
+</defs>
+</svg>
+
+<div>
+ <div id="gradient"></div>
+ <div id="x" class="x"></div>
+ <div id="plus" class="plus"></div>
+</div>
+</html>
Added: trunk/LayoutTests/fast/gradients/conic-gradient.html (0 => 236027)
--- trunk/LayoutTests/fast/gradients/conic-gradient.html (rev 0)
+++ trunk/LayoutTests/fast/gradients/conic-gradient.html 2018-09-15 00:33:58 UTC (rev 236027)
@@ -0,0 +1,55 @@
+<html>
+<head>
+<style>
+ svg {
+ width: 800px;
+ display: none;
+ }
+ div {
+ width: 200px;
+ height: 200px;
+ }
+ #gradient {
+ position: absolute;
+ width: 200px;
+ height: 200px;
+ background-image: conic-gradient(lime, black);
+ filter: url(#posterize);
+ }
+
+ .x {
+ position: absolute;
+ -webkit-clip-path: polygon(0% 0%, 0% 5%, 45% 50%, 0% 95%, 0% 100%, 5% 100%, 50% 55%, 95% 100%, 100% 100%, 100% 95%, 55% 50%, 100% 5%, 100% 0%, 95% 0%, 50% 45%, 5% 0%);
+ }
+ #x {
+ background-color:black;
+ }
+ .plus {
+ position: absolute;
+ -webkit-clip-path: polygon(45% 0%, 55% 0%, 55% 45%, 100% 45%, 100% 55%, 55% 55%, 55% 100%, 45% 100%, 45% 55%, 0% 55%, 0% 45%, 45% 45%);
+ }
+ #plus {
+ background-color:black;
+ }
+</style>
+</head>
+
+<body>
+<svg viewBox="0 0 700 100">
+<defs>
+ <filter id="posterize" filterUnits="objectBoundingBox" primitiveUnits="objectBoundingBox">
+ <feComponentTransfer>
+ <feFuncR type="discrete" tableValues="0 0.125 0.25 0.375 0.5 0.625 0.75 0.875"/>
+ <feFuncG type="discrete" tableValues="0 0.125 0.25 0.375 0.5 0.625 0.75 0.875"/>
+ <feFuncB type="discrete" tableValues="0 0.125 0.25 0.375 0.5 0.625 0.75 0.875"/>
+ </feComponentTransfer>
+ </filter>
+</defs>
+</svg>
+
+<div>
+ <div id="gradient"></div>
+ <div id="x" class="x"></div>
+ <div id="plus" class="plus"></div>
+</div>
+</html>
Modified: trunk/LayoutTests/platform/ios-12/TestExpectations (236026 => 236027)
--- trunk/LayoutTests/platform/ios-12/TestExpectations 2018-09-15 00:22:46 UTC (rev 236026)
+++ trunk/LayoutTests/platform/ios-12/TestExpectations 2018-09-15 00:33:58 UTC (rev 236027)
@@ -34,3 +34,7 @@
fast/gradients/conic-extended-stops.html [ Pass ]
fast/gradients/conic-from-angle.html [ Pass ]
fast/gradients/conic-repeating-last-stop.html [ Pass ]
+fast/gradients/conic-gradient-alpha.html [ Pass ]
+fast/gradients/conic-gradient-extended-stops.html [ Pass ]
+fast/gradients/conic-gradient.html [ Pass ]
+
Modified: trunk/LayoutTests/platform/mac/TestExpectations (236026 => 236027)
--- trunk/LayoutTests/platform/mac/TestExpectations 2018-09-15 00:22:46 UTC (rev 236026)
+++ trunk/LayoutTests/platform/mac/TestExpectations 2018-09-15 00:33:58 UTC (rev 236027)
@@ -1764,5 +1764,8 @@
[ Mojave+ ] fast/gradients/conic-extended-stops.html [ Pass ]
[ Mojave+ ] fast/gradients/conic-from-angle.html [ Pass ]
[ Mojave+ ] fast/gradients/conic-repeating-last-stop.html [ Pass ]
+[ Mojave+ ] fast/gradients/conic-gradient-alpha.html [ Pass ]
+[ Mojave+ ] fast/gradients/conic-gradient-extended-stops.html [ Pass ]
+[ Mojave+ ] fast/gradients/conic-gradient.html [ Pass ]