third_party/WebKit/LayoutTests/transforms/translate-parsing.html

   1 <!DOCTYPE html>
   2 <script src="../resources/testharness.js"></script>
   3 <script src="../resources/testharnessreport.js"></script>
   4 <div id="target" style="width: 100px; height: 200px; display: inline-block"></div>
   5 <script src="resources/parsing-test-helper.js"></script>
   6 <script>
   7 expect = expect.bind(this, 'translate', 'translate');
   8
   9 expect('initial').parsesAs('initial').isComputedTo('0px');
  10 expect('inherit').parsesAs('inherit');
  11
  12 expect('10px').parsesAs('10px').isComputedTo('10px');
  13 expect('10px -2.5px').parsesAs('10px -2.5px').isComputedTo('10px -2.5px');
  14 expect('10px -2.5px 0').parsesAs('10px -2.5px 0px').isComputedTo('10px -2.5px');
  15
  16 expect('42.5%').parsesAs('42.5%').isComputedTo('42.5px');
  17 expect('42.5% -20.5%').parsesAs('42.5% -20.5%').isComputedTo('42.5px -41px');
  18 expect('42.5% -20.5% 5px').parsesAs('42.5% -20.5% 5px').isComputedTo('42.5px -41px 5px');
  19
  20 expect('10px -2%').parsesAs('10px -2%').isComputedTo('10px -4px');
  21 expect('10% -2px').parsesAs('10% -2px').isComputedTo('10px -2px');
  22 expect('10% -2px 4px').parsesAs('10% -2px 4px').isComputedTo('10px -2px 4px');
  23
  24 expect('calc(100%) calc(20px) calc(-1px)').isComputedTo('100px 20px -1px');
  25 expect('calc(100% + 10px) calc(100% - 10px) calc(100px + 200px)').parsesAs('calc(100% + 10px) calc(100% - 10px) calc(300px)').isComputedTo('110px 190px 300px');
  26 expect('calc(100% * 0.5 + 2px) calc(100% - 10px / 2) calc(100px - 200px)').parsesAs('calc(50% + 2px) calc(100% - 5px) calc(-100px)').isComputedTo('52px 195px -100px');
  27
  28 expect('2').isInvalid();
  29 expect('none').isInvalid();
  30 expect('10deg 10px').isInvalid();
  31 expect('10px 10px 10%').isInvalid();
  32 expect('20smigens').isInvalid();
  33 expect('10px 20px 5 6').isInvalid();
  34 expect('10% 20% 30%').isInvalid();
  35 expect('calc(100% + 10px) calc(100% - 10px) calc(100% + 200px)').isInvalid(); // Last parameter should not have percent
  36
  37 /* Test codepath where layout box is not available */
  38 target.style.display = 'none';
  39
  40 expect('42.5%').parsesAs('42.5%').isComputedTo('42.5%');
  41 expect('42.5% -20.5%').parsesAs('42.5% -20.5%').isComputedTo('42.5% -20.5%');
  42 expect('42.5% -20.5% 5px').parsesAs('42.5% -20.5% 5px').isComputedTo('42.5% -20.5% 5px');
  43
  44 expect('calc(100%) calc(20px) calc(-1px)').isComputedTo('100% 20px -1px');
  45 expect('calc(100% + 10px) calc(100% - 10px) calc(100px + 200px)').parsesAs('calc(100% + 10px) calc(100% - 10px) calc(300px)').isComputedTo('calc(10px + 100%) calc(-10px + 100%) 300px');
  46 expect('calc(100% * 0.5 + 2px) calc(100% - 10px / 2) calc(100px - 200px)').parsesAs('calc(50% + 2px) calc(100% - 5px) calc(-100px)').isComputedTo('calc(2px + 50%) calc(-5px + 100%) -100px');
  47 </script>