diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
commit | 26a029d407be480d791972afb5975cf62c9360a6 (patch) | |
tree | f435a8308119effd964b339f76abb83a57c29483 /testing/web-platform/tests/html/canvas/element/manual/text | |
parent | Initial commit. (diff) | |
download | firefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz firefox-26a029d407be480d791972afb5975cf62c9360a6.zip |
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/html/canvas/element/manual/text')
14 files changed, 360 insertions, 0 deletions
diff --git a/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.disconnected-ref.html b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.disconnected-ref.html new file mode 100644 index 0000000000..b36d29b97f --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.disconnected-ref.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<meta charset=utf-8> +<title>HTML Canvas reference</title> +<body> +<canvas id=c> +</body> +<script> +var c = document.getElementById("c"); +var ctx = c.getContext("2d"); +ctx.font = "50px monospace"; +ctx.fillText("Hello", 50, 75); +ctx.font = "25px serif"; +ctx.fillText("World", 100, 100); +c.style.border = "3px solid cyan"; +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.disconnected.html b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.disconnected.html new file mode 100644 index 0000000000..a1715f6663 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.disconnected.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<meta charset=utf-8> +<title>HTML Canvas testcase: canvas element not in document</title> +<link rel=match href="canvas.2d.disconnected-ref.html"> +<meta name=fuzzy content="maxDifference=0-23;totalPixels=0-829"> +<body> +</body> +<script> +var d = new Document(); +var c = d.createElementNS("http://www.w3.org/1999/xhtml", "canvas"); +var ctx = c.getContext("2d"); +ctx.font = "50px monospace"; +ctx.fillText("Hello", 50, 75); +ctx.font = "25px serif"; +ctx.fillText("World", 100, 100); +c.toBlob((blob) => { + var img = document.createElement("img"); + const url = URL.createObjectURL(blob); + img.src = url; + img.style.border = "3px solid cyan"; + document.body.appendChild(img); +}); +</script> + diff --git a/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch-ref.html b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch-ref.html new file mode 100644 index 0000000000..00ecdccad3 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<title>Canvas test: 2d.text.fontStretch</title> +<canvas id="c" class="output"><p class="fallback">FAIL (fallback content)</p></canvas> +<script> + +var canvas = document.getElementById("c"); +var ctx = canvas.getContext('2d'); + +function draw() { + ctx.font = '25px test'; + ctx.fillText("P", 10, 40); +} + +var f = new FontFace('test', 'url(/fonts/pass.woff)'); +document.fonts.add(f); + +f.load().then(draw); + +</script>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.condensed.html b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.condensed.html new file mode 100644 index 0000000000..72db41f007 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.condensed.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<title>Canvas test: 2d.text.fontStretch</title> +<link rel="match" href="canvas.2d.fontStretch-ref.html"> +<canvas id="c" class="output"><p class="fallback">FAIL (fallback content)</p></canvas> +<script> + +var canvas = document.getElementById("c"); +var ctx = canvas.getContext('2d'); + +// P shows as Pass for fontStretch = condensed and shows as fail for +// fontStretch = fail. +function draw() { + ctx.font = '25px test'; + ctx.fontStretch = "condensed"; + ctx.fillText("P", 10, 40); +} + +var f = new FontFace('test', 'url(/fonts/pass.woff)'); +f.stretch = "condensed"; +document.fonts.add(f); + +var f2 = new FontFace('test', 'url(/fonts/fail.woff)'); +document.fonts.add(f2); + +Promise.all([f.load(), f2.load()]).then(draw); + +</script>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.expanded.html b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.expanded.html new file mode 100644 index 0000000000..8a13ba13fc --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.expanded.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<title>Canvas test: 2d.text.fontStretch</title> +<link rel="match" href="canvas.2d.fontStretch-ref.html"> +<canvas id="c" class="output"><p class="fallback">FAIL (fallback content)</p></canvas> +<script> + +var canvas = document.getElementById("c"); +var ctx = canvas.getContext('2d'); + +// P shows as Pass for fontStretch = expanded and shows as fail for +// fontStretch = fail. +function draw() { + ctx.font = '25px test'; + ctx.fontStretch = "expanded"; + ctx.fillText("P", 10, 40); +} + +var f = new FontFace('test', 'url(/fonts/pass.woff)'); +f.stretch = "expanded"; +document.fonts.add(f); + +var f2 = new FontFace('test', 'url(/fonts/fail.woff)'); +document.fonts.add(f2); + +Promise.all([f.load(), f2.load()]).then(draw); + +</script>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.extra-condensed.html b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.extra-condensed.html new file mode 100644 index 0000000000..afa910f62c --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.extra-condensed.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<title>Canvas test: 2d.text.fontStretch</title> +<link rel="match" href="canvas.2d.fontStretch-ref.html"> +<canvas id="c" class="output"><p class="fallback">FAIL (fallback content)</p></canvas> +<script> + +var canvas = document.getElementById("c"); +var ctx = canvas.getContext('2d'); + +// P shows as Pass for fontStretch = extra-condensed and shows as fail for +// fontStretch = fail. +function draw() { + ctx.font = '25px test'; + ctx.fontStretch = "extra-condensed"; + ctx.fillText("P", 10, 40); +} + +var f = new FontFace('test', 'url(/fonts/pass.woff)'); +f.stretch = "extra-condensed"; +document.fonts.add(f); + +var f2 = new FontFace('test', 'url(/fonts/fail.woff)'); +document.fonts.add(f2); + +Promise.all([f.load(), f2.load()]).then(draw); + +</script>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.extra-expanded.html b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.extra-expanded.html new file mode 100644 index 0000000000..d10d4d9312 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.extra-expanded.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<title>Canvas test: 2d.text.fontStretch</title> +<link rel="match" href="canvas.2d.fontStretch-ref.html"> +<canvas id="c" class="output"><p class="fallback">FAIL (fallback content)</p></canvas> +<script> + +var canvas = document.getElementById("c"); +var ctx = canvas.getContext('2d'); + +// P shows as Pass for fontStretch = extra-expanded and shows as fail for +// fontStretch = fail. +function draw() { + ctx.font = '25px test'; + ctx.fontStretch = "extra-expanded"; + ctx.fillText("P", 10, 40); +} + +var f = new FontFace('test', 'url(/fonts/pass.woff)'); +f.stretch = "extra-expanded"; +document.fonts.add(f); + +var f2 = new FontFace('test', 'url(/fonts/fail.woff)'); +document.fonts.add(f2); + +Promise.all([f.load(), f2.load()]).then(draw); + +</script>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.normal.html b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.normal.html new file mode 100644 index 0000000000..e8fd66acad --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.normal.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<title>Canvas test: 2d.text.fontStretch</title> +<link rel="match" href="canvas.2d.fontStretch-ref.html"> +<canvas id="c" class="output"><p class="fallback">FAIL (fallback content)</p></canvas> +<script> + +var canvas = document.getElementById("c"); +var ctx = canvas.getContext('2d'); + +// P shows as Pass for fontStretch = normal and shows as fail for +// fontStretch = expanded or condensed. +function draw() { + ctx.font = '25px test'; + ctx.fillText("P", 10, 40); +} + +var f = new FontFace('test', 'url(/fonts/fail.woff)'); +f.stretch = "expanded"; +document.fonts.add(f); + +var f1 = new FontFace('test', 'url(/fonts/pass.woff)'); +document.fonts.add(f1); + +var f2 = new FontFace('test', 'url(/fonts/fail.woff)'); +f2.stretch = "condensed"; +document.fonts.add(f2); + +Promise.all([f.load(), f1.load(), f2.load()]).then(draw); + +</script>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.semi-condensed.html b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.semi-condensed.html new file mode 100644 index 0000000000..2ac9719595 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.semi-condensed.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<title>Canvas test: 2d.text.fontStretch</title> +<link rel="match" href="canvas.2d.fontStretch-ref.html"> +<canvas id="c" class="output"><p class="fallback">FAIL (fallback content)</p></canvas> +<script> + +var canvas = document.getElementById("c"); +var ctx = canvas.getContext('2d'); + +// P shows as Pass for fontStretch = semi-condensed and shows as fail for +// fontStretch = fail. +function draw() { + ctx.font = '25px test'; + ctx.fontStretch = "semi-condensed"; + ctx.fillText("P", 10, 40); +} + +var f = new FontFace('test', 'url(/fonts/pass.woff)'); +f.stretch = "semi-condensed"; +document.fonts.add(f); + +var f2 = new FontFace('test', 'url(/fonts/fail.woff)'); +document.fonts.add(f2); + +Promise.all([f.load(), f2.load()]).then(draw); + +</script>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.semi-expanded.html b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.semi-expanded.html new file mode 100644 index 0000000000..3c9fa27894 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.semi-expanded.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<title>Canvas test: 2d.text.fontStretch</title> +<link rel="match" href="canvas.2d.fontStretch-ref.html"> +<canvas id="c" class="output"><p class="fallback">FAIL (fallback content)</p></canvas> +<script> + +var canvas = document.getElementById("c"); +var ctx = canvas.getContext('2d'); + +// P shows as Pass for fontStretch = semi-expanded and shows as fail for +// fontStretch = fail. +function draw() { + ctx.font = '25px test'; + ctx.fontStretch = "semi-expanded"; + ctx.fillText("P", 10, 40); +} + +var f = new FontFace('test', 'url(/fonts/pass.woff)'); +f.stretch = "semi-expanded"; +document.fonts.add(f); + +var f2 = new FontFace('test', 'url(/fonts/fail.woff)'); +document.fonts.add(f2); + +Promise.all([f.load(), f2.load()]).then(draw); + +</script>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.ultra-condensed.html b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.ultra-condensed.html new file mode 100644 index 0000000000..2b0426e976 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.ultra-condensed.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<title>Canvas test: 2d.text.fontStretch</title> +<link rel="match" href="canvas.2d.fontStretch-ref.html"> +<canvas id="c" class="output"><p class="fallback">FAIL (fallback content)</p></canvas> +<script> + +var canvas = document.getElementById("c"); +var ctx = canvas.getContext('2d'); + +// P shows as Pass for fontStretch = ultra-condensed and shows as fail for +// fontStretch = fail. +function draw() { + ctx.font = '25px test'; + ctx.fontStretch = "ultra-condensed"; + ctx.fillText("P", 10, 40); +} + +var f = new FontFace('test', 'url(/fonts/pass.woff)'); +f.stretch = "ultra-condensed"; +document.fonts.add(f); + +var f2 = new FontFace('test', 'url(/fonts/fail.woff)'); +document.fonts.add(f2); + +Promise.all([f.load(), f2.load()]).then(draw); + +</script>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.ultra-expanded.html b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.ultra-expanded.html new file mode 100644 index 0000000000..5b4979de86 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/manual/text/canvas.2d.fontStretch.ultra-expanded.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<title>Canvas test: 2d.text.fontStretch</title> +<link rel="match" href="canvas.2d.fontStretch-ref.html"> +<canvas id="c" class="output"><p class="fallback">FAIL (fallback content)</p></canvas> +<script> + +var canvas = document.getElementById("c"); +var ctx = canvas.getContext('2d'); + +// P shows as Pass for fontStretch = ultra-expanded and shows as fail for +// fontStretch = fail. +function draw() { + ctx.font = '25px test'; + ctx.fontStretch = "ultra-expanded"; + ctx.fillText("P", 10, 40); +} + +var f = new FontFace('test', 'url(/fonts/pass.woff)'); +f.stretch = "ultra-expanded"; +document.fonts.add(f); + +var f2 = new FontFace('test', 'url(/fonts/fail.woff)'); +document.fonts.add(f2); + +Promise.all([f.load(), f2.load()]).then(draw); + +</script>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/canvas/element/manual/text/canvas_text_font_001-ref.htm b/testing/web-platform/tests/html/canvas/element/manual/text/canvas_text_font_001-ref.htm new file mode 100644 index 0000000000..1a19757e00 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/manual/text/canvas_text_font_001-ref.htm @@ -0,0 +1,22 @@ +<!doctype HTML> +<html> + <head> + <title>HTML5 Canvas Test: Ignore property-independent style sheet syntax "inherit" in Text (reference)</title> + <script type="text/javascript"> + function runTest() + { + var canvas = document.getElementById("canvas1"); + var ctx = canvas.getContext("2d"); + + ctx.font = "40px Ahem"; + ctx.fillText("Filler", 5, 50); + ctx.fillText("Filler", 5, 100); + } + </script> + </head> + <body onload="runTest()"> + <p>Description: Ignore "inherit" property-independent style sheet syntax without assigning a new font value.</p> + <p>Test passes if there are two identical black boxes below.</p> + <canvas id="canvas1" width="300" height="150">Browser does not support HTML5 Canvas.</canvas> + </body> +</html> diff --git a/testing/web-platform/tests/html/canvas/element/manual/text/canvas_text_font_001.htm b/testing/web-platform/tests/html/canvas/element/manual/text/canvas_text_font_001.htm new file mode 100644 index 0000000000..923ce71c07 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/element/manual/text/canvas_text_font_001.htm @@ -0,0 +1,33 @@ +<!doctype HTML> +<html> + <head> + <title>HTML5 Canvas Test: Ignore property-independent style sheet syntax "inherit" in Text</title> + <link rel="match" href="canvas_text_font_001-ref.htm" /> + <link rel="author" title="Microsoft" href="http://www.microsoft.com" /> + <link rel="help" href="http://www.w3.org/TR/2dcontext/#dom-context-2d-font" /> + <meta name="assert" content=": Ignore 'inherit' property-independent style sheet syntax without assigning a new font value." /> + <script type="text/javascript"> + function runTest() + { + var canvas = document.getElementById("canvas1"); + var ctx = canvas.getContext("2d"); + + // Assign a valid font. + ctx.font = "40px Ahem"; + + // Assign property-independent style sheet syntax 'inherit' as font (this must be ignored). + ctx.font = "20px inherit"; + ctx.fillText("Filler", 5, 50); + + // Assign a valid font which was used earlier. + ctx.font = "40px Ahem"; + ctx.fillText("Filler", 5, 100); + } + </script> + </head> + <body onload="runTest()"> + <p>Description: Ignore "inherit" property-independent style sheet syntax without assigning a new font value.</p> + <p>Test passes if there are two identical black boxes below.</p> + <canvas id="canvas1" width="300" height="150">Browser does not support HTML5 Canvas.</canvas> + </body> +</html> |