Chromium Code Reviews| Index: third_party/WebKit/LayoutTests/svg/dom/SVGLength-px-with-context.html |
| diff --git a/third_party/WebKit/LayoutTests/svg/dom/SVGLength-px-with-context.html b/third_party/WebKit/LayoutTests/svg/dom/SVGLength-px-with-context.html |
| index aacdecdaea8e63306c9502e60e19856d610892dd..f15bcd36b7f2bbd9b8fe8a36f4fc2f02b3f23074 100644 |
| --- a/third_party/WebKit/LayoutTests/svg/dom/SVGLength-px-with-context.html |
| +++ b/third_party/WebKit/LayoutTests/svg/dom/SVGLength-px-with-context.html |
| @@ -1,11 +1,157 @@ |
| -<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> |
| -<html> |
| -<head> |
| -<script src="../../resources/js-test.js"></script> |
| -</head> |
| -<body> |
| -<p id="description"></p> |
| -<div id="console"></div> |
| -<script src="script-tests/SVGLength-px-with-context.js"></script> |
| -</body> |
| -</html> |
| +<!DOCTYPE HTML> |
| +<title>Checks SVGLength - converting from px to all other unit types</title> |
|
fs
2016/08/25 10:16:51
Like for the other -px test, but change 'detached'
|
| +<script src="../../resources/testharness.js"></script> |
| +<script src="../../resources/testharnessreport.js"></script> |
| +<p></p> |
| +<script> |
| +function calculateDPI() { |
|
fs
2016/08/25 10:16:51
Shouldn't need this.
Shanmuga Pandi
2016/08/25 14:02:54
Observed strange issue if we remove calculateDPI()
fs
2016/08/25 14:12:27
Yes, that may very well be the case. SVGLengthTear
Shanmuga Pandi
2016/08/26 07:35:18
Right. I added TODO.
I will try to make a separat
|
| + // Crude hack to determine the DPI, instead of hardcoding our 96 dpi here. |
| + var divElement = document.createElement("div"); |
| + divElement.setAttribute("style", "height: 1in"); |
| + var pElement = document.querySelector("p"); |
| + pElement.appendChild(divElement); |
| + var cssPixelsPerInch = divElement.offsetHeight; |
| + pElement.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;"); |
| + var pElement = document.querySelector("p"); |
| + pElement.appendChild(divElement); |
| + var xHeight = divElement.offsetHeight; |
| + pElement.removeChild(divElement); |
| + return xHeight; |
| +} |
| + |
| +test(function() { |
|
fs
2016/08/25 10:16:51
Should be possible to split this into several (sub
Shanmuga Pandi
2016/08/26 07:35:18
Done.
|
| + // 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.querySelector("p").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(); |
| + |
| + // Set value to be 2px |
| + length.valueAsString = "2px"; |
| + assert_equals(length.unitType, SVGLength.SVG_LENGTHTYPE_PX); |
| + assert_equals(length.value, 2); |
| + assert_equals(length.valueInSpecifiedUnits, 2); |
| + assert_equals(length.valueAsString, "2px"); |
| + |
| + // Convert from px to unitless |
| + length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_NUMBER); |
| + assert_equals(length.valueAsString, "2"); |
| + assert_equals(length.value, 2); |
| + assert_equals(length.valueInSpecifiedUnits, 2); |
| + assert_equals(length.unitType, SVGLength.SVG_LENGTHTYPE_NUMBER); |
| + |
| + // Reset to 2px |
| + length.valueAsString = "2px"; |
| + |
| + // Convert from px to percentage |
| + length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_PERCENTAGE); |
| + referenceValue = Number(2 / svgWidth * 100).toFixed(5); |
| + assert_equals(length.valueAsString, referenceValue + "%"); |
| + assert_equals(length.valueInSpecifiedUnits.toFixed(5), referenceValue); |
| + assert_equals(length.value.toFixed(1), "2.0"); |
| + assert_equals(length.unitType, SVGLength.SVG_LENGTHTYPE_PERCENTAGE); |
| + |
| + // Reset to 2px |
| + length.valueAsString = "2px"; |
| + |
| + // Convert from px to ems |
| + length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_EMS); |
| + referenceValue = Number(2 / fontSize).toFixed(6); |
| + assert_equals(length.valueAsString, referenceValue + "em"); |
| + assert_equals(length.valueInSpecifiedUnits.toFixed(6), referenceValue); |
| + assert_equals(length.value.toFixed(1), "2.0"); |
| + assert_equals(length.unitType, SVGLength.SVG_LENGTHTYPE_EMS); |
| + |
| + // Reset to 2px |
| + length.valueAsString = "2px"; |
| + |
| + // Convert from px to exs |
| + length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_EXS); |
| + referenceValue = Number(2 / calculateXHeight()).toFixed(1); |
| + // Don't check valueAsString here, it's unreliable across browsers. |
| + assert_equals(length.valueInSpecifiedUnits.toFixed(1), referenceValue); |
| + assert_equals(length.value.toFixed(1), "2.0"); |
| + assert_equals(length.unitType, SVGLength.SVG_LENGTHTYPE_EXS); |
| + |
| + // Reset to 2px"); |
| + length.valueAsString = "2px"; |
| + |
| + // Convert from px to cm |
| + length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_CM); |
| + referenceValue = Number(2 * 2.54 / cssPixelsPerInch).toFixed(7); |
| + assert_equals(length.valueAsString, referenceValue + "cm"); |
| + assert_equals(length.valueInSpecifiedUnits.toFixed(7), referenceValue); |
| + assert_equals(length.value.toFixed(1), "2.0"); |
| + assert_equals(length.unitType, SVGLength.SVG_LENGTHTYPE_CM); |
| + |
| + // Reset to 2px |
| + length.valueAsString = "2px"; |
| + |
| + // Convert from px to mm |
| + length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_MM); |
| + referenceValue = Number(2 * 25.4 / cssPixelsPerInch).toFixed(6); |
| + assert_equals(length.valueAsString, referenceValue + "mm"); |
| + assert_equals(length.valueInSpecifiedUnits.toFixed(6), referenceValue); |
| + assert_equals(length.value.toFixed(1), "2.0"); |
| + assert_equals(length.unitType, SVGLength.SVG_LENGTHTYPE_MM); |
| + |
| + // Reset to 2px |
| + length.valueAsString = "2px"; |
| + |
| + // Convert from px to in |
| + length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_IN); |
| + referenceValue = Number(2 / cssPixelsPerInch).toFixed(7); |
| + assert_equals(length.valueAsString, referenceValue + "in"); |
| + assert_equals(length.valueInSpecifiedUnits.toFixed(7), referenceValue); |
| + assert_equals(length.value.toFixed(1), "2.0"); |
| + assert_equals(length.unitType, SVGLength.SVG_LENGTHTYPE_IN); |
| + |
| + // Reset to 2px |
| + length.valueAsString = "2px"; |
| + |
| + // Convert from px to pt |
| + length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_PT); |
| + referenceValue = Number(2 / cssPixelsPerInch * 72); |
| + assert_equals(length.valueAsString, referenceValue + "pt"); |
| + assert_equals(length.valueInSpecifiedUnits, referenceValue); |
| + assert_equals(length.value.toFixed(1), "2.0"); |
| + assert_equals(length.unitType, SVGLength.SVG_LENGTHTYPE_PT); |
| + |
| + // Reset to 2px |
| + length.valueAsString = "2px"; |
| + |
| + // Convert from px to pc |
| + length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_PC); |
| + referenceValue = Number(2 / cssPixelsPerInch * 6).toFixed(3); |
| + // Don't check valueAsString here, it's unreliable across browsers. |
| + assert_equals(length.valueInSpecifiedUnits.toFixed(3), referenceValue); |
| + assert_equals(length.value.toFixed(1), "2.0"); |
| + assert_equals(length.unitType, SVGLength.SVG_LENGTHTYPE_PC); |
| +}); |
| +</script> |