wuggy/Dactyloidae
wuggy/Dactyloidae
1
0
Fork 0
mirror of https://repo.dactyloidae.xyz/Dactyloidae/UXP.git synced 2026-09-08 08:48:39 +09:00
Code Issues Projects Releases Packages Wiki Activity

Issue #2316 - Part 2: Add reftests

Browse source
This commit is contained in:
Moonchild 2023-09-26 15:15:45 +02:00 • committed by roytam1
commit 30f7b3284c
8 changed files with 209 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

22
layout/reftests/svg/sizing/canvas-drawImage-height-with-no-width-ref.html Normal file
View file

@ -0,0 +1,22 @@
<!DOCTYPE HTML>
<html class="reftest-wait">
<script src="svg-image-util.js"></script>
<style>
canvas {
background: blue;
}
</style>
<body>
<script>
let viewBoxes = [null, "0 0 50 50", "0 0 50 20"];
let promises = [];
for (viewBox of viewBoxes) {
// Without a given width or height the svg should be sized as if a width
// of 300px and height of 150px were given.
promises.push(generateCanvasDrawImageSVG("350", "200", "300px", "200px", viewBox));
}
Promise.all(promises).then(() => { document.documentElement.className = "" });
</script>
<!-- Body gets populated by script -->
</body>
</html>

22
layout/reftests/svg/sizing/canvas-drawImage-height-with-no-width.html Normal file
View file

@ -0,0 +1,22 @@
<!DOCTYPE HTML>
<html class="reftest-wait">
<script src="svg-image-util.js"></script>
<style>
canvas {
background: blue;
}
</style>
<body>
<script>
let viewBoxes = [null, "0 0 50 50", "0 0 50 20"];
let promises = [];
for (viewBox of viewBoxes) {
// Without a given width or height the svg should be sized as if a width
// of 300px and height of 150px were given.
promises.push(generateCanvasDrawImageSVG("350", "200", null, "200px", viewBox));
}
Promise.all(promises).then(() => { document.documentElement.className = "" });
</script>
<!-- Body gets populated by script -->
</body>
</html>

20
layout/reftests/svg/sizing/canvas-drawImage-no-width-or-height-ref.html Normal file
View file

@ -0,0 +1,20 @@
<!DOCTYPE HTML>
<html class="reftest-wait">
<script src="svg-image-util.js"></script>
<style>
canvas {
background: blue;
}
</style>
<body>
<script>
let viewBoxes = [null, "0 0 50 50", "0 0 50 20"];
let promises = [];
for (viewBox of viewBoxes) {
promises.push(generateCanvasDrawImageSVG("350", "200", "300px", "150px", viewBox));
}
Promise.all(promises).then(() => { document.documentElement.className = "" });
</script>
<!-- Body gets populated by script -->
</body>
</html>

22
layout/reftests/svg/sizing/canvas-drawImage-no-width-or-height.html Normal file
View file

@ -0,0 +1,22 @@
<!DOCTYPE HTML>
<html class="reftest-wait">
<script src="svg-image-util.js"></script>
<style>
canvas {
background: blue;
}
</style>
<body>
<script>
let viewBoxes = [null, "0 0 50 50", "0 0 50 20"];
let promises = [];
for (viewBox of viewBoxes) {
// Without a given width or height the svg should be sized as if a width
// of 300px and height of 150px were given.
promises.push(generateCanvasDrawImageSVG("350", "200", null, null, viewBox));
}
Promise.all(promises).then(() => { document.documentElement.className = "" });
</script>
<!-- Body gets populated by script -->
</body>
</html>

22
layout/reftests/svg/sizing/canvas-drawImage-width-with-no-height-ref.html Normal file
View file

@ -0,0 +1,22 @@
<!DOCTYPE HTML>
<html class="reftest-wait">
<script src="svg-image-util.js"></script>
<style>
canvas {
background: blue;
}
</style>
<body>
<script>
let viewBoxes = [null, "0 0 50 50", "0 0 50 20"];
let promises = [];
for (viewBox of viewBoxes) {
// Without a given width or height the svg should be sized as if a width
// of 300px and height of 150px were given.
promises.push(generateCanvasDrawImageSVG("350", "200", "200px", "150px", viewBox));
}
Promise.all(promises).then(() => { document.documentElement.className = "" });
</script>
<!-- Body gets populated by script -->
</body>
</html>

