| <!DOCTYPE html> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <svg width="1" height="1" visibility="hidden"> |
| </svg> |
| <script> |
| var svgElement = document.querySelector("svg"); |
| var viewportWidth = window.innerWidth; |
| var viewportHeight = window.innerHeight; |
| var EPSILON = Math.pow(2, -8); |
| |
| function viewportWidthPercent() |
| { |
| return (viewportWidth / 100); |
| } |
| |
| function viewportHeightPercent() |
| { |
| return (viewportHeight / 100); |
| } |
| |
| function viewportMinPercent() |
| { |
| return (Math.min(viewportWidth, viewportHeight) / 100); |
| } |
| |
| function viewportMaxPercent() |
| { |
| return (Math.max(viewportWidth, viewportHeight) / 100); |
| } |
| |
| test(function() { |
| svgElement.setAttribute("width", "10vw"); |
| assert_approx_equals(svgElement.width.baseVal.value, 10 * viewportWidthPercent(), EPSILON); |
| assert_equals(svgElement.width.baseVal.valueInSpecifiedUnits, 10); |
| svgElement.width.baseVal.valueAsString = '2vw'; |
| assert_equals(svgElement.width.baseVal.valueInSpecifiedUnits, 2); |
| assert_approx_equals(svgElement.width.baseVal.value, 2 * viewportWidthPercent(), EPSILON); |
| assert_equals(svgElement.width.baseVal.unitType, SVGLength.SVG_LENGTHTYPE_UNKNOWN); |
| }, "Tests vw unit"); |
| |
| test(function() { |
| svgElement.setAttribute("width", "10vh"); |
| assert_approx_equals(svgElement.width.baseVal.value, 10 * viewportHeightPercent(), EPSILON); |
| assert_equals(svgElement.width.baseVal.valueInSpecifiedUnits, 10); |
| svgElement.width.baseVal.valueAsString = '2vh'; |
| assert_equals(svgElement.width.baseVal.valueInSpecifiedUnits, 2); |
| assert_approx_equals(svgElement.width.baseVal.value, 2 * viewportHeightPercent(), EPSILON); |
| assert_equals(svgElement.width.baseVal.unitType, SVGLength.SVG_LENGTHTYPE_UNKNOWN); |
| }, "Tests vh unit"); |
| |
| test(function() { |
| svgElement.setAttribute("width", "10vmin"); |
| assert_approx_equals(svgElement.width.baseVal.value, 10 * viewportMinPercent(), EPSILON); |
| assert_equals(svgElement.width.baseVal.valueInSpecifiedUnits, 10); |
| svgElement.width.baseVal.valueAsString = '2vmin'; |
| assert_equals(svgElement.width.baseVal.valueInSpecifiedUnits, 2); |
| assert_approx_equals(svgElement.width.baseVal.value, 2 * viewportMinPercent(), EPSILON); |
| assert_equals(svgElement.width.baseVal.unitType, SVGLength.SVG_LENGTHTYPE_UNKNOWN); |
| }, "Tests vmin unit"); |
| |
| test(function() { |
| svgElement.setAttribute("width", "10vmax"); |
| assert_approx_equals(svgElement.width.baseVal.value, 10 * viewportMaxPercent(), EPSILON); |
| assert_equals(svgElement.width.baseVal.valueInSpecifiedUnits, 10); |
| svgElement.width.baseVal.valueAsString = '2vmax'; |
| assert_equals(svgElement.width.baseVal.valueInSpecifiedUnits, 2); |
| assert_approx_equals(svgElement.width.baseVal.value, 2 * viewportMaxPercent(), EPSILON); |
| assert_equals(svgElement.width.baseVal.unitType, SVGLength.SVG_LENGTHTYPE_UNKNOWN); |
| }, "Tests vmax unit"); |
| |
| </script> |
