86 lines
2.5 KiB
HTML
86 lines
2.5 KiB
HTML
<!DOCTYPE html>
|
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
<!--
|
|
https://bugzilla.mozilla.org/show_bug.cgi?id=1396642
|
|
-->
|
|
<head>
|
|
<title>Test for Bug 1396642</title>
|
|
<script src="/tests/SimpleTest/SimpleTest.js"></script>
|
|
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
|
|
</head>
|
|
<body>
|
|
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1396642">Mozilla Bug 1396642</a>
|
|
<p id="display"></p>
|
|
<div id="content" style="display: none"></div>
|
|
|
|
<div id="svg"></div>
|
|
|
|
<pre id="test">
|
|
<script class="testbody" type="application/javascript">
|
|
SimpleTest.waitForExplicitFinish();
|
|
|
|
function runTest() {
|
|
var testsElement = $("svg");
|
|
|
|
// Turn for instance `2.3` into `230` (px). Round to avoid floating point
|
|
// issues.
|
|
const scale = (number) => Math.round(100 * number);
|
|
|
|
const widths = [2, 2.3, 2.5, 2.8];
|
|
const heights = [3, 3.3, 3.5, 3.8];
|
|
|
|
for (const width of widths) {
|
|
for (const height of heights) {
|
|
const variations = [
|
|
{width, height},
|
|
{width: "auto", height},
|
|
{width, height: "auto"},
|
|
{width: "auto", height: "auto"},
|
|
];
|
|
|
|
for (const variation of variations) {
|
|
const svgWrapperElement = document.createElement("div");
|
|
svgWrapperElement.style.width =
|
|
variation.width === "auto" && variation.height === "auto"
|
|
? `${scale(width)}px`
|
|
: "auto";
|
|
|
|
const svgElement = document.createElementNS("http://www.w3.org/2000/svg", "svg");
|
|
svgElement.setAttribute("viewBox", `0 0 ${width} ${height}`);
|
|
svgElement.style.width =
|
|
typeof variation.width === "number"
|
|
? `${scale(variation.width)}px`
|
|
: variation.width;
|
|
svgElement.style.height =
|
|
typeof variation.height === "number"
|
|
? `${scale(variation.height)}px`
|
|
: variation.height;
|
|
|
|
svgWrapperElement.appendChild(svgElement);
|
|
|
|
testsElement.appendChild(svgWrapperElement);
|
|
|
|
const rect = svgElement.getBoundingClientRect();
|
|
const actual = {
|
|
width: Math.round(rect.width),
|
|
height: Math.round(rect.height),
|
|
};
|
|
const expected = {
|
|
width: scale(width),
|
|
height: scale(height),
|
|
};
|
|
|
|
isfuzzy(expected.width, actual.width, 0.001, "checking width");
|
|
isfuzzy(expected.height, actual.height, 0.001, "checking height");
|
|
}
|
|
}
|
|
}
|
|
|
|
SimpleTest.finish();
|
|
}
|
|
|
|
window.addEventListener("load", runTest);
|
|
</script>
|
|
</pre>
|
|
</body>
|
|
</html>
|