diff options
Diffstat (limited to 'testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles')
336 files changed, 8400 insertions, 0 deletions
diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.CSSHSL.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.CSSHSL.html new file mode 100644 index 0000000000..481d6fe9e5 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.CSSHSL.html @@ -0,0 +1,50 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.CSSHSL</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.CSSHSL</h1> +<p class="desc">CSSHSL works as color input</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("CSSHSL works as color input"); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = new CSSHSL(CSS.deg(180), 0.5, 0.5); + ctx.fillRect(0, 0, 100, 50); + _assertPixelApprox(canvas, 50,25, 64,191,191,255, 3); + + const color = new CSSHSL(CSS.deg(180), 1, 1); + ctx.fillStyle = color; + _assertSame(ctx.fillStyle, '#ffffff', "ctx.fillStyle", "'#ffffff'"); + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 255,255,255,255); + color.l = 0.5; + ctx.fillStyle = color; + _assertSame(ctx.fillStyle, '#00ffff', "ctx.fillStyle", "'#00ffff'"); + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,255,255); + + ctx.fillStyle = new CSSRGB(1, 0, 1).toHSL(); + _assertSame(ctx.fillStyle, '#ff00ff', "ctx.fillStyle", "'#ff00ff'"); + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 255,0,255,255); + + color.h = CSS.deg(120); + color.s = 1; + color.l = 0.5; + ctx.fillStyle = color; + ctx.fillRect(0, 0, 100, 50); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.CSSRGB.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.CSSRGB.html new file mode 100644 index 0000000000..cfdb603d5d --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.CSSRGB.html @@ -0,0 +1,59 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.CSSRGB</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.CSSRGB</h1> +<p class="desc">CSSRGB works as color input</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("CSSRGB works as color input"); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = new CSSRGB(1, 0, 1); + _assertSame(ctx.fillStyle, '#ff00ff', "ctx.fillStyle", "'#ff00ff'"); + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 255,0,255,255); + + const color = new CSSRGB(0, CSS.percent(50), 0); + ctx.fillStyle = color; + _assertSame(ctx.fillStyle, '#008000', "ctx.fillStyle", "'#008000'"); + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,128,0,255); + color.g = 0; + ctx.fillStyle = color; + _assertSame(ctx.fillStyle, '#000000', "ctx.fillStyle", "'#000000'"); + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,0,0,255); + + color.alpha = 0; + ctx.fillStyle = color; + _assertSame(ctx.fillStyle, 'rgba(0, 0, 0, 0)', "ctx.fillStyle", "'rgba(0, 0, 0, 0)'"); + ctx.reset(); + color.alpha = 0.5; + ctx.fillStyle = color; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,0,0,128); + + ctx.fillStyle = new CSSHSL(CSS.deg(0), 1, 1).toRGB(); + _assertSame(ctx.fillStyle, '#ffffff', "ctx.fillStyle", "'#ffffff'"); + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 255,255,255,255); + + color.alpha = 1; + color.g = 1; + ctx.fillStyle = color; + ctx.fillRect(0, 0, 100, 50); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.colorObject.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.colorObject.html new file mode 100644 index 0000000000..ae6507350c --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.colorObject.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.colorObject</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.colorObject</h1> +<p class="desc">ctx.fillStyle works with color objects</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("ctx.fillStyle works with color objects"); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = {r: 1, g: 0, b: 0}; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 255,0,0,255); + ctx.fillStyle = {r: 0, g: 0, b: 1}; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,0,255,255); + ctx.fillStyle = {r: 0.2, g: 0.4, b: 0.6}; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 51,102,153,255); + ctx.fillStyle = {r: 0, g: 1, b: 0}; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + ctx.fillStyle = {r: -1, g: 0, b: 0}; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,0,0,255); + ctx.fillStyle = {r: 0, g: 2, b: 0}; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.colorObject.transparency.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.colorObject.transparency.html new file mode 100644 index 0000000000..b48715f093 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.colorObject.transparency.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.colorObject.transparency</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.colorObject.transparency</h1> +<p class="desc">ctx.fillStyle with color objects has transparency</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("ctx.fillStyle with color objects has transparency"); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = {r: 0, g: 1, b: 0, a: 0}; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,0,0,0); + ctx.clearRect(0, 0, 100, 50); + ctx.fillStyle = {r: 0, g: 1, b: 0, a: -1}; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,0,0,0); + ctx.clearRect(0, 0, 100, 50); + ctx.fillStyle = {r: 0, g: 1, b: 0, a: 0.5}; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,128); + ctx.clearRect(0, 0, 100, 50); + ctx.fillStyle = {r: 0, g: 1, b: 0, a: 1}; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.colormix.currentcolor.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.colormix.currentcolor.html new file mode 100644 index 0000000000..191395a20b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.colormix.currentcolor.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.colormix.currentcolor</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.colormix.currentcolor</h1> +<p class="desc">color-mix works as color input with currentcolor</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test("color-mix works as color input with currentcolor"); +_addTest(function(canvas, ctx) { + + canvas.setAttribute('style', 'color: magenta'); + ctx.fillStyle = "color-mix(in srgb, black, currentcolor)"; + _assertSame(ctx.fillStyle, 'color(srgb 0.5 0 0.5)', "ctx.fillStyle", "'color(srgb 0.5 0 0.5)'"); + ctx.strokeStyle = "color-mix(in srgb, black, currentcolor)"; + _assertSame(ctx.strokeStyle, 'color(srgb 0.5 0 0.5)', "ctx.strokeStyle", "'color(srgb 0.5 0 0.5)'"); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.colormix.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.colormix.html new file mode 100644 index 0000000000..1faa6c0a9f --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.colormix.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.colormix</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.colormix</h1> +<p class="desc">color-mix works as color input</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test("color-mix works as color input"); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = "color-mix(in srgb, red, blue)"; + _assertSame(ctx.fillStyle, 'color(srgb 0.5 0 0.5)', "ctx.fillStyle", "'color(srgb 0.5 0 0.5)'"); + ctx.fillStyle = "color-mix(in srgb, red, color(srgb 1 0 0))"; + _assertSame(ctx.fillStyle, 'color(srgb 1 0 0)', "ctx.fillStyle", "'color(srgb 1 0 0)'"); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.default.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.default.html new file mode 100644 index 0000000000..1bd3e2d4ad --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.default.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.default</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.default</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + _assertSame(ctx.fillStyle, '#000000', "ctx.fillStyle", "'#000000'"); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.get.halftransparent.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.get.halftransparent.html new file mode 100644 index 0000000000..423293e1b6 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.get.halftransparent.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.get.halftransparent</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.get.halftransparent</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = 'rgba(255,255,255,0.5)'; + _assertSame(ctx.fillStyle, 'rgba(255, 255, 255, 0.5)', "ctx.fillStyle", "'rgba(255, 255, 255, 0.5)'"); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.get.semitransparent.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.get.semitransparent.html new file mode 100644 index 0000000000..ec63d7662d --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.get.semitransparent.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.get.semitransparent</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.get.semitransparent</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = 'rgba(255,255,255,0.45)'; + assert_regexp_match(ctx.fillStyle, /^rgba\(255, 255, 255, 0\.4\d+\)$/); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.get.solid.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.get.solid.html new file mode 100644 index 0000000000..bcdd57a7ca --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.get.solid.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.get.solid</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.get.solid</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#fa0'; + _assertSame(ctx.fillStyle, '#ffaa00', "ctx.fillStyle", "'#ffaa00'"); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.get.transparent.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.get.transparent.html new file mode 100644 index 0000000000..21931aaf23 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.get.transparent.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.get.transparent</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.get.transparent</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = 'rgba(0,0,0,0)'; + _assertSame(ctx.fillStyle, 'rgba(0, 0, 0, 0)', "ctx.fillStyle", "'rgba(0, 0, 0, 0)'"); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.invalidstring.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.invalidstring.html new file mode 100644 index 0000000000..9fb83063f6 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.invalidstring.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.invalidstring</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.invalidstring</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + ctx.fillStyle = '#0f0'; + ctx.fillStyle = 'invalid'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.invalidtype.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.invalidtype.html new file mode 100644 index 0000000000..84d8fbd3ff --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.invalidtype.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.invalidtype</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.invalidtype</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + ctx.fillStyle = '#0f0'; + ctx.fillStyle = null; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-1.html new file mode 100644 index 0000000000..87b5bc9371 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-hsl-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-hsl-1</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-hsl-1.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(120 100.0% 50.0%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-1.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-1.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-1.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-2.html new file mode 100644 index 0000000000..746c358dbb --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-hsl-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-hsl-2</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-hsl-2.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(120 100.0% 50.0% / 0.2)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,51); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-2.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-2.png Binary files differnew file mode 100644 index 0000000000..c5661de82b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-2.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-3.html new file mode 100644 index 0000000000..b8a9cd5a09 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-hsl-3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-hsl-3</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-hsl-3.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(120.0, 100.0%, 50.0%, 0.2)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,51); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-3.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-3.png Binary files differnew file mode 100644 index 0000000000..c5661de82b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-3.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-4.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-4.html new file mode 100644 index 0000000000..d5e58b9321 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-hsl-4</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-hsl-4</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-hsl-4.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(120.0, 100.0%, 50.0%, 20%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,51); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-4.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-4.png Binary files differnew file mode 100644 index 0000000000..c5661de82b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-4.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-5.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-5.html new file mode 100644 index 0000000000..85bbb802b5 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-5.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-hsl-5</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-hsl-5</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-hsl-5.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(120deg, 100.0%, 50.0%, 0.2)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,51); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-5.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-5.png Binary files differnew file mode 100644 index 0000000000..c5661de82b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-5.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-6.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-6.html new file mode 100644 index 0000000000..154bdcd49a --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-6.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-hsl-6</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-hsl-6</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-hsl-6.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(120deg, 100.0%, 50.0%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-6.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-6.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-6.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-7.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-7.html new file mode 100644 index 0000000000..5cf81e41a1 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-7.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-hsl-7</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-hsl-7</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-hsl-7.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(133.33333333grad, 100.0%, 50.0%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-7.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-7.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-7.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-8.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-8.html new file mode 100644 index 0000000000..17d0782df1 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-8.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-hsl-8</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-hsl-8</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-hsl-8.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(2.0943951024rad, 100.0%, 50.0%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-8.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-8.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-8.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-9.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-9.html new file mode 100644 index 0000000000..2f4b1e8e1a --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-9.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-hsl-9</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-hsl-9</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-hsl-9.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(0.3333333333turn, 100.0%, 50.0%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-9.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-9.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsl-9.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-1.html new file mode 100644 index 0000000000..bc70e21d62 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-hsla-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-hsla-1</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-hsla-1.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(120 100.0% 50.0%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-1.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-1.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-1.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-2.html new file mode 100644 index 0000000000..7f77498531 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-hsla-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-hsla-2</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-hsla-2.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(120 100.0% 50.0% / 0.2)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,51); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-2.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-2.png Binary files differnew file mode 100644 index 0000000000..c5661de82b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-2.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-3.html new file mode 100644 index 0000000000..c33a50a946 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-hsla-3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-hsla-3</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-hsla-3.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(120.0, 100.0%, 50.0%, 0.2)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,51); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-3.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-3.png Binary files differnew file mode 100644 index 0000000000..c5661de82b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-3.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-4.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-4.html new file mode 100644 index 0000000000..3d0cafc66b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-hsla-4</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-hsla-4</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-hsla-4.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(120.0, 100.0%, 50.0%, 20%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,51); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-4.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-4.png Binary files differnew file mode 100644 index 0000000000..c5661de82b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-4.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-5.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-5.html new file mode 100644 index 0000000000..a70613b49f --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-5.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-hsla-5</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-hsla-5</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-hsla-5.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(120deg, 100.0%, 50.0%, 0.2)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,51); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-5.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-5.png Binary files differnew file mode 100644 index 0000000000..c5661de82b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-5.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-6.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-6.html new file mode 100644 index 0000000000..8c46d887ba --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-6.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-hsla-6</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-hsla-6</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-hsla-6.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(120deg, 100.0%, 50.0%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-6.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-6.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-6.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-7.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-7.html new file mode 100644 index 0000000000..b6b4760086 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-7.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-hsla-7</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-hsla-7</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-hsla-7.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(133.33333333grad, 100.0%, 50.0%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-7.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-7.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-7.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-8.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-8.html new file mode 100644 index 0000000000..7933d47fd2 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-8.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-hsla-8</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-hsla-8</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-hsla-8.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(2.0943951024rad, 100.0%, 50.0%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-8.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-8.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-8.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-9.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-9.html new file mode 100644 index 0000000000..8a4e29d40e --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-9.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-hsla-9</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-hsla-9</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-hsla-9.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(0.3333333333turn, 100.0%, 50.0%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-9.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-9.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-hsla-9.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-1.html new file mode 100644 index 0000000000..632b7f57fb --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-rgb-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-rgb-1</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-rgb-1.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgb(0, 255.0, 0)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-1.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-1.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-1.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-2.html new file mode 100644 index 0000000000..1d3e683b35 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-rgb-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-rgb-2</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-rgb-2.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgb(0, 255, 0, 0.2)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,51); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-2.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-2.png Binary files differnew file mode 100644 index 0000000000..c5661de82b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-2.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-3.html new file mode 100644 index 0000000000..8a6f352350 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-rgb-3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-rgb-3</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-rgb-3.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgb(0, 255, 0, 20%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,51); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-3.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-3.png Binary files differnew file mode 100644 index 0000000000..c5661de82b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-3.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-4.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-4.html new file mode 100644 index 0000000000..1fdf9ecf92 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-rgb-4</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-rgb-4</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-rgb-4.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgb(0 255 0)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-4.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-4.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-4.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-5.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-5.html new file mode 100644 index 0000000000..a1d99d5e24 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-5.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-rgb-5</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-rgb-5</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-rgb-5.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgb(0 255 0 / 0.2)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,51); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-5.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-5.png Binary files differnew file mode 100644 index 0000000000..c5661de82b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-5.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-6.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-6.html new file mode 100644 index 0000000000..ad2c5f5484 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-6.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-rgb-6</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-rgb-6</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-rgb-6.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgb(0 255 0 / 20%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,51); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-6.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-6.png Binary files differnew file mode 100644 index 0000000000..c5661de82b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgb-6.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-1.html new file mode 100644 index 0000000000..f394dbfb2f --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-rgba-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-rgba-1</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-rgba-1.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgba(0, 255.0, 0)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-1.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-1.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-1.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-2.html new file mode 100644 index 0000000000..5529bc1462 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-rgba-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-rgba-2</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-rgba-2.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgba(0, 255, 0, 0.2)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,51); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-2.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-2.png Binary files differnew file mode 100644 index 0000000000..c5661de82b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-2.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-3.html new file mode 100644 index 0000000000..82047a5698 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-rgba-3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-rgba-3</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-rgba-3.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgba(0, 255, 0, 20%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,51); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-3.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-3.png Binary files differnew file mode 100644 index 0000000000..c5661de82b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-3.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-4.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-4.html new file mode 100644 index 0000000000..5fea546f10 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-rgba-4</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-rgba-4</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-rgba-4.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgba(0 255 0)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-4.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-4.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-4.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-5.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-5.html new file mode 100644 index 0000000000..d048566522 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-5.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-rgba-5</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-rgba-5</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-rgba-5.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgba(0 255 0 / 0.2)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,51); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-5.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-5.png Binary files differnew file mode 100644 index 0000000000..c5661de82b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-5.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-6.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-6.html new file mode 100644 index 0000000000..28feb2eb17 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-6.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.css-color-4-rgba-6</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.css-color-4-rgba-6</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.css-color-4-rgba-6.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgba(0 255 0 / 20%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,51); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-6.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-6.png Binary files differnew file mode 100644 index 0000000000..c5661de82b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.css-color-4-rgba-6.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.current.basic.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.current.basic.html new file mode 100644 index 0000000000..a1481e36e1 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.current.basic.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.current.basic</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.current.basic</h1> +<p class="desc">currentColor is computed from the canvas element</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("currentColor is computed from the canvas element"); +_addTest(function(canvas, ctx) { + + canvas.setAttribute('style', 'color: #0f0'); + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'currentColor'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.current.changed.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.current.changed.html new file mode 100644 index 0000000000..2f4d0fe4f0 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.current.changed.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.current.changed</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.current.changed</h1> +<p class="desc">currentColor is computed when the attribute is set, not when it is painted</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("currentColor is computed when the attribute is set, not when it is painted"); +_addTest(function(canvas, ctx) { + + canvas.setAttribute('style', 'color: #0f0'); + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'currentColor'; + canvas.setAttribute('style', 'color: #f00'); + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.current.removed.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.current.removed.html new file mode 100644 index 0000000000..96b070c8c1 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.current.removed.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.current.removed</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.current.removed</h1> +<p class="desc">currentColor is solid black when the canvas element is not in a document</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.current.removed.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("currentColor is solid black when the canvas element is not in a document"); +_addTest(function(canvas, ctx) { + + // Try not to let it undetectably incorrectly pick up opaque-black + // from other parts of the document: + document.body.parentNode.setAttribute('style', 'color: #f00'); + document.body.setAttribute('style', 'color: #f00'); + canvas.setAttribute('style', 'color: #f00'); + + var canvas2 = document.createElement('canvas'); + var ctx2 = canvas2.getContext('2d'); + ctx2.fillStyle = '#f00'; + ctx2.fillStyle = 'currentColor'; + ctx2.fillRect(0, 0, 100, 50); + ctx.drawImage(canvas2, 0, 0); + + document.body.parentNode.removeAttribute('style'); + document.body.removeAttribute('style'); + + _assertPixel(canvas, 50,25, 0,0,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.current.removed.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.current.removed.png Binary files differnew file mode 100644 index 0000000000..d638d03386 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.current.removed.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex3.html new file mode 100644 index 0000000000..017bfc88c2 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hex3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hex3</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hex3.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex3.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex3.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex3.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex4.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex4.html new file mode 100644 index 0000000000..c8704edbb2 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hex4</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hex4</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hex4.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = '#0f0f'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex4.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex4.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex4.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex6.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex6.html new file mode 100644 index 0000000000..9644a46a0c --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex6.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hex6</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hex6</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hex6.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = '#00fF00'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex6.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex6.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex6.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex8.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex8.html new file mode 100644 index 0000000000..b2dd06982d --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex8.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hex8</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hex8</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hex8.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = '#00ff00ff'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex8.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex8.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hex8.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-1.html new file mode 100644 index 0000000000..ceb3da52e0 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hsl-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hsl-1</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hsl-1.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(120, 100%, 50%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-1.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-1.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-1.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-2.html new file mode 100644 index 0000000000..22e67e33d4 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hsl-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hsl-2</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hsl-2.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl( -240 , 100% , 50% )'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-2.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-2.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-2.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-3.html new file mode 100644 index 0000000000..e182952fbf --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hsl-3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hsl-3</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hsl-3.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(360120, 100%, 50%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-3.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-3.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-3.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-4.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-4.html new file mode 100644 index 0000000000..b320c1c98b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hsl-4</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hsl-4</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hsl-4.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(-360240, 100%, 50%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-4.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-4.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-4.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-5.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-5.html new file mode 100644 index 0000000000..1264f626de --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-5.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hsl-5</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hsl-5</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hsl-5.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(120.0, 100.0%, 50.0%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-5.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-5.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-5.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-6.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-6.html new file mode 100644 index 0000000000..e0fc787559 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-6.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hsl-6</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hsl-6</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hsl-6.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(+120, +100%, +50%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-6.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-6.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-6.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-1.html new file mode 100644 index 0000000000..59d66c383c --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hsl-clamp-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hsl-clamp-1</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hsl-clamp-1.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(120, 200%, 50%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-1.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-1.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-1.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-2.html new file mode 100644 index 0000000000..1a1939e47a --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hsl-clamp-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hsl-clamp-2</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hsl-clamp-2.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(120, -200%, 49.9%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 127,127,127,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-2.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-2.png Binary files differnew file mode 100644 index 0000000000..88fd827985 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-2.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-3.html new file mode 100644 index 0000000000..56f3a0a8b5 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hsl-clamp-3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hsl-clamp-3</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hsl-clamp-3.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(120, 100%, 200%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 255,255,255,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-3.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-3.png Binary files differnew file mode 100644 index 0000000000..bf48767a88 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-3.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-4.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-4.html new file mode 100644 index 0000000000..af9d11e678 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hsl-clamp-4</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hsl-clamp-4</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hsl-clamp-4.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsl(120, 100%, -200%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,0,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-4.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-4.png Binary files differnew file mode 100644 index 0000000000..d638d03386 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsl-clamp-4.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-1.html new file mode 100644 index 0000000000..dbc738ffa7 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hsla-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hsla-1</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hsla-1.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsla(120, 100%, 50%, 0.499)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,127); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-1.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-1.png Binary files differnew file mode 100644 index 0000000000..2aa6265f06 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-1.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-2.html new file mode 100644 index 0000000000..aa21789b02 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hsla-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hsla-2</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hsla-2.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsla( 120.0 , 100.0% , 50.0% , 1 )'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-2.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-2.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-2.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-1.html new file mode 100644 index 0000000000..2acac26e1a --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hsla-clamp-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hsla-clamp-1</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hsla-clamp-1.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsla(120, 200%, 50%, 1)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-1.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-1.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-1.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-2.html new file mode 100644 index 0000000000..0f32fb5474 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hsla-clamp-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hsla-clamp-2</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hsla-clamp-2.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsla(120, -200%, 49.9%, 1)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 127,127,127,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-2.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-2.png Binary files differnew file mode 100644 index 0000000000..88fd827985 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-2.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-3.html new file mode 100644 index 0000000000..4bc134aec5 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hsla-clamp-3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hsla-clamp-3</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hsla-clamp-3.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsla(120, 100%, 200%, 1)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 255,255,255,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-3.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-3.png Binary files differnew file mode 100644 index 0000000000..bf48767a88 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-3.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-4.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-4.html new file mode 100644 index 0000000000..f8b2382755 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hsla-clamp-4</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hsla-clamp-4</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hsla-clamp-4.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsla(120, 100%, -200%, 1)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,0,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-4.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-4.png Binary files differnew file mode 100644 index 0000000000..d638d03386 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-4.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-5.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-5.html new file mode 100644 index 0000000000..9c5e2258b9 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-5.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hsla-clamp-5</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hsla-clamp-5</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hsla-clamp-5.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsla(120, 100%, 50%, 2)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-5.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-5.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-5.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-6.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-6.html new file mode 100644 index 0000000000..153515eedd --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-6.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.hsla-clamp-6</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.hsla-clamp-6</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.hsla-clamp-6.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'hsla(120, 100%, 0%, -2)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,0,0,0); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-6.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-6.png Binary files differnew file mode 100644 index 0000000000..eeedd0ff05 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.hsla-clamp-6.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.html4.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.html4.html new file mode 100644 index 0000000000..65d0d2020c --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.html4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.html4</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.html4</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.html4.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'limE'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.html4.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.html4.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.html4.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsl-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsl-1.html new file mode 100644 index 0000000000..4046f825a1 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsl-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.css-color-4-hsl-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.css-color-4-hsl-1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'hsl(0, 100%, 50% / 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsl-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsl-2.html new file mode 100644 index 0000000000..2075f8e459 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsl-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.css-color-4-hsl-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.css-color-4-hsl-2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'hsl(0 100% 50%, 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsl-3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsl-3.html new file mode 100644 index 0000000000..53bbf6c7ee --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsl-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.css-color-4-hsl-3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.css-color-4-hsl-3</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'hsl(0, 100% 50%)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsl-4.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsl-4.html new file mode 100644 index 0000000000..e8be93b59d --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsl-4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.css-color-4-hsl-4</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.css-color-4-hsl-4</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'hsl(0 100% 50% /)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsl-5.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsl-5.html new file mode 100644 index 0000000000..b8938adeb2 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsl-5.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.css-color-4-hsl-5</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.css-color-4-hsl-5</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'hsl(0, 100%, 50% /)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsla-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsla-1.html new file mode 100644 index 0000000000..7104ca6a84 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsla-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.css-color-4-hsla-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.css-color-4-hsla-1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'hsla(0, 100%, 50% / 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsla-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsla-2.html new file mode 100644 index 0000000000..c340e7445d --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsla-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.css-color-4-hsla-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.css-color-4-hsla-2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'hsla(0 100% 50%, 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsla-3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsla-3.html new file mode 100644 index 0000000000..3f94ec16ff --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-hsla-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.css-color-4-hsla-3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.css-color-4-hsla-3</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'hsla(0, 100% 50%)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgb-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgb-1.html new file mode 100644 index 0000000000..69503593fe --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgb-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.css-color-4-rgb-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.css-color-4-rgb-1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'rgb(255, 0, 0 / 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgb-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgb-2.html new file mode 100644 index 0000000000..96af643ee8 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgb-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.css-color-4-rgb-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.css-color-4-rgb-2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'rgb(255 0 0, 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgb-3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgb-3.html new file mode 100644 index 0000000000..a2691acaf1 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgb-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.css-color-4-rgb-3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.css-color-4-rgb-3</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'rgb(255, 0 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgb-4.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgb-4.html new file mode 100644 index 0000000000..eb5f56692a --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgb-4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.css-color-4-rgb-4</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.css-color-4-rgb-4</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'rgb(0 0 0 /)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgb-5.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgb-5.html new file mode 100644 index 0000000000..7de9dd4911 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgb-5.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.css-color-4-rgb-5</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.css-color-4-rgb-5</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'rgb(0, 0, 0 /)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgba-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgba-1.html new file mode 100644 index 0000000000..20b889c5cc --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgba-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.css-color-4-rgba-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.css-color-4-rgba-1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'rgba(255, 0, 0 / 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgba-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgba-2.html new file mode 100644 index 0000000000..908545cebe --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgba-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.css-color-4-rgba-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.css-color-4-rgba-2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'rgba(255 0 0, 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgba-3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgba-3.html new file mode 100644 index 0000000000..851314f643 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.css-color-4-rgba-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.css-color-4-rgba-3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.css-color-4-rgba-3</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'rgba(255, 0 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex1.html new file mode 100644 index 0000000000..9aba392276 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.hex1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.hex1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = '#f'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex2.html new file mode 100644 index 0000000000..361db1de43 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.hex2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.hex2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = '#f0'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex3.html new file mode 100644 index 0000000000..7df089d840 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.hex3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.hex3</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = '#g00'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex4.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex4.html new file mode 100644 index 0000000000..6089675b81 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.hex4</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.hex4</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = '#fg00'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex5.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex5.html new file mode 100644 index 0000000000..488daf4690 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex5.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.hex5</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.hex5</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = '#ff000'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex6.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex6.html new file mode 100644 index 0000000000..ec0def2e10 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex6.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.hex6</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.hex6</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = '#fg0000'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex7.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex7.html new file mode 100644 index 0000000000..2b07b8dc9b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex7.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.hex7</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.hex7</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = '#ff0000f'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex8.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex8.html new file mode 100644 index 0000000000..f886d4a67c --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hex8.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.hex8</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.hex8</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = '#fg0000ff'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsl-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsl-1.html new file mode 100644 index 0000000000..153f9cb513 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsl-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.hsl-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.hsl-1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'hsl(0%, 100%, 50%)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsl-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsl-2.html new file mode 100644 index 0000000000..7a2bd4f930 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsl-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.hsl-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.hsl-2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'hsl(z, 100%, 50%)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsl-3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsl-3.html new file mode 100644 index 0000000000..8ad0f54264 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsl-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.hsl-3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.hsl-3</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'hsl(0, 0, 50%)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsl-4.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsl-4.html new file mode 100644 index 0000000000..780b83b383 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsl-4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.hsl-4</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.hsl-4</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'hsl(0, 100%, 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsl-5.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsl-5.html new file mode 100644 index 0000000000..ad5944f1c0 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsl-5.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.hsl-5</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.hsl-5</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'hsl(0, 100.%, 50%)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsl-6.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsl-6.html new file mode 100644 index 0000000000..948a9d8a36 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsl-6.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.hsl-6</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.hsl-6</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'hsl(0, 100%, 50%,)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsla-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsla-1.html new file mode 100644 index 0000000000..7a4bdb318f --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsla-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.hsla-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.hsla-1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'hsla(0%, 100%, 50%, 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsla-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsla-2.html new file mode 100644 index 0000000000..4164de3bbd --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsla-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.hsla-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.hsla-2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'hsla(0, 0, 50%, 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsla-3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsla-3.html new file mode 100644 index 0000000000..109a22cdf9 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.hsla-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.hsla-3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.hsla-3</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'hsla(0, 0, 50%, 1,)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.name-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.name-1.html new file mode 100644 index 0000000000..acdd4d4c8e --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.name-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.name-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.name-1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'darkbrown'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.name-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.name-2.html new file mode 100644 index 0000000000..292f909bcd --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.name-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.name-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.name-2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'firebrick1'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.name-3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.name-3.html new file mode 100644 index 0000000000..f47ec43f55 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.name-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.name-3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.name-3</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'red blue'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.name-4.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.name-4.html new file mode 100644 index 0000000000..d15d787f63 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.name-4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.name-4</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.name-4</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = '"red"'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.name-5.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.name-5.html new file mode 100644 index 0000000000..ce391d0069 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.name-5.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.name-5</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.name-5</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = '"red'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgb-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgb-1.html new file mode 100644 index 0000000000..934f725dd3 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgb-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.rgb-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.rgb-1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'rgb(255.0, 0, 0,)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgb-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgb-2.html new file mode 100644 index 0000000000..f92a06b450 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgb-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.rgb-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.rgb-2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'rgb(100%, 0, 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgb-3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgb-3.html new file mode 100644 index 0000000000..8ebde1782a --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgb-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.rgb-3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.rgb-3</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'rgb(255, - 1, 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgba-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgba-1.html new file mode 100644 index 0000000000..6e3d135f41 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgba-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.rgba-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.rgba-1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'rgba(100%, 0, 0, 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgba-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgba-2.html new file mode 100644 index 0000000000..a6a61002da --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgba-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.rgba-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.rgba-2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'rgba(255, 0, 0, 1. 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgba-3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgba-3.html new file mode 100644 index 0000000000..464d562b2f --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgba-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.rgba-3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.rgba-3</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'rgba(255, 0, 0, 1.)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgba-4.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgba-4.html new file mode 100644 index 0000000000..815ce2f8b6 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgba-4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.rgba-4</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.rgba-4</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'rgba(255, 0, 0, '; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgba-5.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgba-5.html new file mode 100644 index 0000000000..33c3e33dfc --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.invalid.rgba-5.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.invalid.rgba-5</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.invalid.rgba-5</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + try { ctx.fillStyle = 'rgba(255, 0, 0, 1,)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-1.html new file mode 100644 index 0000000000..0432a3bbd4 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.rgb-clamp-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.rgb-clamp-1</h1> +<p class="desc"></p> + +<p class="notes">Assumes colors are clamped to [0,255]. +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.rgb-clamp-1.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgb(-1000, 1000, -1000)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-1.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-1.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-1.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-2.html new file mode 100644 index 0000000000..cf81e3c73f --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.rgb-clamp-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.rgb-clamp-2</h1> +<p class="desc"></p> + +<p class="notes">Assumes colors are clamped to [0,255]. +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.rgb-clamp-2.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgb(-200%, 200%, -200%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-2.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-2.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-2.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-3.html new file mode 100644 index 0000000000..b3c609fbee --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.rgb-clamp-3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.rgb-clamp-3</h1> +<p class="desc"></p> + +<p class="notes">Assumes colors are clamped to [0,255]. +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.rgb-clamp-3.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgb(-2147483649, 4294967298, -18446744073709551619)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-3.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-3.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-3.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-4.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-4.html new file mode 100644 index 0000000000..60aa8563bd --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.rgb-clamp-4</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.rgb-clamp-4</h1> +<p class="desc"></p> + +<p class="notes">Assumes colors are clamped to [0,255]. +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.rgb-clamp-4.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgb(-1000000000000000000000000000000000000000, 1000000000000000000000000000000000000000, -1000000000000000000000000000000000000000)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-4.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-4.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-4.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-5.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-5.html new file mode 100644 index 0000000000..242ca3933d --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-5.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.rgb-clamp-5</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.rgb-clamp-5</h1> +<p class="desc"></p> + +<p class="notes">Assumes colors are clamped to [0,255]. +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.rgb-clamp-5.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgb(-10000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000, 10000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000, -10000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-5.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-5.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-clamp-5.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-eof.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-eof.html new file mode 100644 index 0000000000..201874c27d --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-eof.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.rgb-eof</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.rgb-eof</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.rgb-eof.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgb(0, 255, 0'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-eof.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-eof.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-eof.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-num.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-num.html new file mode 100644 index 0000000000..0ce1db836f --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-num.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.rgb-num</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.rgb-num</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.rgb-num.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgb(0,255,0)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-num.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-num.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-num.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-percent.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-percent.html new file mode 100644 index 0000000000..9b3de61672 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-percent.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.rgb-percent</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.rgb-percent</h1> +<p class="desc"></p> + +<p class="notes">CSS3 Color says "The integer value 255 corresponds to 100%". (In particular, it is not 254...) +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.rgb-percent.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgb(0% ,100% ,0%)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-percent.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-percent.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgb-percent.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-clamp-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-clamp-1.html new file mode 100644 index 0000000000..587253ad69 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-clamp-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.rgba-clamp-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.rgba-clamp-1</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.rgba-clamp-1.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgba(0, 255, 0, -2)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,0,0,0); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-clamp-1.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-clamp-1.png Binary files differnew file mode 100644 index 0000000000..eeedd0ff05 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-clamp-1.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-clamp-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-clamp-2.html new file mode 100644 index 0000000000..4e8156e60a --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-clamp-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.rgba-clamp-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.rgba-clamp-2</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.rgba-clamp-2.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgba(0, 255, 0, 2)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-clamp-2.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-clamp-2.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-clamp-2.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-eof.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-eof.html new file mode 100644 index 0000000000..5f07d38b68 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-eof.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.rgba-eof</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.rgba-eof</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.rgba-eof.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgba(0, 255, 0, 1'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-eof.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-eof.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-eof.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-num-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-num-1.html new file mode 100644 index 0000000000..0c329c96ea --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-num-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.rgba-num-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.rgba-num-1</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.rgba-num-1.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgba( 0 , 255 , 0 , .499 )'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,127); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-num-1.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-num-1.png Binary files differnew file mode 100644 index 0000000000..2aa6265f06 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-num-1.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-num-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-num-2.html new file mode 100644 index 0000000000..384a7f412a --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-num-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.rgba-num-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.rgba-num-2</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.rgba-num-2.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgba( 0 , 255 , 0 , 0.499 )'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,127); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-num-2.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-num-2.png Binary files differnew file mode 100644 index 0000000000..2aa6265f06 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-num-2.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-percent.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-percent.html new file mode 100644 index 0000000000..60ee007577 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-percent.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.rgba-percent</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.rgba-percent</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.rgba-percent.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgba(0%,100%,0%,0.499)'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,127); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-percent.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-percent.png Binary files differnew file mode 100644 index 0000000000..2aa6265f06 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-percent.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-1.html new file mode 100644 index 0000000000..eaec0debcb --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.rgba-solid-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.rgba-solid-1</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.rgba-solid-1.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgba( 0 , 255 , 0 , 1 )'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-1.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-1.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-1.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-2.html new file mode 100644 index 0000000000..947bbbce8d --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.rgba-solid-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.rgba-solid-2</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.rgba-solid-2.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgba( 0 , 255 , 0 , 1.0 )'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-2.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-2.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-2.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-3.html new file mode 100644 index 0000000000..052a12beae --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.rgba-solid-3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.rgba-solid-3</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.rgba-solid-3.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgba( 0 , 255 , 0 , +1 )'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-3.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-3.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-3.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-4.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-4.html new file mode 100644 index 0000000000..ee9cd4e34e --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.rgba-solid-4</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.rgba-solid-4</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.rgba-solid-4.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'rgba( -0 , 255 , +0 , 1 )'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-4.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-4.png Binary files differnew file mode 100644 index 0000000000..2733836c99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.rgba-solid-4.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.svg-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.svg-1.html new file mode 100644 index 0000000000..0ff839b8cb --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.svg-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.svg-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.svg-1</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.svg-1.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'gray'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 128,128,128,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.svg-1.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.svg-1.png Binary files differnew file mode 100644 index 0000000000..5bc39cc699 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.svg-1.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.svg-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.svg-2.html new file mode 100644 index 0000000000..141f4bfe46 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.svg-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.svg-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.svg-2</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.svg-2.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'grey'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 128,128,128,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.svg-2.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.svg-2.png Binary files differnew file mode 100644 index 0000000000..5bc39cc699 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.svg-2.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.system.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.system.html new file mode 100644 index 0000000000..3a56389973 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.system.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.system</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.system</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'ThreeDDarkShadow'; + assert_regexp_match(ctx.fillStyle, /^#(?!(FF0000|ff0000|f00)$)/); // test that it's not red + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.transparent-1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.transparent-1.html new file mode 100644 index 0000000000..5b9a834c0b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.transparent-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.transparent-1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.transparent-1</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.transparent-1.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'transparent'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,0,0,0); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.transparent-1.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.transparent-1.png Binary files differnew file mode 100644 index 0000000000..eeedd0ff05 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.transparent-1.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.transparent-2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.transparent-2.html new file mode 100644 index 0000000000..a077534c23 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.transparent-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.parse.transparent-2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.parse.transparent-2</h1> +<p class="desc"></p> + +<p class="notes"> +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.fillStyle.parse.transparent-2.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillStyle = 'TrAnSpArEnT'; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,0,0,0); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.transparent-2.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.transparent-2.png Binary files differnew file mode 100644 index 0000000000..eeedd0ff05 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.parse.transparent-2.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.toStringFunctionCallback.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.toStringFunctionCallback.html new file mode 100644 index 0000000000..2a12b05839 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.fillStyle.toStringFunctionCallback.html @@ -0,0 +1,39 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.fillStyle.toStringFunctionCallback</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.fillStyle.toStringFunctionCallback</h1> +<p class="desc">Passing a function in to ctx.fillStyle or ctx.strokeStyle with a toString callback works as specified</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test("Passing a function in to ctx.fillStyle or ctx.strokeStyle with a toString callback works as specified"); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = { toString: function() { return "#008000"; } }; + _assertSame(ctx.fillStyle, "#008000", "ctx.fillStyle", "\"#008000\""); + ctx.fillStyle = {}; + _assertSame(ctx.fillStyle, "#008000", "ctx.fillStyle", "\"#008000\""); + ctx.fillStyle = 800000; + _assertSame(ctx.fillStyle, "#008000", "ctx.fillStyle", "\"#008000\""); + assert_throws_js(TypeError, function() { ctx.fillStyle = { toString: function() { throw new TypeError; } }; }); + ctx.strokeStyle = { toString: function() { return "#008000"; } }; + _assertSame(ctx.strokeStyle, "#008000", "ctx.strokeStyle", "\"#008000\""); + ctx.strokeStyle = {}; + _assertSame(ctx.strokeStyle, "#008000", "ctx.strokeStyle", "\"#008000\""); + ctx.strokeStyle = 800000; + _assertSame(ctx.strokeStyle, "#008000", "ctx.strokeStyle", "\"#008000\""); + assert_throws_js(TypeError, function() { ctx.strokeStyle = { toString: function() { throw new TypeError; } }; }); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.conic.invalid.inputs.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.conic.invalid.inputs.html new file mode 100644 index 0000000000..1a4cde4146 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.conic.invalid.inputs.html @@ -0,0 +1,44 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.conic.invalid.inputs</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.conic.invalid.inputs</h1> +<p class="desc">Conic gradient function with invalid inputs</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test("Conic gradient function with invalid inputs"); +_addTest(function(canvas, ctx) { + + assert_throws_js(TypeError, function() { ctx.createConicGradient(Infinity, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createConicGradient(-Infinity, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createConicGradient(NaN, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createConicGradient(0, Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createConicGradient(0, -Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createConicGradient(0, NaN, 1); }); + assert_throws_js(TypeError, function() { ctx.createConicGradient(0, 0, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createConicGradient(0, 0, -Infinity); }); + assert_throws_js(TypeError, function() { ctx.createConicGradient(0, 0, NaN); }); + assert_throws_js(TypeError, function() { ctx.createConicGradient(Infinity, Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createConicGradient(Infinity, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createConicGradient(Infinity, 0, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createConicGradient(0, Infinity, Infinity); }); + + const g = ctx.createConicGradient(0, 0, 25); + assert_throws_js(TypeError, function() { g.addColorStop(-Infinity, '#f00'); }); + assert_throws_js(TypeError, function() { g.addColorStop(NaN, '#f00'); }); + assert_throws_dom("SYNTAX_ERR", function() { g.addColorStop(0, -Infinity); }); + assert_throws_dom("SYNTAX_ERR", function() { g.addColorStop(0, NaN); }); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.conic.negative.rotation.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.conic.negative.rotation.html new file mode 100644 index 0000000000..ba85463b41 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.conic.negative.rotation.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.conic.negative.rotation</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.conic.negative.rotation</h1> +<p class="desc">Conic gradient with negative rotation</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("Conic gradient with negative rotation"); +_addTest(function(canvas, ctx) { + + const g = ctx.createConicGradient(-Math.PI/2, 50, 25); + // It's red in the upper right region and green on the lower left region + g.addColorStop(0, "#f00"); + g.addColorStop(0.25, "#0f0"); + g.addColorStop(0.50, "#0f0"); + g.addColorStop(0.75, "#f00"); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + _assertPixelApprox(canvas, 25,15, 255,0,0,255, 3); + _assertPixelApprox(canvas, 75,40, 0,255,0,255, 3); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.conic.positive.rotation.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.conic.positive.rotation.html new file mode 100644 index 0000000000..f8cebbb0d4 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.conic.positive.rotation.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.conic.positive.rotation</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.conic.positive.rotation</h1> +<p class="desc">Conic gradient with positive rotation</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("Conic gradient with positive rotation"); +_addTest(function(canvas, ctx) { + + const g = ctx.createConicGradient(3*Math.PI/2, 50, 25); + // It's red in the upper right region and green on the lower left region + g.addColorStop(0, "#f00"); + g.addColorStop(0.25, "#0f0"); + g.addColorStop(0.50, "#0f0"); + g.addColorStop(0.75, "#f00"); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + _assertPixelApprox(canvas, 25,15, 255,0,0,255, 3); + _assertPixelApprox(canvas, 75,40, 0,255,0,255, 3); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.empty.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.empty.html new file mode 100644 index 0000000000..dcc7575254 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.empty.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.empty</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.empty</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + var g = ctx.createLinearGradient(0, 0, 0, 50); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + _assertPixelApprox(canvas, 50,25, 0,255,0,255, 2); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.alpha.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.alpha.html new file mode 100644 index 0000000000..13f48f37bf --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.alpha.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.interpolate.alpha</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.interpolate.alpha</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.gradient.interpolate.alpha.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#ff0'; + ctx.fillRect(0, 0, 100, 50); + var g = ctx.createLinearGradient(0, 0, 100, 0); + g.addColorStop(0, 'rgba(0,0,255, 0)'); + g.addColorStop(1, 'rgba(0,0,255, 1)'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + _assertPixelApprox(canvas, 25,25, 191,191,63,255, 3); + _assertPixelApprox(canvas, 50,25, 127,127,127,255, 3); + _assertPixelApprox(canvas, 75,25, 63,63,191,255, 3); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.alpha.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.alpha.png Binary files differnew file mode 100644 index 0000000000..af5ac0f07d --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.alpha.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.color.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.color.html new file mode 100644 index 0000000000..3f7e27abe0 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.color.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.interpolate.color</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.interpolate.color</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.gradient.interpolate.color.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var g = ctx.createLinearGradient(0, 0, 100, 0); + g.addColorStop(0, '#ff0'); + g.addColorStop(1, '#00f'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + _assertPixelApprox(canvas, 25,25, 191,191,63,255, 3); + _assertPixelApprox(canvas, 50,25, 127,127,127,255, 3); + _assertPixelApprox(canvas, 75,25, 63,63,191,255, 3); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.color.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.color.png Binary files differnew file mode 100644 index 0000000000..af5ac0f07d --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.color.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.coloralpha.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.coloralpha.html new file mode 100644 index 0000000000..0d635ed671 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.coloralpha.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.interpolate.coloralpha</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.interpolate.coloralpha</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.gradient.interpolate.coloralpha.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var g = ctx.createLinearGradient(0, 0, 100, 0); + g.addColorStop(0, 'rgba(255,255,0, 0)'); + g.addColorStop(1, 'rgba(0,0,255, 1)'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + _assertPixelApprox(canvas, 25,25, 190,190,65,65, 3); + _assertPixelApprox(canvas, 50,25, 126,126,128,128, 3); + _assertPixelApprox(canvas, 75,25, 62,62,192,192, 3); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.coloralpha.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.coloralpha.png Binary files differnew file mode 100644 index 0000000000..552e6ee44b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.coloralpha.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.multiple.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.multiple.html new file mode 100644 index 0000000000..9e62f3436c --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.multiple.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.interpolate.multiple</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.interpolate.multiple</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.gradient.interpolate.multiple.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + canvas.width = 200; + var g = ctx.createLinearGradient(0, 0, 200, 0); + g.addColorStop(0, '#ff0'); + g.addColorStop(0.5, '#0ff'); + g.addColorStop(1, '#f0f'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 200, 50); + _assertPixelApprox(canvas, 50,25, 127,255,127,255, 3); + _assertPixelApprox(canvas, 100,25, 0,255,255,255, 3); + _assertPixelApprox(canvas, 150,25, 127,127,255,255, 3); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.multiple.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.multiple.png Binary files differnew file mode 100644 index 0000000000..86122450d3 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.multiple.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.outside.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.outside.html new file mode 100644 index 0000000000..b46a7bed36 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.outside.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.interpolate.outside</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.interpolate.outside</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createLinearGradient(25, 0, 75, 0); + g.addColorStop(0.4, '#0f0'); + g.addColorStop(0.6, '#0f0'); + + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + _assertPixelApprox(canvas, 20,25, 0,255,0,255, 2); + _assertPixelApprox(canvas, 50,25, 0,255,0,255, 2); + _assertPixelApprox(canvas, 80,25, 0,255,0,255, 2); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.overlap.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.overlap.html new file mode 100644 index 0000000000..099a3ea81a --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.overlap.html @@ -0,0 +1,51 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.interpolate.overlap</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.interpolate.overlap</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.gradient.interpolate.overlap.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + canvas.width = 200; + var g = ctx.createLinearGradient(0, 0, 200, 0); + g.addColorStop(0, '#f00'); + g.addColorStop(0, '#ff0'); + g.addColorStop(0.25, '#00f'); + g.addColorStop(0.25, '#0f0'); + g.addColorStop(0.25, '#0f0'); + g.addColorStop(0.25, '#0f0'); + g.addColorStop(0.25, '#ff0'); + g.addColorStop(0.5, '#00f'); + g.addColorStop(0.5, '#0f0'); + g.addColorStop(0.75, '#00f'); + g.addColorStop(0.75, '#f00'); + g.addColorStop(0.75, '#ff0'); + g.addColorStop(0.5, '#0f0'); + g.addColorStop(0.5, '#0f0'); + g.addColorStop(0.5, '#ff0'); + g.addColorStop(1, '#00f'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 200, 50); + _assertPixelApprox(canvas, 49,25, 0,0,255,255, 16); + _assertPixelApprox(canvas, 51,25, 255,255,0,255, 16); + _assertPixelApprox(canvas, 99,25, 0,0,255,255, 16); + _assertPixelApprox(canvas, 101,25, 255,255,0,255, 16); + _assertPixelApprox(canvas, 149,25, 0,0,255,255, 16); + _assertPixelApprox(canvas, 151,25, 255,255,0,255, 16); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.overlap.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.overlap.png Binary files differnew file mode 100644 index 0000000000..5c2bb964e0 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.overlap.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.overlap2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.overlap2.html new file mode 100644 index 0000000000..a4a2955d3b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.overlap2.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.interpolate.overlap2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.interpolate.overlap2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var g = ctx.createLinearGradient(0, 0, 100, 0); + var ps = [ 0, 1/10, 1/4, 1/3, 1/2, 3/4, 1 ]; + for (var p = 0; p < ps.length; ++p) + { + g.addColorStop(ps[p], '#0f0'); + for (var i = 0; i < 15; ++i) + g.addColorStop(ps[p], '#f00'); + g.addColorStop(ps[p], '#0f0'); + } + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 30,25, 0,255,0,255); + _assertPixel(canvas, 40,25, 0,255,0,255); + _assertPixel(canvas, 60,25, 0,255,0,255); + _assertPixel(canvas, 80,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.solid.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.solid.html new file mode 100644 index 0000000000..9ac31626df --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.solid.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.interpolate.solid</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.interpolate.solid</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var g = ctx.createLinearGradient(0, 0, 100, 0); + g.addColorStop(0, '#0f0'); + g.addColorStop(1, '#0f0'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.vertical.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.vertical.html new file mode 100644 index 0000000000..80302761d6 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.vertical.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.interpolate.vertical</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.interpolate.vertical</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.gradient.interpolate.vertical.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var g = ctx.createLinearGradient(0, 0, 0, 50); + g.addColorStop(0, '#ff0'); + g.addColorStop(1, '#00f'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + _assertPixelApprox(canvas, 50,12, 191,191,63,255, 10); + _assertPixelApprox(canvas, 50,25, 127,127,127,255, 5); + _assertPixelApprox(canvas, 50,37, 63,63,191,255, 10); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.vertical.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.vertical.png Binary files differnew file mode 100644 index 0000000000..37d6a00c62 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.vertical.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.zerosize.fill.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.zerosize.fill.html new file mode 100644 index 0000000000..7a8892db11 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.zerosize.fill.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.interpolate.zerosize.fill</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.interpolate.zerosize.fill</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createLinearGradient(50, 25, 50, 25); // zero-length line (undefined direction) + g.addColorStop(0, '#f00'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.rect(0, 0, 100, 50); + ctx.fill(); + _assertPixel(canvas, 40,20, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.zerosize.fillRect.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.zerosize.fillRect.html new file mode 100644 index 0000000000..7696cefdd0 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.zerosize.fillRect.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.interpolate.zerosize.fillRect</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.interpolate.zerosize.fillRect</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createLinearGradient(50, 25, 50, 25); // zero-length line (undefined direction) + g.addColorStop(0, '#f00'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + _assertPixel(canvas, 40,20, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.zerosize.fillText.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.zerosize.fillText.html new file mode 100644 index 0000000000..98ef6c3425 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.zerosize.fillText.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.interpolate.zerosize.fillText</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.interpolate.zerosize.fillText</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createLinearGradient(50, 25, 50, 25); // zero-length line (undefined direction) + g.addColorStop(0, '#f00'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.font = '100px sans-serif'; + ctx.fillText("AA", 0, 50); + _assertGreen(ctx, 100, 50); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.zerosize.stroke.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.zerosize.stroke.html new file mode 100644 index 0000000000..283e3874ad --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.zerosize.stroke.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.interpolate.zerosize.stroke</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.interpolate.zerosize.stroke</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createLinearGradient(50, 25, 50, 25); // zero-length line (undefined direction) + g.addColorStop(0, '#f00'); + g.addColorStop(1, '#f00'); + ctx.strokeStyle = g; + ctx.rect(20, 20, 60, 10); + ctx.stroke(); + _assertPixel(canvas, 19,19, 0,255,0,255); + _assertPixel(canvas, 20,19, 0,255,0,255); + _assertPixel(canvas, 21,19, 0,255,0,255); + _assertPixel(canvas, 19,20, 0,255,0,255); + _assertPixel(canvas, 20,20, 0,255,0,255); + _assertPixel(canvas, 21,20, 0,255,0,255); + _assertPixel(canvas, 19,21, 0,255,0,255); + _assertPixel(canvas, 20,21, 0,255,0,255); + _assertPixel(canvas, 21,21, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.zerosize.strokeRect.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.zerosize.strokeRect.html new file mode 100644 index 0000000000..7d243ecbc4 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.zerosize.strokeRect.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.interpolate.zerosize.strokeRect</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.interpolate.zerosize.strokeRect</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createLinearGradient(50, 25, 50, 25); // zero-length line (undefined direction) + g.addColorStop(0, '#f00'); + g.addColorStop(1, '#f00'); + ctx.strokeStyle = g; + ctx.strokeRect(20, 20, 60, 10); + _assertPixel(canvas, 19,19, 0,255,0,255); + _assertPixel(canvas, 20,19, 0,255,0,255); + _assertPixel(canvas, 21,19, 0,255,0,255); + _assertPixel(canvas, 19,20, 0,255,0,255); + _assertPixel(canvas, 20,20, 0,255,0,255); + _assertPixel(canvas, 21,20, 0,255,0,255); + _assertPixel(canvas, 19,21, 0,255,0,255); + _assertPixel(canvas, 20,21, 0,255,0,255); + _assertPixel(canvas, 21,21, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.zerosize.strokeText.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.zerosize.strokeText.html new file mode 100644 index 0000000000..bab7c6b6d9 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.interpolate.zerosize.strokeText.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.interpolate.zerosize.strokeText</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.interpolate.zerosize.strokeText</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createLinearGradient(50, 25, 50, 25); // zero-length line (undefined direction) + g.addColorStop(0, '#f00'); + g.addColorStop(1, '#f00'); + ctx.strokeStyle = g; + ctx.font = '100px sans-serif'; + ctx.strokeText("AA", 0, 50); + _assertGreen(ctx, 100, 50); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.linear.nonfinite.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.linear.nonfinite.html new file mode 100644 index 0000000000..89d0092715 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.linear.nonfinite.html @@ -0,0 +1,48 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.linear.nonfinite</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.linear.nonfinite</h1> +<p class="desc">createLinearGradient() throws TypeError if arguments are not finite</p> + +<p class="notes">Defined in "Web IDL" (draft) +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test("createLinearGradient() throws TypeError if arguments are not finite"); +_addTest(function(canvas, ctx) { + + assert_throws_js(TypeError, function() { ctx.createLinearGradient(Infinity, 0, 1, 0); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(-Infinity, 0, 1, 0); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(NaN, 0, 1, 0); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(0, Infinity, 1, 0); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(0, -Infinity, 1, 0); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(0, NaN, 1, 0); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(0, 0, Infinity, 0); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(0, 0, -Infinity, 0); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(0, 0, NaN, 0); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(0, 0, 1, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(0, 0, 1, -Infinity); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(0, 0, 1, NaN); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(Infinity, Infinity, 1, 0); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(Infinity, Infinity, Infinity, 0); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(Infinity, Infinity, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(Infinity, Infinity, 1, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(Infinity, 0, Infinity, 0); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(Infinity, 0, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(Infinity, 0, 1, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(0, Infinity, Infinity, 0); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(0, Infinity, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(0, Infinity, 1, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createLinearGradient(0, 0, Infinity, Infinity); }); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.linear.transform.1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.linear.transform.1.html new file mode 100644 index 0000000000..0ae3220f06 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.linear.transform.1.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.linear.transform.1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.linear.transform.1</h1> +<p class="desc">Linear gradient coordinates are relative to the coordinate space at the time of filling</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("Linear gradient coordinates are relative to the coordinate space at the time of filling"); +_addTest(function(canvas, ctx) { + + var g = ctx.createLinearGradient(0, 0, 200, 0); + g.addColorStop(0, '#f00'); + g.addColorStop(0.25, '#0f0'); + g.addColorStop(0.75, '#0f0'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.translate(-50, 0); + ctx.fillRect(50, 0, 100, 50); + _assertPixel(canvas, 25,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixel(canvas, 75,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.linear.transform.2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.linear.transform.2.html new file mode 100644 index 0000000000..8f761c666f --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.linear.transform.2.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.linear.transform.2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.linear.transform.2</h1> +<p class="desc">Linear gradient coordinates are relative to the coordinate space at the time of filling</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("Linear gradient coordinates are relative to the coordinate space at the time of filling"); +_addTest(function(canvas, ctx) { + + ctx.translate(100, 0); + var g = ctx.createLinearGradient(0, 0, 200, 0); + g.addColorStop(0, '#f00'); + g.addColorStop(0.25, '#0f0'); + g.addColorStop(0.75, '#0f0'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.translate(-150, 0); + ctx.fillRect(50, 0, 100, 50); + _assertPixel(canvas, 25,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixel(canvas, 75,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.linear.transform.3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.linear.transform.3.html new file mode 100644 index 0000000000..fdd1e0e9a4 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.linear.transform.3.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.linear.transform.3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.linear.transform.3</h1> +<p class="desc">Linear gradient transforms do not experience broken caching effects</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("Linear gradient transforms do not experience broken caching effects"); +_addTest(function(canvas, ctx) { + + var g = ctx.createLinearGradient(0, 0, 200, 0); + g.addColorStop(0, '#f00'); + g.addColorStop(0.25, '#0f0'); + g.addColorStop(0.75, '#0f0'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + ctx.translate(-50, 0); + ctx.fillRect(50, 0, 100, 50); + _assertPixel(canvas, 25,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixel(canvas, 75,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.compare.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.compare.html new file mode 100644 index 0000000000..9ff3e607c7 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.compare.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.object.compare</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.object.compare</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var g1 = ctx.createLinearGradient(0, 0, 100, 0); + var g2 = ctx.createLinearGradient(0, 0, 100, 0); + _assertDifferent(g1, g2, "g1", "g2"); + ctx.fillStyle = g1; + _assertSame(ctx.fillStyle, g1, "ctx.fillStyle", "g1"); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.crosscanvas.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.crosscanvas.html new file mode 100644 index 0000000000..9c30d9cbac --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.crosscanvas.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.object.crosscanvas</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.object.crosscanvas</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + var g = document.createElement('canvas').getContext('2d').createLinearGradient(0, 0, 100, 0); + g.addColorStop(0, '#0f0'); + g.addColorStop(1, '#0f0'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + _assertPixelApprox(canvas, 50,25, 0,255,0,255, 2); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.current.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.current.html new file mode 100644 index 0000000000..95cc893671 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.current.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.object.current</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.object.current</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="2d.gradient.object.current.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + canvas.setAttribute('style', 'color: #f00'); + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createLinearGradient(0, 0, 100, 0); + g.addColorStop(0, 'currentColor'); + g.addColorStop(1, 'currentColor'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + _assertPixelApprox(canvas, 50,25, 0,0,0,255, 2); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.current.png b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.current.png Binary files differnew file mode 100644 index 0000000000..d638d03386 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.current.png diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.invalidcolor.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.invalidcolor.html new file mode 100644 index 0000000000..2be7b3d6fd --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.invalidcolor.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.object.invalidcolor</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.object.invalidcolor</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var g = ctx.createLinearGradient(0, 0, 100, 0); + assert_throws_dom("SYNTAX_ERR", function() { g.addColorStop(0, ""); }); + assert_throws_dom("SYNTAX_ERR", function() { g.addColorStop(0, 'rgb(NaN%, NaN%, NaN%)'); }); + assert_throws_dom("SYNTAX_ERR", function() { g.addColorStop(0, 'null'); }); + assert_throws_dom("SYNTAX_ERR", function() { g.addColorStop(0, 'undefined'); }); + assert_throws_dom("SYNTAX_ERR", function() { g.addColorStop(0, null); }); + assert_throws_dom("SYNTAX_ERR", function() { g.addColorStop(0, undefined); }); + + var g = ctx.createRadialGradient(0, 0, 0, 100, 0, 0); + assert_throws_dom("SYNTAX_ERR", function() { g.addColorStop(0, ""); }); + assert_throws_dom("SYNTAX_ERR", function() { g.addColorStop(0, 'rgb(NaN%, NaN%, NaN%)'); }); + assert_throws_dom("SYNTAX_ERR", function() { g.addColorStop(0, 'null'); }); + assert_throws_dom("SYNTAX_ERR", function() { g.addColorStop(0, 'undefined'); }); + assert_throws_dom("SYNTAX_ERR", function() { g.addColorStop(0, null); }); + assert_throws_dom("SYNTAX_ERR", function() { g.addColorStop(0, undefined); }); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.invalidoffset.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.invalidoffset.html new file mode 100644 index 0000000000..76aaed7115 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.invalidoffset.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.object.invalidoffset</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.object.invalidoffset</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var g = ctx.createLinearGradient(0, 0, 100, 0); + assert_throws_dom("INDEX_SIZE_ERR", function() { g.addColorStop(-1, '#000'); }); + assert_throws_dom("INDEX_SIZE_ERR", function() { g.addColorStop(2, '#000'); }); + assert_throws_js(TypeError, function() { g.addColorStop(Infinity, '#000'); }); + assert_throws_js(TypeError, function() { g.addColorStop(-Infinity, '#000'); }); + assert_throws_js(TypeError, function() { g.addColorStop(NaN, '#000'); }); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.return.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.return.html new file mode 100644 index 0000000000..c32312142d --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.return.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.object.return</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.object.return</h1> +<p class="desc">createLinearGradient() and createRadialGradient() returns objects implementing CanvasGradient</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test("createLinearGradient() and createRadialGradient() returns objects implementing CanvasGradient"); +_addTest(function(canvas, ctx) { + + window.CanvasGradient.prototype.thisImplementsCanvasGradient = true; + + var g1 = ctx.createLinearGradient(0, 0, 100, 0); + _assertDifferent(g1.addColorStop, undefined, "g1.addColorStop", "undefined"); + _assertSame(g1.thisImplementsCanvasGradient, true, "g1.thisImplementsCanvasGradient", "true"); + + var g2 = ctx.createRadialGradient(0, 0, 10, 0, 0, 20); + _assertDifferent(g2.addColorStop, undefined, "g2.addColorStop", "undefined"); + _assertSame(g2.thisImplementsCanvasGradient, true, "g2.thisImplementsCanvasGradient", "true"); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.type.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.type.html new file mode 100644 index 0000000000..37c77d2f2c --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.type.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.object.type</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.object.type</h1> +<p class="desc">window.CanvasGradient exists and has the right properties</p> + +<p class="notes">Defined in "Web IDL" (draft) +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test("window.CanvasGradient exists and has the right properties"); +_addTest(function(canvas, ctx) { + + _assertDifferent(window.CanvasGradient, undefined, "window.CanvasGradient", "undefined"); + _assertDifferent(window.CanvasGradient.prototype.addColorStop, undefined, "window.CanvasGradient.prototype.addColorStop", "undefined"); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.update.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.update.html new file mode 100644 index 0000000000..ae78d0d78f --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.object.update.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.object.update</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.object.update</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var g = ctx.createLinearGradient(-100, 0, 200, 0); + g.addColorStop(0, '#f00'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + g.addColorStop(0.1, '#0f0'); + g.addColorStop(0.9, '#0f0'); + ctx.fillRect(0, 0, 100, 50); + _assertPixelApprox(canvas, 50,25, 0,255,0,255, 2); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.behind.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.behind.html new file mode 100644 index 0000000000..d32e972cc5 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.behind.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.cone.behind</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.cone.behind</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createRadialGradient(120, 25, 10, 211, 25, 100); + g.addColorStop(0, '#f00'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixelApprox(canvas, 98,25, 0,255,0,255, 1); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixelApprox(canvas, 50,48, 0,255,0,255, 1); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.beside.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.beside.html new file mode 100644 index 0000000000..b9774aeba6 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.beside.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.cone.beside</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.cone.beside</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createRadialGradient(0, 100, 40, 100, 100, 50); + g.addColorStop(0, '#f00'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixelApprox(canvas, 98,25, 0,255,0,255, 1); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixelApprox(canvas, 50,48, 0,255,0,255, 1); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.bottom.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.bottom.html new file mode 100644 index 0000000000..15808ee50e --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.bottom.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.cone.bottom</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.cone.bottom</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createRadialGradient(210, 25, 100, 230, 25, 101); + g.addColorStop(0, '#0f0'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixelApprox(canvas, 98,25, 0,255,0,255, 1); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixelApprox(canvas, 50,48, 0,255,0,255, 1); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.cylinder.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.cylinder.html new file mode 100644 index 0000000000..067f129983 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.cylinder.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.cone.cylinder</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.cone.cylinder</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createRadialGradient(210, 25, 100, 230, 25, 100); + g.addColorStop(0, '#0f0'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixelApprox(canvas, 98,25, 0,255,0,255, 1); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixelApprox(canvas, 50,48, 0,255,0,255, 1); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.front.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.front.html new file mode 100644 index 0000000000..88ecdb9810 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.front.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.cone.front</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.cone.front</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createRadialGradient(311, 25, 10, 210, 25, 100); + g.addColorStop(0, '#f00'); + g.addColorStop(1, '#0f0'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixelApprox(canvas, 98,25, 0,255,0,255, 1); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixelApprox(canvas, 50,48, 0,255,0,255, 1); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.shape1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.shape1.html new file mode 100644 index 0000000000..046e4d97b1 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.shape1.html @@ -0,0 +1,52 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.cone.shape1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.cone.shape1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var tol = 1; // tolerance to avoid antialiasing artifacts + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + ctx.fillStyle = '#f00'; + ctx.beginPath(); + ctx.moveTo(30+tol, 40); + ctx.lineTo(110, -20+tol); + ctx.lineTo(110, 100-tol); + ctx.fill(); + + var g = ctx.createRadialGradient(30+10*5/2, 40, 10*3/2, 30+10*15/4, 40, 10*9/4); + g.addColorStop(0, '#0f0'); + g.addColorStop(1, '#0f0'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixelApprox(canvas, 98,25, 0,255,0,255, 1); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixelApprox(canvas, 50,48, 0,255,0,255, 1); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.shape2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.shape2.html new file mode 100644 index 0000000000..1c7660ac99 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.shape2.html @@ -0,0 +1,52 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.cone.shape2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.cone.shape2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var tol = 1; // tolerance to avoid antialiasing artifacts + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createRadialGradient(30+10*5/2, 40, 10*3/2, 30+10*15/4, 40, 10*9/4); + g.addColorStop(0, '#f00'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + + ctx.fillStyle = '#0f0'; + ctx.beginPath(); + ctx.moveTo(30-tol, 40); + ctx.lineTo(110, -20-tol); + ctx.lineTo(110, 100+tol); + ctx.fill(); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixelApprox(canvas, 98,25, 0,255,0,255, 1); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixelApprox(canvas, 50,48, 0,255,0,255, 1); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.top.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.top.html new file mode 100644 index 0000000000..6760b18db7 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.cone.top.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.cone.top</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.cone.top</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createRadialGradient(230, 25, 100, 100, 25, 101); + g.addColorStop(0, '#f00'); + g.addColorStop(1, '#0f0'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixelApprox(canvas, 98,25, 0,255,0,255, 1); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixelApprox(canvas, 50,48, 0,255,0,255, 1); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.equal.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.equal.html new file mode 100644 index 0000000000..1ff7c44193 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.equal.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.equal</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.equal</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createRadialGradient(50, 25, 20, 50, 25, 20); + g.addColorStop(0, '#f00'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixelApprox(canvas, 98,25, 0,255,0,255, 1); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixelApprox(canvas, 50,48, 0,255,0,255, 1); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.inside1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.inside1.html new file mode 100644 index 0000000000..00ece5750e --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.inside1.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.inside1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.inside1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createRadialGradient(50, 25, 100, 50, 25, 200); + g.addColorStop(0, '#0f0'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixelApprox(canvas, 98,25, 0,255,0,255, 1); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixelApprox(canvas, 50,48, 0,255,0,255, 1); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.inside2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.inside2.html new file mode 100644 index 0000000000..be9c1a810a --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.inside2.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.inside2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.inside2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createRadialGradient(50, 25, 200, 50, 25, 100); + g.addColorStop(0, '#f00'); + g.addColorStop(1, '#0f0'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixelApprox(canvas, 98,25, 0,255,0,255, 1); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixelApprox(canvas, 50,48, 0,255,0,255, 1); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.inside3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.inside3.html new file mode 100644 index 0000000000..5e9bd4c721 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.inside3.html @@ -0,0 +1,44 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.inside3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.inside3</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createRadialGradient(50, 25, 200, 50, 25, 100); + g.addColorStop(0, '#f00'); + g.addColorStop(0.993, '#f00'); + g.addColorStop(1, '#0f0'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixelApprox(canvas, 98,25, 0,255,0,255, 1); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixelApprox(canvas, 50,48, 0,255,0,255, 1); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.negative.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.negative.html new file mode 100644 index 0000000000..d86812b68c --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.negative.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.negative</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.negative</h1> +<p class="desc">createRadialGradient() throws INDEX_SIZE_ERR if either radius is negative</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test("createRadialGradient() throws INDEX_SIZE_ERR if either radius is negative"); +_addTest(function(canvas, ctx) { + + assert_throws_dom("INDEX_SIZE_ERR", function() { ctx.createRadialGradient(0, 0, -0.1, 0, 0, 1); }); + assert_throws_dom("INDEX_SIZE_ERR", function() { ctx.createRadialGradient(0, 0, 1, 0, 0, -0.1); }); + assert_throws_dom("INDEX_SIZE_ERR", function() { ctx.createRadialGradient(0, 0, -0.1, 0, 0, -0.1); }); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.nonfinite.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.nonfinite.html new file mode 100644 index 0000000000..0c16b41540 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.nonfinite.html @@ -0,0 +1,100 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.nonfinite</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.nonfinite</h1> +<p class="desc">createRadialGradient() throws TypeError if arguments are not finite</p> + +<p class="notes">Defined in "Web IDL" (draft) +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test("createRadialGradient() throws TypeError if arguments are not finite"); +_addTest(function(canvas, ctx) { + + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, 0, 1, 0, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(-Infinity, 0, 1, 0, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(NaN, 0, 1, 0, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, Infinity, 1, 0, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, -Infinity, 1, 0, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, NaN, 1, 0, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, Infinity, 0, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, -Infinity, 0, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, NaN, 0, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, 1, Infinity, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, 1, -Infinity, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, 1, NaN, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, 1, 0, Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, 1, 0, -Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, 1, 0, NaN, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, 1, 0, 0, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, 1, 0, 0, -Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, 1, 0, 0, NaN); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, Infinity, 1, 0, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, Infinity, Infinity, 0, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, Infinity, Infinity, Infinity, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, Infinity, Infinity, Infinity, Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, Infinity, Infinity, Infinity, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, Infinity, Infinity, Infinity, 0, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, Infinity, Infinity, 0, Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, Infinity, Infinity, 0, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, Infinity, Infinity, 0, 0, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, Infinity, 1, Infinity, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, Infinity, 1, Infinity, Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, Infinity, 1, Infinity, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, Infinity, 1, Infinity, 0, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, Infinity, 1, 0, Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, Infinity, 1, 0, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, Infinity, 1, 0, 0, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, 0, Infinity, 0, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, 0, Infinity, Infinity, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, 0, Infinity, Infinity, Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, 0, Infinity, Infinity, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, 0, Infinity, Infinity, 0, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, 0, Infinity, 0, Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, 0, Infinity, 0, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, 0, Infinity, 0, 0, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, 0, 1, Infinity, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, 0, 1, Infinity, Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, 0, 1, Infinity, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, 0, 1, Infinity, 0, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, 0, 1, 0, Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, 0, 1, 0, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(Infinity, 0, 1, 0, 0, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, Infinity, Infinity, 0, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, Infinity, Infinity, Infinity, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, Infinity, Infinity, Infinity, Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, Infinity, Infinity, Infinity, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, Infinity, Infinity, Infinity, 0, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, Infinity, Infinity, 0, Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, Infinity, Infinity, 0, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, Infinity, Infinity, 0, 0, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, Infinity, 1, Infinity, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, Infinity, 1, Infinity, Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, Infinity, 1, Infinity, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, Infinity, 1, Infinity, 0, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, Infinity, 1, 0, Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, Infinity, 1, 0, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, Infinity, 1, 0, 0, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, Infinity, Infinity, 0, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, Infinity, Infinity, Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, Infinity, Infinity, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, Infinity, Infinity, 0, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, Infinity, 0, Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, Infinity, 0, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, Infinity, 0, 0, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, 1, Infinity, Infinity, 1); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, 1, Infinity, Infinity, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, 1, Infinity, 0, Infinity); }); + assert_throws_js(TypeError, function() { ctx.createRadialGradient(0, 0, 1, 0, Infinity, Infinity); }); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.outside1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.outside1.html new file mode 100644 index 0000000000..ea9dfdb3bb --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.outside1.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.outside1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.outside1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createRadialGradient(200, 25, 10, 200, 25, 20); + g.addColorStop(0, '#f00'); + g.addColorStop(1, '#0f0'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixelApprox(canvas, 98,25, 0,255,0,255, 1); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixelApprox(canvas, 50,48, 0,255,0,255, 1); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.outside2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.outside2.html new file mode 100644 index 0000000000..b07fd02518 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.outside2.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.outside2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.outside2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createRadialGradient(200, 25, 20, 200, 25, 10); + g.addColorStop(0, '#0f0'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixelApprox(canvas, 98,25, 0,255,0,255, 1); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixelApprox(canvas, 50,48, 0,255,0,255, 1); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.outside3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.outside3.html new file mode 100644 index 0000000000..7c19baf5c5 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.outside3.html @@ -0,0 +1,44 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.outside3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.outside3</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createRadialGradient(200, 25, 20, 200, 25, 10); + g.addColorStop(0, '#0f0'); + g.addColorStop(0.001, '#f00'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixelApprox(canvas, 98,25, 0,255,0,255, 1); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixelApprox(canvas, 50,48, 0,255,0,255, 1); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.touch1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.touch1.html new file mode 100644 index 0000000000..6487fc440b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.touch1.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.touch1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.touch1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createRadialGradient(150, 25, 50, 200, 25, 100); + g.addColorStop(0, '#f00'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixelApprox(canvas, 98,25, 0,255,0,255, 1); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixelApprox(canvas, 50,48, 0,255,0,255, 1); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.touch2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.touch2.html new file mode 100644 index 0000000000..908a0dbc19 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.touch2.html @@ -0,0 +1,45 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.touch2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.touch2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createRadialGradient(-80, 25, 70, 0, 25, 150); + g.addColorStop(0, '#f00'); + g.addColorStop(0.01, '#0f0'); + g.addColorStop(0.99, '#0f0'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixelApprox(canvas, 98,25, 0,255,0,255, 1); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixelApprox(canvas, 50,48, 0,255,0,255, 1); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.touch3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.touch3.html new file mode 100644 index 0000000000..07f52d7363 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.touch3.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.touch3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.touch3</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + var g = ctx.createRadialGradient(120, -15, 25, 140, -30, 50); + g.addColorStop(0, '#f00'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixelApprox(canvas, 98,25, 0,255,0,255, 1); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixelApprox(canvas, 50,48, 0,255,0,255, 1); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.transform.1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.transform.1.html new file mode 100644 index 0000000000..d0eb13c457 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.transform.1.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.transform.1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.transform.1</h1> +<p class="desc">Radial gradient coordinates are relative to the coordinate space at the time of filling</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("Radial gradient coordinates are relative to the coordinate space at the time of filling"); +_addTest(function(canvas, ctx) { + + var g = ctx.createRadialGradient(0, 0, 0, 0, 0, 11.2); + g.addColorStop(0, '#0f0'); + g.addColorStop(0.5, '#0f0'); + g.addColorStop(0.51, '#f00'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.translate(50, 25); + ctx.scale(10, 10); + ctx.fillRect(-5, -2.5, 10, 5); + _assertPixel(canvas, 25,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixel(canvas, 75,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.transform.2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.transform.2.html new file mode 100644 index 0000000000..6e56c4c63b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.transform.2.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.transform.2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.transform.2</h1> +<p class="desc">Radial gradient coordinates are relative to the coordinate space at the time of filling</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("Radial gradient coordinates are relative to the coordinate space at the time of filling"); +_addTest(function(canvas, ctx) { + + ctx.translate(100, 0); + var g = ctx.createRadialGradient(0, 0, 0, 0, 0, 11.2); + g.addColorStop(0, '#0f0'); + g.addColorStop(0.5, '#0f0'); + g.addColorStop(0.51, '#f00'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.translate(-50, 25); + ctx.scale(10, 10); + ctx.fillRect(-5, -2.5, 10, 5); + _assertPixel(canvas, 25,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixel(canvas, 75,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.transform.3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.transform.3.html new file mode 100644 index 0000000000..426021d097 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.gradient.radial.transform.3.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.gradient.radial.transform.3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.gradient.radial.transform.3</h1> +<p class="desc">Radial gradient transforms do not experience broken caching effects</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("Radial gradient transforms do not experience broken caching effects"); +_addTest(function(canvas, ctx) { + + var g = ctx.createRadialGradient(0, 0, 0, 0, 0, 11.2); + g.addColorStop(0, '#0f0'); + g.addColorStop(0.5, '#0f0'); + g.addColorStop(0.51, '#f00'); + g.addColorStop(1, '#f00'); + ctx.fillStyle = g; + ctx.fillRect(0, 0, 100, 50); + ctx.translate(50, 25); + ctx.scale(10, 10); + ctx.fillRect(-5, -2.5, 10, 5); + _assertPixel(canvas, 25,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixel(canvas, 75,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.animated.gif.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.animated.gif.html new file mode 100644 index 0000000000..be69cca997 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.animated.gif.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.animated.gif</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.animated.gif</h1> +<p class="desc">createPattern() of an animated GIF draws the first frame</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("createPattern() of an animated GIF draws the first frame"); +_addTest(function(canvas, ctx) { + + deferTest(); + step_timeout(function () { + var pattern = ctx.createPattern(document.getElementById('anim-gr.gif'), 'repeat'); + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 50, 50); + step_timeout(t.step_func_done(function () { + ctx.fillRect(50, 0, 50, 50); + _assertPixelApprox(canvas, 25,25, 0,255,0,255, 2); + _assertPixelApprox(canvas, 75,25, 0,255,0,255, 2); + }), 250); + }, 250); + +}); +</script> +<img src="/images/anim-gr.gif" id="anim-gr.gif" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.basic.canvas.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.basic.canvas.html new file mode 100644 index 0000000000..069263adff --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.basic.canvas.html @@ -0,0 +1,48 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.basic.canvas</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.basic.canvas</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var canvas2 = document.createElement('canvas'); + canvas2.width = 100; + canvas2.height = 50; + var ctx2 = canvas2.getContext('2d'); + ctx2.fillStyle = '#0f0'; + ctx2.fillRect(0, 0, 100, 50); + + var pattern = ctx.createPattern(canvas2, 'no-repeat'); + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 50,25, 0,255,0,255); + _assertPixel(canvas, 98,25, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 50,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.basic.image.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.basic.image.html new file mode 100644 index 0000000000..5ebffe50f6 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.basic.image.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.basic.image</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.basic.image</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + var img = document.getElementById('green.png'); + var pattern = ctx.createPattern(img, 'no-repeat'); + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/green.png" id="green.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.basic.nocontext.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.basic.nocontext.html new file mode 100644 index 0000000000..f24899c302 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.basic.nocontext.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.basic.nocontext</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.basic.nocontext</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var canvas2 = document.createElement('canvas'); + canvas2.width = 100; + canvas2.height = 50; + var pattern = ctx.createPattern(canvas2, 'no-repeat'); + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + ctx.fillStyle = '#f00'; + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.basic.type.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.basic.type.html new file mode 100644 index 0000000000..c510063d80 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.basic.type.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.basic.type</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.basic.type</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + _assertDifferent(window.CanvasPattern, undefined, "window.CanvasPattern", "undefined"); + + window.CanvasPattern.prototype.thisImplementsCanvasPattern = true; + + var img = document.getElementById('green.png'); + var pattern = ctx.createPattern(img, 'no-repeat'); + _assert(pattern.thisImplementsCanvasPattern, "pattern.thisImplementsCanvasPattern"); + +}); +</script> +<img src="/images/green.png" id="green.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.basic.zerocanvas.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.basic.zerocanvas.html new file mode 100644 index 0000000000..fbeb7bd797 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.basic.zerocanvas.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.basic.zerocanvas</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.basic.zerocanvas</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + canvas.width = 0; + canvas.height = 10; + _assertSame(canvas.width, 0, "canvas.width", "0"); + _assertSame(canvas.height, 10, "canvas.height", "10"); + assert_throws_dom("INVALID_STATE_ERR", function() { ctx.createPattern(canvas, 'repeat'); }); + + canvas.width = 10; + canvas.height = 0; + _assertSame(canvas.width, 10, "canvas.width", "10"); + _assertSame(canvas.height, 0, "canvas.height", "0"); + assert_throws_dom("INVALID_STATE_ERR", function() { ctx.createPattern(canvas, 'repeat'); }); + + canvas.width = 0; + canvas.height = 0; + _assertSame(canvas.width, 0, "canvas.width", "0"); + _assertSame(canvas.height, 0, "canvas.height", "0"); + assert_throws_dom("INVALID_STATE_ERR", function() { ctx.createPattern(canvas, 'repeat'); }); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.crosscanvas.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.crosscanvas.html new file mode 100644 index 0000000000..f93b36ddf2 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.crosscanvas.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.crosscanvas</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.crosscanvas</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = document.getElementById('green.png'); + + var pattern = document.createElement('canvas').getContext('2d').createPattern(img, 'no-repeat'); + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> +<img src="/images/green.png" id="green.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.broken.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.broken.html new file mode 100644 index 0000000000..2cf21746ca --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.broken.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.image.broken</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.image.broken</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = document.getElementById('broken.png'); + assert_throws_dom("INVALID_STATE_ERR", function() { ctx.createPattern(img, 'repeat'); }); + +}); +</script> +<img src="/images/broken.png" id="broken.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.incomplete.emptysrc.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.incomplete.emptysrc.html new file mode 100644 index 0000000000..fb05cbb455 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.incomplete.emptysrc.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.image.incomplete.emptysrc</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.image.incomplete.emptysrc</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = document.getElementById('red.png'); + img.src = ""; + _assertSame(ctx.createPattern(img, 'repeat'), null, "ctx.createPattern(img, 'repeat')", "null"); + +}); +</script> +<img src="/images/red.png" id="red.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.incomplete.immediate.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.incomplete.immediate.html new file mode 100644 index 0000000000..375c1b49c9 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.incomplete.immediate.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.image.incomplete.immediate</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.image.incomplete.immediate</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = new Image(); + img.src = '../images/red.png'; + // This triggers the "update the image data" algorithm. + // The image will not go to the "completely available" state + // until a fetch task in the networking task source is processed, + // so the image must not be fully decodable yet: + _assertSame(ctx.createPattern(img, 'repeat'), null, "ctx.createPattern(img, 'repeat')", "null"); + +}); +</script> +<img src="/images/red.png" id="red.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.incomplete.nosrc.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.incomplete.nosrc.html new file mode 100644 index 0000000000..d43a0ca918 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.incomplete.nosrc.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.image.incomplete.nosrc</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.image.incomplete.nosrc</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = new Image(); + _assertSame(ctx.createPattern(img, 'repeat'), null, "ctx.createPattern(img, 'repeat')", "null"); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.incomplete.reload.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.incomplete.reload.html new file mode 100644 index 0000000000..984bd36a74 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.incomplete.reload.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.image.incomplete.reload</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.image.incomplete.reload</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = document.getElementById('yellow.png'); + img.src = '../images/red.png'; + // This triggers the "update the image data" algorithm, + // and resets the image to the "unavailable" state. + // The image will not go to the "completely available" state + // until a fetch task in the networking task source is processed, + // so the image must not be fully decodable yet: + _assertSame(ctx.createPattern(img, 'repeat'), null, "ctx.createPattern(img, 'repeat')", "null"); + +}); +</script> +<img src="/images/yellow.png" id="yellow.png" class="resource"> +<img src="/images/red.png" id="red.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.incomplete.removedsrc.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.incomplete.removedsrc.html new file mode 100644 index 0000000000..20d5543684 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.incomplete.removedsrc.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.image.incomplete.removedsrc</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.image.incomplete.removedsrc</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = document.getElementById('red.png'); + img.removeAttribute('src'); + _assertSame(ctx.createPattern(img, 'repeat'), null, "ctx.createPattern(img, 'repeat')", "null"); + +}); +</script> +<img src="/images/red.png" id="red.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.nonexistent-but-loading.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.nonexistent-but-loading.html new file mode 100644 index 0000000000..2af0a3ed09 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.nonexistent-but-loading.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.image.nonexistent-but-loading</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.image.nonexistent-but-loading</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = document.createElement("img"); + img.src = "/images/no-such-image-really.png"; + _assertSame(ctx.createPattern(img, 'repeat'), null, "ctx.createPattern(img, 'repeat')", "null"); + var img = document.createElementNS("http://www.w3.org/2000/svg", "image"); + img.src = "/images/no-such-image-really.png"; + _assertSame(ctx.createPattern(img, 'repeat'), null, "ctx.createPattern(img, 'repeat')", "null"); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.nonexistent.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.nonexistent.html new file mode 100644 index 0000000000..b365281179 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.nonexistent.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.image.nonexistent</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.image.nonexistent</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = document.getElementById('no-such-image-really.png'); + assert_throws_dom("INVALID_STATE_ERR", function() { ctx.createPattern(img, 'repeat'); }); + +}); +</script> +<img src="/images/no-such-image-really.png" id="no-such-image-really.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.nosrc.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.nosrc.html new file mode 100644 index 0000000000..710749dd54 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.nosrc.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.image.nosrc</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.image.nosrc</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = document.createElement("img"); + _assertSame(ctx.createPattern(img, 'repeat'), null, "ctx.createPattern(img, 'repeat')", "null"); + var img = document.createElementNS("http://www.w3.org/2000/svg", "image"); + _assertSame(ctx.createPattern(img, 'repeat'), null, "ctx.createPattern(img, 'repeat')", "null"); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.null.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.null.html new file mode 100644 index 0000000000..8ae002d682 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.null.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.image.null</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.image.null</h1> +<p class="desc"></p> + +<p class="notes">Defined in "Web IDL" (draft) +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + assert_throws_js(TypeError, function() { ctx.createPattern(null, 'repeat'); }); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.string.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.string.html new file mode 100644 index 0000000000..af32e63bba --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.string.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.image.string</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.image.string</h1> +<p class="desc"></p> + +<p class="notes">Defined in "Web IDL" (draft) +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + assert_throws_js(TypeError, function() { ctx.createPattern('../images/red.png', 'repeat'); }); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.undefined.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.undefined.html new file mode 100644 index 0000000000..75f50c7a4a --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.undefined.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.image.undefined</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.image.undefined</h1> +<p class="desc"></p> + +<p class="notes">Defined in "Web IDL" (draft) +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + assert_throws_js(TypeError, function() { ctx.createPattern(undefined, 'repeat'); }); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.zeroheight.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.zeroheight.html new file mode 100644 index 0000000000..cd12c2e883 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.zeroheight.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.image.zeroheight</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.image.zeroheight</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = document.getElementById('red-zeroheight.svg'); + _assertSame(ctx.createPattern(img, 'repeat'), null, "ctx.createPattern(img, 'repeat')", "null"); + +}); +</script> +<img src="/images/red-zeroheight.svg" id="red-zeroheight.svg" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.zerowidth.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.zerowidth.html new file mode 100644 index 0000000000..053b8ac648 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.image.zerowidth.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.image.zerowidth</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.image.zerowidth</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = document.getElementById('red-zerowidth.svg'); + _assertSame(ctx.createPattern(img, 'repeat'), null, "ctx.createPattern(img, 'repeat')", "null"); + +}); +</script> +<img src="/images/red-zerowidth.svg" id="red-zerowidth.svg" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.modify.canvas1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.modify.canvas1.html new file mode 100644 index 0000000000..0524351fdb --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.modify.canvas1.html @@ -0,0 +1,44 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.modify.canvas1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.modify.canvas1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var canvas2 = document.createElement('canvas'); + canvas2.width = 100; + canvas2.height = 50; + var ctx2 = canvas2.getContext('2d'); + ctx2.fillStyle = '#0f0'; + ctx2.fillRect(0, 0, 100, 50); + + var pattern = ctx.createPattern(canvas2, 'no-repeat'); + + ctx2.fillStyle = '#f00'; + ctx2.fillRect(0, 0, 100, 50); + + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.modify.canvas2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.modify.canvas2.html new file mode 100644 index 0000000000..6e50a5761c --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.modify.canvas2.html @@ -0,0 +1,48 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.modify.canvas2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.modify.canvas2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var canvas2 = document.createElement('canvas'); + canvas2.width = 100; + canvas2.height = 50; + var ctx2 = canvas2.getContext('2d'); + ctx2.fillStyle = '#0f0'; + ctx2.fillRect(0, 0, 100, 50); + + var pattern = ctx.createPattern(canvas2, 'no-repeat'); + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + ctx2.fillStyle = '#f00'; + ctx2.fillRect(0, 0, 100, 50); + + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.modify.image1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.modify.image1.html new file mode 100644 index 0000000000..94f55c84f6 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.modify.image1.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.modify.image1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.modify.image1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = document.getElementById('green.png'); + var pattern = ctx.createPattern(img, 'no-repeat'); + deferTest(); + img.onload = t.step_func_done(function () + { + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + }); + img.src = '/images/red.png'; + +}); +</script> +<img src="/images/green.png" id="green.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.modify.image2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.modify.image2.html new file mode 100644 index 0000000000..1025d195f2 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.modify.image2.html @@ -0,0 +1,44 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.modify.image2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.modify.image2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = document.getElementById('green.png'); + var pattern = ctx.createPattern(img, 'no-repeat'); + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + ctx.fillStyle = '#00f'; + ctx.fillRect(0, 0, 100, 50); + deferTest(); + img.onload = t.step_func_done(function () + { + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + }); + img.src = '/images/red.png'; + +}); +</script> +<img src="/images/green.png" id="green.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.norepeat.basic.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.norepeat.basic.html new file mode 100644 index 0000000000..036be9e068 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.norepeat.basic.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.paint.norepeat.basic</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.paint.norepeat.basic</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var img = document.getElementById('green.png'); + var pattern = ctx.createPattern(img, 'no-repeat'); + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/green.png" id="green.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.norepeat.coord1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.norepeat.coord1.html new file mode 100644 index 0000000000..dfe2b8589e --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.norepeat.coord1.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.paint.norepeat.coord1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.paint.norepeat.coord1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 50, 50); + ctx.fillStyle = '#f00'; + ctx.fillRect(50, 0, 50, 50); + + var img = document.getElementById('green.png'); + var pattern = ctx.createPattern(img, 'no-repeat'); + ctx.fillStyle = pattern; + ctx.translate(50, 0); + ctx.fillRect(-50, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/green.png" id="green.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.norepeat.coord2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.norepeat.coord2.html new file mode 100644 index 0000000000..dfd637211d --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.norepeat.coord2.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.paint.norepeat.coord2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.paint.norepeat.coord2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = document.getElementById('green.png'); + var pattern = ctx.createPattern(img, 'no-repeat'); + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 50, 50); + + ctx.fillStyle = '#f00'; + ctx.fillRect(50, 0, 50, 50); + + ctx.fillStyle = pattern; + ctx.translate(50, 0); + ctx.fillRect(-50, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/green.png" id="green.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.norepeat.coord3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.norepeat.coord3.html new file mode 100644 index 0000000000..5456a543da --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.norepeat.coord3.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.paint.norepeat.coord3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.paint.norepeat.coord3</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + var img = document.getElementById('red.png'); + var pattern = ctx.createPattern(img, 'no-repeat'); + ctx.fillStyle = pattern; + ctx.translate(50, 25); + ctx.fillRect(-50, -25, 100, 50); + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 50, 25); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/red.png" id="red.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.norepeat.outside.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.norepeat.outside.html new file mode 100644 index 0000000000..4df0cdfe67 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.norepeat.outside.html @@ -0,0 +1,44 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.paint.norepeat.outside</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.paint.norepeat.outside</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var img = document.getElementById('red.png'); + var pattern = ctx.createPattern(img, 'no-repeat'); + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + ctx.fillStyle = pattern; + ctx.fillRect(0, -50, 100, 50); + ctx.fillRect(-100, 0, 100, 50); + ctx.fillRect(0, 50, 100, 50); + ctx.fillRect(100, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/red.png" id="red.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.orientation.canvas.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.orientation.canvas.html new file mode 100644 index 0000000000..f0ad70fc1e --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.orientation.canvas.html @@ -0,0 +1,47 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.paint.orientation.canvas</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.paint.orientation.canvas</h1> +<p class="desc">Canvas patterns do not get flipped when painted</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("Canvas patterns do not get flipped when painted"); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var canvas2 = document.createElement('canvas'); + canvas2.width = 100; + canvas2.height = 50; + var ctx2 = canvas2.getContext('2d'); + ctx2.fillStyle = '#f00'; + ctx2.fillRect(0, 0, 100, 25); + ctx2.fillStyle = '#0f0'; + ctx2.fillRect(0, 25, 100, 25); + + var pattern = ctx.createPattern(canvas2, 'no-repeat'); + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 25); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.orientation.image.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.orientation.image.html new file mode 100644 index 0000000000..b45f4ab773 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.orientation.image.html @@ -0,0 +1,44 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.paint.orientation.image</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.paint.orientation.image</h1> +<p class="desc">Image patterns do not get flipped when painted</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("Image patterns do not get flipped when painted"); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var img = document.getElementById('rrgg-256x256.png'); + var pattern = ctx.createPattern(img, 'no-repeat'); + ctx.fillStyle = pattern; + ctx.save(); + ctx.translate(0, -103); + ctx.fillRect(0, 103, 100, 50); + ctx.restore(); + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 25); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/rrgg-256x256.png" id="rrgg-256x256.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeat.basic.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeat.basic.html new file mode 100644 index 0000000000..8999ac4e44 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeat.basic.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.paint.repeat.basic</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.paint.repeat.basic</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var img = document.getElementById('green-16x16.png'); + var pattern = ctx.createPattern(img, 'repeat'); + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/green-16x16.png" id="green-16x16.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeat.coord1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeat.coord1.html new file mode 100644 index 0000000000..8dc6402d55 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeat.coord1.html @@ -0,0 +1,39 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.paint.repeat.coord1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.paint.repeat.coord1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var img = document.getElementById('rgrg-256x256.png'); + var pattern = ctx.createPattern(img, 'repeat'); + ctx.fillStyle = pattern; + ctx.translate(-128, -78); + ctx.fillRect(128, 78, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/rgrg-256x256.png" id="rgrg-256x256.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeat.coord2.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeat.coord2.html new file mode 100644 index 0000000000..9c03d02898 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeat.coord2.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.paint.repeat.coord2</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.paint.repeat.coord2</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = document.getElementById('ggrr-256x256.png'); + var pattern = ctx.createPattern(img, 'repeat'); + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/ggrr-256x256.png" id="ggrr-256x256.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeat.coord3.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeat.coord3.html new file mode 100644 index 0000000000..0dc0a865b4 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeat.coord3.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.paint.repeat.coord3</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.paint.repeat.coord3</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = document.getElementById('rgrg-256x256.png'); + var pattern = ctx.createPattern(img, 'repeat'); + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + + ctx.translate(-128, -78); + ctx.fillRect(128, 78, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/rgrg-256x256.png" id="rgrg-256x256.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeat.outside.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeat.outside.html new file mode 100644 index 0000000000..b939195877 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeat.outside.html @@ -0,0 +1,39 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.paint.repeat.outside</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.paint.repeat.outside</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + + var img = document.getElementById('green-16x16.png'); + var pattern = ctx.createPattern(img, 'repeat'); + ctx.fillStyle = pattern; + ctx.translate(50, 25); + ctx.fillRect(-50, -25, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/green-16x16.png" id="green-16x16.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeatx.basic.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeatx.basic.html new file mode 100644 index 0000000000..8c77908cd1 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeatx.basic.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.paint.repeatx.basic</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.paint.repeatx.basic</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 16); + + var img = document.getElementById('green-16x16.png'); + var pattern = ctx.createPattern(img, 'repeat-x'); + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/green-16x16.png" id="green-16x16.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeatx.coord1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeatx.coord1.html new file mode 100644 index 0000000000..4c7fa9d498 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeatx.coord1.html @@ -0,0 +1,44 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.paint.repeatx.coord1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.paint.repeatx.coord1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + var img = document.getElementById('red-16x16.png'); + var pattern = ctx.createPattern(img, 'repeat-x'); + ctx.fillStyle = pattern; + ctx.translate(0, 16); + ctx.fillRect(0, -16, 100, 50); + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 16); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,25, 0,255,0,255); + _assertPixel(canvas, 98,25, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/red-16x16.png" id="red-16x16.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeatx.outside.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeatx.outside.html new file mode 100644 index 0000000000..26ee85e4d1 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeatx.outside.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.paint.repeatx.outside</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.paint.repeatx.outside</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + var img = document.getElementById('red-16x16.png'); + var pattern = ctx.createPattern(img, 'repeat-x'); + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 16); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/red-16x16.png" id="red-16x16.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeaty.basic.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeaty.basic.html new file mode 100644 index 0000000000..c28ff155eb --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeaty.basic.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.paint.repeaty.basic</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.paint.repeaty.basic</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 16, 50); + + var img = document.getElementById('green-16x16.png'); + var pattern = ctx.createPattern(img, 'repeat-y'); + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/green-16x16.png" id="green-16x16.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeaty.coord1.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeaty.coord1.html new file mode 100644 index 0000000000..7f2bb163f3 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeaty.coord1.html @@ -0,0 +1,44 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.paint.repeaty.coord1</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.paint.repeaty.coord1</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + var img = document.getElementById('red-16x16.png'); + var pattern = ctx.createPattern(img, 'repeat-y'); + ctx.fillStyle = pattern; + ctx.translate(48, 0); + ctx.fillRect(-48, 0, 100, 50); + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 16, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 50,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 50,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/red-16x16.png" id="red-16x16.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeaty.outside.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeaty.outside.html new file mode 100644 index 0000000000..7be743ec2b --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.paint.repeaty.outside.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.paint.repeaty.outside</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.paint.repeaty.outside</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + + var img = document.getElementById('red-16x16.png'); + var pattern = ctx.createPattern(img, 'repeat-y'); + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 16, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/red-16x16.png" id="red-16x16.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.case.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.case.html new file mode 100644 index 0000000000..d998bbeb2f --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.case.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.repeat.case</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.repeat.case</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + assert_throws_dom("SYNTAX_ERR", function() { ctx.createPattern(canvas, "Repeat"); }); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.empty.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.empty.html new file mode 100644 index 0000000000..2810efe700 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.empty.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.repeat.empty</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.repeat.empty</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + ctx.fillStyle = '#f00'; + ctx.fillRect(0, 0, 100, 50); + var img = document.getElementById('green-1x1.png'); + var pattern = ctx.createPattern(img, ""); + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 200, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> +<img src="/images/green-1x1.png" id="green-1x1.png" class="resource"> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.null.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.null.html new file mode 100644 index 0000000000..0de121a4f5 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.null.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.repeat.null</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.repeat.null</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + _assert(ctx.createPattern(canvas, null) != null, "ctx.createPattern(canvas, null) != null"); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.nullsuffix.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.nullsuffix.html new file mode 100644 index 0000000000..33d601d974 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.nullsuffix.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.repeat.nullsuffix</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.repeat.nullsuffix</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + assert_throws_dom("SYNTAX_ERR", function() { ctx.createPattern(canvas, "repeat\0"); }); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.undefined.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.undefined.html new file mode 100644 index 0000000000..f0a7ae8488 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.undefined.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.repeat.undefined</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.repeat.undefined</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + assert_throws_dom("SYNTAX_ERR", function() { ctx.createPattern(canvas, undefined); }); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.unrecognised.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.unrecognised.html new file mode 100644 index 0000000000..cdcc7d6523 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.unrecognised.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.repeat.unrecognised</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.repeat.unrecognised</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + assert_throws_dom("SYNTAX_ERR", function() { ctx.createPattern(canvas, "invalid"); }); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.unrecognisednull.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.unrecognisednull.html new file mode 100644 index 0000000000..11c9ec0ebb --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.repeat.unrecognisednull.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.repeat.unrecognisednull</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.repeat.unrecognisednull</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + assert_throws_dom("SYNTAX_ERR", function() { ctx.createPattern(canvas, "null"); }); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.svgimage.nonexistent.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.svgimage.nonexistent.html new file mode 100644 index 0000000000..8cd3983dc3 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.svgimage.nonexistent.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.svgimage.nonexistent</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.svgimage.nonexistent</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = document.getElementById('no-such-image-really.png'); + assert_throws_dom("INVALID_STATE_ERR", function() { ctx.createPattern(img, 'repeat'); }); + +}); +</script> +<svg><image xlink:href="/images/no-such-image-really.png" id="no-such-image-really.png" class="resource"></svg> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.svgimage.zeroheight.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.svgimage.zeroheight.html new file mode 100644 index 0000000000..11c07e36de --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.svgimage.zeroheight.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.svgimage.zeroheight</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.svgimage.zeroheight</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = document.getElementById('red-zeroheight.svg'); + _assertSame(ctx.createPattern(img, 'repeat'), null, "ctx.createPattern(img, 'repeat')", "null"); + +}); +</script> +<svg><image xlink:href="/images/red-zeroheight.svg" id="red-zeroheight.svg" class="resource"></svg> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.svgimage.zerowidth.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.svgimage.zerowidth.html new file mode 100644 index 0000000000..a8b8cb1351 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.svgimage.zerowidth.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.svgimage.zerowidth</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.svgimage.zerowidth</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var img = document.getElementById('red-zerowidth.svg'); + _assertSame(ctx.createPattern(img, 'repeat'), null, "ctx.createPattern(img, 'repeat')", "null"); + +}); +</script> +<svg><image xlink:href="/images/red-zerowidth.svg" id="red-zerowidth.svg" class="resource"></svg> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.transform.identity.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.transform.identity.html new file mode 100644 index 0000000000..21da30581d --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.transform.identity.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.transform.identity</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.transform.identity</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var canvas2 = document.createElement('canvas'); + canvas2.width = 100; + canvas2.height = 50; + var pattern = ctx.createPattern(canvas2, 'no-repeat'); + pattern.setTransform(new DOMMatrix()); + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + ctx.fillStyle = '#f00'; + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.transform.infinity.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.transform.infinity.html new file mode 100644 index 0000000000..bfb22aeb14 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.transform.infinity.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.transform.infinity</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.transform.infinity</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var canvas2 = document.createElement('canvas'); + canvas2.width = 100; + canvas2.height = 50; + var pattern = ctx.createPattern(canvas2, 'no-repeat'); + pattern.setTransform({a: Infinity}); + + ctx.fillStyle = '#0f0'; + ctx.fillRect(0, 0, 100, 50); + ctx.fillStyle = '#f00'; + ctx.fillStyle = pattern; + ctx.fillRect(0, 0, 100, 50); + + _assertPixel(canvas, 1,1, 0,255,0,255); + _assertPixel(canvas, 98,1, 0,255,0,255); + _assertPixel(canvas, 1,48, 0,255,0,255); + _assertPixel(canvas, 98,48, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.transform.invalid.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.transform.invalid.html new file mode 100644 index 0000000000..13f0459e9f --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.pattern.transform.invalid.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.pattern.transform.invalid</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.pattern.transform.invalid</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + var canvas2 = document.createElement('canvas'); + canvas2.width = 100; + canvas2.height = 50; + var pattern = ctx.createPattern(canvas2, 'no-repeat'); + assert_throws_js(TypeError, function() { pattern.setTransform({a: 1, m11: 2}); }); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.colorObject.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.colorObject.html new file mode 100644 index 0000000000..308e6b54b7 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.colorObject.html @@ -0,0 +1,44 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.strokeStyle.colorObject</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.strokeStyle.colorObject</h1> +<p class="desc">ctx.strokeStyle works with color objects</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("ctx.strokeStyle works with color objects"); +_addTest(function(canvas, ctx) { + + ctx.lineWidth = 50; + ctx.strokeStyle = {r: 1, g: 0, b: 0}; + ctx.strokeRect(25, 24, 50, 2); + _assertPixel(canvas, 50,25, 255,0,0,255); + ctx.strokeStyle = {r: 0, g: 0, b: 1}; + ctx.strokeRect(25, 24, 50, 2); + _assertPixel(canvas, 50,25, 0,0,255,255); + ctx.strokeStyle = {r: 0.2, g: 0.4, b: 0.6}; + ctx.strokeRect(25, 24, 50, 2); + _assertPixel(canvas, 50,25, 51,102,153,255); + ctx.strokeStyle = {r: 0, g: 1, b: 0}; + ctx.strokeRect(25, 24, 50, 2); + _assertPixel(canvas, 50,25, 0,255,0,255); + ctx.strokeStyle = {r: -1, g: 0, b: 0}; + ctx.strokeRect(25, 24, 50, 2); + _assertPixel(canvas, 50,25, 0,0,0,255); + ctx.strokeStyle = {r: 0, g: 2, b: 0}; + ctx.strokeRect(25, 24, 50, 2); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.colorObject.transparency.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.colorObject.transparency.html new file mode 100644 index 0000000000..0232140eaf --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.colorObject.transparency.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.strokeStyle.colorObject.transparency</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.strokeStyle.colorObject.transparency</h1> +<p class="desc">ctx.strokeStyle with color objects has transparency</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> +<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt=""> +<ul id="d"></ul> +<script> +var t = async_test("ctx.strokeStyle with color objects has transparency"); +_addTest(function(canvas, ctx) { + + ctx.lineWidth = 50; + ctx.strokeStyle = {r: 0, g: 1, b: 0, a: 0}; + ctx.strokeRect(25, 24, 50, 2); + _assertPixel(canvas, 50,25, 0,0,0,0); + ctx.strokeStyle = {r: 0, g: 1, b: 0, a: -1}; + ctx.strokeRect(25, 24, 50, 2); + _assertPixel(canvas, 50,25, 0,0,0,0); + ctx.clearRect(0, 0, 100, 50); + ctx.strokeStyle = {r: 0, g: 1, b: 0, a: 0.5}; + ctx.strokeRect(25, 24, 50, 2); + _assertPixel(canvas, 50,25, 0,255,0,128); + ctx.clearRect(0, 0, 100, 50); + ctx.strokeStyle = {r: 0, g: 1, b: 0, a: 1}; + ctx.strokeRect(25, 24, 50, 2); + _assertPixel(canvas, 50,25, 0,255,0,255); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.colormix.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.colormix.html new file mode 100644 index 0000000000..c1971666e8 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.colormix.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.strokeStyle.colormix</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.strokeStyle.colormix</h1> +<p class="desc">color-mix works as color input</p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test("color-mix works as color input"); +_addTest(function(canvas, ctx) { + + ctx.strokeStyle = "color-mix(in srgb, red, blue)"; + _assertSame(ctx.strokeStyle, 'color(srgb 0.5 0 0.5)', "ctx.strokeStyle", "'color(srgb 0.5 0 0.5)'"); + ctx.strokeStyle = "color-mix(in srgb, red, color(srgb 1 0 0))"; + _assertSame(ctx.strokeStyle, 'color(srgb 1 0 0)', "ctx.strokeStyle", "'color(srgb 1 0 0)'"); + +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.default.html b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.default.html new file mode 100644 index 0000000000..a432d74a42 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/fill-and-stroke-styles/2d.strokeStyle.default.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.strokeStyle.default</title> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/html/canvas/resources/canvas-tests.js"></script> +<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css"> +<body class="show_output"> + +<h1>2d.strokeStyle.default</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas> + +<ul id="d"></ul> +<script> +var t = async_test(""); +_addTest(function(canvas, ctx) { + + _assertSame(ctx.strokeStyle, '#000000', "ctx.strokeStyle", "'#000000'"); + +}); +</script> + |
