| <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> |
| <html> |
| <head> |
| <script src="../../resources/js-test-pre.js"></script> |
| </head> |
| <body> |
| <p id="description"></p> |
| <div id="console"></div> |
| <script> |
| description("This test checks SVGLength - converting from px to all other unit types"); |
| |
| function calculateDPI() |
| { |
| // Crude hack to determine the DPI, instead of hardcoding our 96 dpi here. |
| var divElement = document.createElement("div"); |
| divElement.setAttribute("style", "height: 1in"); |
| document.getElementById("description").appendChild(divElement); |
| var cssPixelsPerInch = divElement.offsetHeight; |
| document.getElementById("description").removeChild(divElement); |
| |
| // Crude hack to make this test pass with Opera/Mac |
| if (navigator.userAgent.indexOf("Opera") != -1) { |
| if (navigator.userAgent.indexOf("Macintosh") != -1) { |
| cssPixelsPerInch = 72; |
| } |
| } |
| |
| return cssPixelsPerInch; |
| } |
| |
| function calculateXHeight() |
| { |
| // Crude hack to calculate the x-height |
| var divElement = document.createElement("div"); |
| divElement.setAttribute("style", "height: 1ex; font-size: 12px; font-family: Ahem;"); |
| document.getElementById("description").appendChild(divElement); |
| var xHeight = divElement.offsetHeight; |
| document.getElementById("description").removeChild(divElement); |
| return xHeight; |
| } |
| |
| // Setup a real SVG document, so SVGLength can resolve relative units. |
| var svgElement = document.createElementNS("http://www.w3.org/2000/svg", "svg"); |
| svgElement.setAttribute("width", "150"); |
| svgElement.setAttribute("height", "50"); |
| |
| var rectElement = document.createElementNS("http://www.w3.org/2000/svg", "rect"); |
| rectElement.setAttribute("style", "visibility: hidden; font-size: 12px; font-family: Ahem;"); |
| svgElement.appendChild(rectElement); |
| document.getElementById("description").appendChild(svgElement); |
| |
| // Extract test information |
| var length = rectElement.x.baseVal; |
| var svgWidth = svgElement.width.baseVal.value; |
| var svgHeight = svgElement.height.baseVal.value; |
| var fontSize = parseInt(rectElement.style.fontSize); |
| var cssPixelsPerInch = calculateDPI(); |
| |
| debug(""); |
| debug("Set value to be 2px"); |
| length.valueAsString = "2px"; |
| shouldBe("length.unitType", "SVGLength.SVG_LENGTHTYPE_PX"); |
| shouldBe("length.value", "2"); |
| shouldBe("length.valueInSpecifiedUnits", "2"); |
| shouldBeEqualToString("length.valueAsString", "2px"); |
| |
| debug(""); |
| debug("Convert from px to unitless"); |
| shouldBeUndefined("length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_NUMBER)"); |
| shouldBeEqualToString("length.valueAsString", "2"); |
| shouldBe("length.value", "2"); |
| shouldBe("length.valueInSpecifiedUnits", "2"); |
| shouldBe("length.unitType", "SVGLength.SVG_LENGTHTYPE_NUMBER"); |
| |
| debug(""); |
| debug("Reset to 2px"); |
| length.valueAsString = "2px"; |
| |
| debug(""); |
| debug("Convert from px to percentage"); |
| shouldBeUndefined("length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_PERCENTAGE)"); |
| referenceValue = Number(2 / svgWidth * 100).toFixed(5); |
| // Exact result of valueAsString depends on precision, no trivial way to correctly test it, especially across engines. |
| shouldBeEqualToString("length.valueAsString.slice(-1)", "%"); |
| shouldBeEqualToString("length.valueInSpecifiedUnits.toFixed(5)", referenceValue); |
| shouldBeEqualToString("length.value.toFixed(1)", "2.0"); |
| shouldBe("length.unitType", "SVGLength.SVG_LENGTHTYPE_PERCENTAGE"); |
| |
| debug(""); |
| debug("Reset to 2px"); |
| length.valueAsString = "2px"; |
| |
| debug(""); |
| debug("Convert from px to ems"); |
| shouldBeUndefined("length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_EMS)"); |
| referenceValue = Number(2 / fontSize).toFixed(6); |
| // Exact result of valueAsString depends on precision, no trivial way to correctly test it, especially across engines. |
| shouldBeEqualToString("length.valueAsString.slice(-2)", "em"); |
| shouldBeEqualToString("length.valueInSpecifiedUnits.toFixed(6)", referenceValue); |
| shouldBeEqualToString("length.value.toFixed(1)", "2.0"); |
| shouldBe("length.unitType", "SVGLength.SVG_LENGTHTYPE_EMS"); |
| |
| debug(""); |
| debug("Reset to 2px"); |
| length.valueAsString = "2px"; |
| |
| debug(""); |
| debug("Convert from px to exs"); |
| shouldBeUndefined("length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_EXS)"); |
| referenceValue = Number(2 / calculateXHeight()).toFixed(1); |
| // Exact result of valueAsString depends on precision, no trivial way to correctly test it, especially across engines. |
| shouldBeEqualToString("length.valueAsString.slice(-2)", "ex"); |
| shouldBeEqualToString("length.valueInSpecifiedUnits.toFixed(1)", referenceValue); |
| shouldBeEqualToString("length.value.toFixed(1)", "2.0"); |
| shouldBe("length.unitType", "SVGLength.SVG_LENGTHTYPE_EXS"); |
| |
| debug(""); |
| debug("Reset to 2px"); |
| length.valueAsString = "2px"; |
| |
| debug(""); |
| debug("Convert from px to cm"); |
| shouldBeUndefined("length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_CM)"); |
| referenceValue = Number(2 * 2.54 / cssPixelsPerInch).toFixed(7); |
| // Exact result of valueAsString depends on precision, no trivial way to correctly test it, especially across engines. |
| shouldBeEqualToString("length.valueAsString.slice(-2)", "cm"); |
| shouldBeEqualToString("length.valueInSpecifiedUnits.toFixed(7)", referenceValue); |
| shouldBeEqualToString("length.value.toFixed(1)", "2.0"); |
| shouldBe("length.unitType", "SVGLength.SVG_LENGTHTYPE_CM"); |
| |
| debug(""); |
| debug("Reset to 2px"); |
| length.valueAsString = "2px"; |
| |
| debug(""); |
| debug("Convert from px to mm"); |
| shouldBeUndefined("length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_MM)"); |
| referenceValue = Number(2 * 25.4 / cssPixelsPerInch).toFixed(6); |
| // Exact result of valueAsString depends on precision, no trivial way to correctly test it, especially across engines. |
| shouldBeEqualToString("length.valueAsString.slice(-2)", "mm"); |
| shouldBeEqualToString("length.valueInSpecifiedUnits.toFixed(6)", referenceValue); |
| shouldBeEqualToString("length.value.toFixed(1)", "2.0"); |
| shouldBe("length.unitType", "SVGLength.SVG_LENGTHTYPE_MM"); |
| |
| debug(""); |
| debug("Reset to 2px"); |
| length.valueAsString = "2px"; |
| |
| debug(""); |
| debug("Convert from px to in"); |
| shouldBeUndefined("length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_IN)"); |
| referenceValue = Number(2 / cssPixelsPerInch).toFixed(7); |
| // Exact result of valueAsString depends on precision, no trivial way to correctly test it, especially across engines. |
| shouldBeEqualToString("length.valueAsString.slice(-2)", "in"); |
| shouldBeEqualToString("length.valueInSpecifiedUnits.toFixed(7)", referenceValue); |
| shouldBeEqualToString("length.value.toFixed(1)", "2.0"); |
| shouldBe("length.unitType", "SVGLength.SVG_LENGTHTYPE_IN"); |
| |
| debug(""); |
| debug("Reset to 2px"); |
| length.valueAsString = "2px"; |
| |
| debug(""); |
| debug("Convert from px to pt"); |
| shouldBeUndefined("length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_PT)"); |
| referenceValue = Number(2 / cssPixelsPerInch * 72); |
| shouldBeEqualToString("length.valueAsString", referenceValue + "pt"); |
| shouldBe("length.valueInSpecifiedUnits", referenceValue.toString()); |
| shouldBeEqualToString("length.value.toFixed(1)", "2.0"); |
| shouldBe("length.unitType", "SVGLength.SVG_LENGTHTYPE_PT"); |
| |
| debug(""); |
| debug("Reset to 2px"); |
| length.valueAsString = "2px"; |
| |
| debug(""); |
| debug("Convert from px to pc"); |
| shouldBeUndefined("length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_PC)"); |
| referenceValue = Number(2 / cssPixelsPerInch * 6).toFixed(3); |
| // Exact result of valueAsString depends on precision, no trivial way to correctly test it, especially across engines. |
| shouldBeEqualToString("length.valueAsString.slice(-2)", "pc"); |
| shouldBeEqualToString("length.valueInSpecifiedUnits.toFixed(3)", referenceValue); |
| shouldBeEqualToString("length.value.toFixed(1)", "2.0"); |
| shouldBe("length.unitType", "SVGLength.SVG_LENGTHTYPE_PC"); |
| |
| successfullyParsed = true; |
| </script> |
| <script src="../../resources/js-test-post.js"></script> |
| </body> |
| </html> |