22
layout/reftests/svg/sizing/canvas-drawImage-width-with-no-height.html Normal file
View file

@ -0,0 +1,22 @@
<!DOCTYPE HTML>
<html class="reftest-wait">
<script src="svg-image-util.js"></script>
<style>
canvas {
background: blue;
}
</style>
<body>
<script>
let viewBoxes = [null, "0 0 50 50", "0 0 50 20"];
let promises = [];
for (viewBox of viewBoxes) {
// Without a given width or height the svg should be sized as if a width
// of 300px and height of 150px were given.
promises.push(generateCanvasDrawImageSVG("350", "200", "200px", null, viewBox));
}
Promise.all(promises).then(() => { document.documentElement.className = "" });
</script>
<!-- Body gets populated by script -->
</body>
</html>

5
layout/reftests/svg/sizing/reftest.list
View file

@ -310,3 +310,8 @@ skip == dynamic--inline-resize-window-width.xhtml pass.svg # Fails way too mu
fails random-if(Android) == dynamic--object-svg-unloaded.xhtml pass.svg
# == dynamic--object--auto-auto--pct-px.html
# Note: Other web rendering engines do no not pass the following tests due
# due to differences in surface calculations.
== canvas-drawImage-no-width-or-height.html canvas-drawImage-no-width-or-height-ref.html
== canvas-drawImage-width-with-no-height.html canvas-drawImage-width-with-no-height-ref.html
== canvas-drawImage-height-with-no-width.html canvas-drawImage-height-with-no-width-ref.html

74
layout/reftests/svg/sizing/svg-image-util.js Normal file
View file

@ -0,0 +1,74 @@
/**
* Reusable SVG data uri prefix for generated SVGs.
*/
const SVG_DATA_URI_PREFIX = 'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg"';
/**
* Reusable SVG data uri suffix for generated SVGs.
*/
const SVG_DATA_URI_SUFFIX = '><rect fill="brown" x="-2000" y="-2000" width="4000" height="4000"></rect><rect fill="green" height="50" width="50"></rect><rect fill="yellow" x="10" y="10" height="30" width="30"></rect></svg>';
/**
* Generates full data URI for an SVG document, with the given parameters
* on the SVG element.
*
* @param aWidth The width attribute, or null for no width.
* @param aHeight The height attribute, or null for no height.
* @param aViewbox The viewBox attribute, or null for no viewBox.
*/
function generateSVGDataURI(aWidth, aHeight, aViewBox) {
let datauri = SVG_DATA_URI_PREFIX;
if (aWidth) {
datauri += " width=\"" + aWidth + "\""
}
if (aHeight) {
datauri += " height=\"" + aHeight + "\"";
}
if (aViewBox) {
datauri += " viewBox=\"" + aViewBox + "\"";
}
datauri += SVG_DATA_URI_SUFFIX;
return datauri;
}
/**
* Generates a canvas, with the given width and height parameters, and uses
* CanvasRenderingContext2D.drawImage() to draw a SVG image with the given
* width and height attributes.
*
* @param aCanvasWidth The width attribute of the canvas.
* @param aCanvasHeight The height attribute of the canvas.
* @param aSVGWidth The width attribute of the svg, or null for no width.
* @param aSVGHeight The height attribute of the svg, or null for no height.
* @param aSVGViewBox The viewBox attribute sf the svg, or null for no viewBox.
*
* @returns A promise that resolves when the SVG image has been drawn to the
* created canvas
*/
async function generateCanvasDrawImageSVG(aCanvasWidth, aCanvasHeight, aSVGWidth,
aSVGHeight, aSVGViewBox) {
let canvas = document.createElement("canvas");
let ctx = canvas.getContext("2d");
document.body.appendChild(canvas);
canvas.setAttribute("width", aCanvasWidth);
canvas.setAttribute("height", aCanvasHeight);
let img = document.createElement("img");
let promise = new Promise(resolve => {
img.onload = () => {
ctx.drawImage(img, 0, 0);
resolve();
};
});
let uri = generateSVGDataURI(aSVGWidth, aSVGHeight, aSVGViewBox);
img.src = uri;
return promise;
}