1 <html xmlns=
"http://www.w3.org/1999/xhtml">
3 https://bugzilla.mozilla.org/show_bug.cgi?id=342513
6 <title>Test SVG Length conversions
</title>
7 <script src=
"/tests/SimpleTest/SimpleTest.js"></script>
8 <link rel=
"stylesheet" type=
"text/css" href=
"/tests/SimpleTest/test.css" />
11 <a target=
"_blank" href=
"https://bugzilla.mozilla.org/show_bug.cgi?id=342513">Mozilla Bug
342513</a>
15 <div width=
"100%" height=
"1" id=
"div">
17 <svg xmlns=
"http://www.w3.org/2000/svg" width=
"100%" height=
"1" id=
"svg">
19 <svg xmlns=
"http://www.w3.org/2000/svg" width=
"600" height=
"400" font-size=
"5">
20 <svg font-size=
"10" width=
"20em" height=
"20em">
21 <rect id=
"r1" x=
"5em" y=
"6em" width=
"20%" height=
"30%" />
27 <script class=
"testbody" type=
"text/javascript">
30 SimpleTest.waitForExplicitFinish();
33 var svgDoc = document.getElementById(
"svg");
34 var divElem = document.getElementById(
"div");
35 var expectedWidth = divElem.clientWidth;
36 // test for the pixel width of the svg
37 is(svgDoc.width.baseVal.value, expectedWidth,
"svgDoc.width.baseVal.value");
39 // set the SVG width to ~
50% in pixels
40 svgDoc.width.baseVal.newValueSpecifiedUnits(svgDoc.width.baseVal.SVG_LENGTHTYPE_PX, Math.floor(expectedWidth /
2));
41 svgDoc.width.baseVal.convertToSpecifiedUnits(svgDoc.width.baseVal.SVG_LENGTHTYPE_PERCENTAGE);
42 // the valueInSpecifiedUnits should now be
50%
43 is(Math.round(svgDoc.width.baseVal.valueInSpecifiedUnits),
50,
"valueInSpecifiedUnits after convertToSpecifiedUnits");
45 let r1 = document.getElementById(
"r1");
46 is(r1.width.baseVal.value,
40,
"width in em for elements inside inner <svg> should be resolved against the inner <svg>");
47 is(r1.height.baseVal.value,
60,
"height in em for elements inside inner <svg> should be resolved against the inner <svg>");
52 window.addEventListener(
"load", run);