src/third_party/WebKit/LayoutTests/transforms/2d/transform-value-types.html

   1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
   2 <html>
   3 <head>
   4 <script src="../../resources/js-test.js"></script>
   5 <style id="style" media="screen">
   6 .non-existent-class {
   7     transform: translate(10px)
   8                        translateX(10px)
   9                        translateY(10px)
  10                        rotate(10deg)
  11                        rotate(11rad)
  12                        rotate(12grad)
  13                        rotate(13turn)
  14                        scale(2)
  15                        scaleX(1.2)    /* test uppercase */
  16                        scaley(1.2)
  17                        skew(10deg,      10rad)
  18                        skewX(10deg)
  19                        skewy(11grad)
  20                        matrix(1, 0, 0,     1, 0, 0);
  21 }
  22 </style>
  23 </head>
  24 <body>
  25 <p id="description"></p>
  26 <div id="console"></div>
  27 <script type="text/javascript" charset="utf-8">
  28
  29   var stylesheet = document.getElementById("style").sheet;
  30   var root = document.documentElement;
  31
  32   function jsWrapperClass(node)
  33   {
  34       if (!node)
  35           return "[null]";
  36       var string = Object.prototype.toString.apply(node);
  37       return string.substr(8, string.length - 9);
  38   }
  39
  40   function test(expression, className, prototypeName, constructorName)
  41   {
  42       if (!prototypeName)
  43           prototypeName = className + "Prototype";
  44       if (!constructorName)
  45           constructorName = className + "Constructor";
  46       shouldBe("jsWrapperClass(" + expression + ")", "'" + className + "'");
  47       shouldBe("jsWrapperClass(" + expression + ".__proto__)", "'" + prototypeName + "'");
  48       shouldBe("jsWrapperClass(" + expression + ".constructor)", "'" + constructorName + "'");
  49   }
  50
  51   var transformRule = stylesheet.cssRules.item(0).style.getPropertyCSSValue('transform');
  52   test("transformRule", "CSSValueList");
  53
  54   test("transformRule[0]", "WebKitCSSTransformValue");
  55
  56   shouldBe("transformRule[0].operationType", "WebKitCSSTransformValue.CSS_TRANSLATE");
  57   shouldBe("transformRule[0].cssText", "'translate(10px)'");
  58
  59   shouldBe("transformRule[1].operationType", "WebKitCSSTransformValue.CSS_TRANSLATEX");
  60   shouldBe("transformRule[1].cssText", "'translateX(10px)'");
  61
  62   shouldBe("transformRule[2].operationType", "WebKitCSSTransformValue.CSS_TRANSLATEY");
  63   shouldBe("transformRule[2].cssText", "'translateY(10px)'");
  64
  65   shouldBe("transformRule[3].operationType", "WebKitCSSTransformValue.CSS_ROTATE");
  66   shouldBe("transformRule[3].cssText", "'rotate(10deg)'");
  67
  68   shouldBe("transformRule[4].operationType", "WebKitCSSTransformValue.CSS_ROTATE");
  69   shouldBe("transformRule[4].cssText", "'rotate(11rad)'");
  70
  71   shouldBe("transformRule[5].operationType", "WebKitCSSTransformValue.CSS_ROTATE");
  72   shouldBe("transformRule[5].cssText", "'rotate(12grad)'");
  73
  74   shouldBe("transformRule[6].operationType", "WebKitCSSTransformValue.CSS_ROTATE");
  75   shouldBe("transformRule[6].cssText", "'rotate(13turn)'");
  76
  77   shouldBe("transformRule[7].operationType", "WebKitCSSTransformValue.CSS_SCALE");
  78   shouldBe("transformRule[7].cssText", "'scale(2)'");
  79
  80   shouldBe("transformRule[8].operationType", "WebKitCSSTransformValue.CSS_SCALEX");
  81   shouldBe("transformRule[8].cssText", "'scaleX(1.2)'");
  82
  83   shouldBe("transformRule[9].operationType", "WebKitCSSTransformValue.CSS_SCALEY");
  84   shouldBe("transformRule[9].cssText", "'scaleY(1.2)'");
  85
  86   shouldBe("transformRule[10].operationType", "WebKitCSSTransformValue.CSS_SKEW");
  87   shouldBe("transformRule[10].cssText", "'skew(10deg, 10rad)'");
  88
  89   shouldBe("transformRule[11].operationType", "WebKitCSSTransformValue.CSS_SKEWX");
  90   shouldBe("transformRule[11].cssText", "'skewX(10deg)'");
  91
  92   shouldBe("transformRule[12].operationType", "WebKitCSSTransformValue.CSS_SKEWY");
  93   shouldBe("transformRule[12].cssText", "'skewY(11grad)'");
  94
  95   shouldBe("transformRule[13].operationType", "WebKitCSSTransformValue.CSS_MATRIX");
  96   shouldBe("transformRule[13].cssText", "'matrix(1, 0, 0, 1, 0, 0)'");
  97
  98 </script>
  99 </body>
 100 </html>