third_party/WebKit/LayoutTests/fast/svg/svglength.html

   1 <!doctype html>
   2 <title>SVGlength tests</title>
   3 <script src=../../resources/testharness.js></script>
   4 <script src=../../resources/testharnessreport.js></script>
   5 <div id="testcontainer">
   6 <svg width="1" height="1" visibility="hidden">
   7 </svg>
   8 </div>
   9 <div id=log></div>
  10 <script>
  11 var svg = document.querySelector("svg");
  12 var EPSILON = Math.pow(2, -8);
  13 var lengths = [ 10, 0, 360, 500, 90, 180, 45, 25.9];
  14
  15 var units = {
  16     "" : 1,
  17     "%": 2,
  18     "em": 3,
  19     "ex": 4,
  20     "px": 5,
  21     "cm": 6,
  22     "mm": 7,
  23     "in": 8,
  24     "pt": 9,
  25     "pc": 10,
  26     "rem": 11,
  27     "ch":12
  28 };
  29 var highestExposedUnit = 10; // SVG_LENGTHTYPE_PC
  30 var unitconstants = {
  31     "UNKNOWN" : 0,
  32     "NUMBER": 1,
  33     "PERCENTAGE": 2,
  34     "EMS": 3,
  35     "EXS": 4,
  36     "PX": 5,
  37     "CM": 6,
  38     "MM": 7,
  39     "IN": 8,
  40     "PT": 9,
  41     "PC": 10,
  42 };
  43 var nonexposedunitconstants = {
  44     "REMS": 11,
  45     "CHS":12
  46 };
  47
  48 function convertTo(value, unit, outunit) {
  49     var userUnits;
  50     var cssPixelsPerInch = 96;
  51     var cssPixelsPerCentimeter = cssPixelsPerInch / 2.54; //2.54 cm/in
  52     var cssPixelsPerMillimeter = cssPixelsPerCentimeter / 10;
  53     var cssPixelsPerPoint = cssPixelsPerInch / 72;
  54     var cssPixelsPerPica = cssPixelsPerInch / 6;
  55
  56     switch(unit) {
  57         case "":
  58         case "px":
  59             userUnits = value;
  60             break;
  61         case "%":
  62         case "em":
  63         case "ex":
  64         case "rem":
  65         case "ch":
  66             return value;
  67         case "cm":
  68             userUnits = value * cssPixelsPerCentimeter;
  69             break;
  70         case "mm":
  71             userUnits = value * cssPixelsPerMillimeter;
  72             break;
  73         case "in":
  74             userUnits = value * cssPixelsPerInch;
  75             break;
  76         case "pt":
  77             userUnits = value * cssPixelsPerPoint;
  78             break;
  79         case "pc":
  80             userUnits = value * cssPixelsPerPica;
  81             break;
  82     }
  83
  84     switch(outunit) {
  85         case "":
  86         case "px":
  87             return userUnits;
  88         case "%":
  89         case "em":
  90         case "ex":
  91         case "rem":
  92         case "ch":
  93             return value;
  94         case "cm":
  95             return userUnits / cssPixelsPerCentimeter;
  96         case "mm":
  97             return userUnits / cssPixelsPerMillimeter;
  98         case "in":
  99             return userUnits / cssPixelsPerInch;
 100         case "pt":
 101             return userUnits / cssPixelsPerPoint;
 102         case "pc":
 103             return userUnits / cssPixelsPerPica;
 104     }
 105 }
 106
 107 function createLength(valuestr) {
 108     var length = svg.createSVGLength();
 109     length.valueAsString = valuestr;
 110     return length;
 111 }
 112
 113 for(var unit in units) {
 114     test(function() {
 115         var result = undefined;
 116         try {
 117             var a = createLength(10 + unit);
 118             result = a.unitType;
 119         }
 120         catch(e) {}
 121             if (units[unit] > highestExposedUnit)
 122                 assert_equals(result, undefined);
 123             else
 124                 assert_equals(result, units[unit]);
 125     }, "SVGLength(10" + unit + ").unitType");
 126 }
 127
 128 for(var constant in unitconstants) {
 129     var str = "SVG_LENGTHTYPE_" + constant;
 130     test(function() {
 131         assert_exists(SVGLength, str, "");
 132     }, "SVGLength." + str);
 133 }
 134 for(var constant in nonexposedunitconstants) {
 135     var str = "SVG_LENGTHTYPE_" + constant;
 136     test(function() {
 137         assert_not_exists(SVGLength, str, "");
 138     }, "SVGLength." + str);
 139 }
 140
 141 lengths.forEach(function(length) {
 142     for(var unit in units) {
 143         var lengthstr = length + unit;
 144         var ref;
 145         try {
 146             ref = createLength(lengthstr);
 147         }
 148         catch(e) {
 149             continue;
 150         }
 151
 152         test(function() {
 153             assert_approx_equals(length, ref.valueInSpecifiedUnits, EPSILON);
 154         }, "SVGLength(" + lengthstr + ").valueInSpecifiedUnits");
 155
 156         for (var otherunit in units) {
 157             test(function() {
 158                 var a = createLength(lengthstr);
 159                 try {
 160                     a.convertToSpecifiedUnits(units[otherunit]);
 161                 }
 162                 catch(e) {}
 163
 164                 // unknown unit
 165                 if (units[otherunit] > highestExposedUnit)
 166                     assert_approx_equals(a.valueInSpecifiedUnits, length, EPSILON);
 167                 else
 168                     assert_approx_equals(a.valueInSpecifiedUnits, convertTo(length, unit, otherunit), EPSILON);
 169             }, "SVGLength(" + lengthstr + ").convertToSpecifiedUnits(" + units[otherunit] + " /*" + (otherunit ? otherunit : "unspecified") + "*/)");
 170
 171             test(function() {
 172                 var result = "";
 173                 try {
 174                     var a = createLength(47 + otherunit);
 175                     a.newValueSpecifiedUnits(units[unit], length);
 176                     result = a.valueAsString;
 177                 }
 178                 catch(e) {
 179                 }
 180
 181                 // unknown unit
 182                 if (units[unit] > highestExposedUnit || units[otherunit] > highestExposedUnit)
 183                     assert_equals(result, "");
 184                 else
 185                     assert_equals(result, ref.valueAsString);
 186             }, "newValueSpecifiedUnits(" + units[unit] + ", " + length + ")" );
 187         };
 188
 189     }
 190 });
 191
 192
 193 </script>