third_party/WebKit/LayoutTests/fast/css/parsing-object-position.html

   1 <!DOCTYPE html>
   2 <html>
   3     <head>
   4         <script src="../../resources/js-test.js"></script>
   5     </head>
   6     <body>
   7         <script>
   8             description("This tests checks that all of the input values for object-position parse correctly.");
   9
  10             function test(value)
  11             {
  12                 var div = document.createElement("div");
  13                 div.setAttribute("style", value);
  14                 document.body.appendChild(div);
  15
  16                 var result = div.style.getPropertyValue("object-position");
  17                 document.body.removeChild(div);
  18                 return result;
  19             }
  20
  21             function testComputedStyle(value)
  22             {
  23                 var div = document.createElement("div");
  24                 div.setAttribute("style", value);
  25                 document.body.appendChild(div);
  26
  27                 var result = window.getComputedStyle(div).objectPosition;
  28                 document.body.removeChild(div);
  29                 return result;
  30             }
  31
  32             shouldBeEqualToString('testComputedStyle(";")', '50% 50%');
  33             shouldBeEqualToString('testComputedStyle("object-position: 10px;")', '10px 50%');
  34             shouldBeEqualToString('testComputedStyle("object-position: 10px 10px;")', '10px 10px');
  35             shouldBeEqualToString('testComputedStyle("object-position: right top;")', '100% 0%');
  36             shouldBeEqualToString('testComputedStyle("object-position: top right;")', '100% 0%');
  37             shouldBeEqualToString('testComputedStyle("object-position: left 20px center;")', '20px 50%');
  38             shouldBeEqualToString('testComputedStyle("object-position: center bottom 25%;")', '50% 75%');
  39             shouldBeEqualToString('testComputedStyle("object-position: bottom 20px right 12px;")', 'calc(-12px + 100%) calc(-20px + 100%)');
  40
  41             shouldBeEqualToString('test("object-position: inherit;")', 'inherit');
  42             shouldBeEqualToString('test("object-position: initial;")', 'initial');
  43             shouldBeEqualToString('test("object-position: left;")', '0% 50%');
  44             shouldBeEqualToString('test("object-position: top;")', '50% 0%');
  45             shouldBeEqualToString('test("object-position: top right;")', '100% 0%');
  46             shouldBeEqualToString('test("object-position: right top;")', '100% 0%');
  47             shouldBeEqualToString('test("object-position: center center;")', '50% 50%');
  48             shouldBeEqualToString('test("object-position: center;")', '50% 50%');
  49             shouldBeEqualToString('test("object-position: bottom center;")', '50% 100%');
  50             shouldBeEqualToString('test("object-position: left center;")', '0% 50%');
  51             shouldBeEqualToString('test("object-position: bottom center;")', '50% 100%');
  52             shouldBeEqualToString('test("object-position: center left;")', '0% 50%');
  53             shouldBeEqualToString('test("object-position: center bottom;")', '50% 100%');
  54             shouldBeEqualToString('test("object-position: 100px;")', '100px 50%');
  55             shouldBeEqualToString('test("object-position: 100px 100px;")', '100px 100px');
  56             shouldBeEqualToString('test("object-position: 100px 200px;")', '100px 200px');
  57             shouldBeEqualToString('test("object-position: -50% 0;")', '-50% 0px');
  58             shouldBeEqualToString('test("object-position: 3em 0;")', '3em 0px');
  59             shouldBeEqualToString('test("object-position: left 33px;")', '0% 33px');
  60             shouldBeEqualToString('test("object-position: center 33px;")', '50% 33px');
  61             shouldBeEqualToString('test("object-position: 33px center;")', '33px 50%');
  62             shouldBeEqualToString('test("object-position: 33px bottom;")', '33px 100%');
  63             shouldBeEqualToString('test("object-position: 1vh 1vw;")', '1vh 1vw');
  64             shouldBeEqualToString('test("object-position: left 20px center;")', 'left 20px top 50%');
  65             shouldBeEqualToString('test("object-position: center bottom 25%;")', 'left 50% bottom 25%');
  66             shouldBeEqualToString('test("object-position: bottom 20px right 12px;")', 'right 12px bottom 20px');
  67
  68             shouldBeEqualToString('test("object-position: 100px 100px 100px;")', '');
  69             shouldBeEqualToString('test("object-position: 100px 100px 200px 200px;")', '');
  70             shouldBeEqualToString('test("object-position: top left center;")', '');
  71             shouldBeEqualToString('test("object-position: top top;")', '');
  72             shouldBeEqualToString('test("object-position: top bottom;")', '');
  73             shouldBeEqualToString('test("object-position: 33px left;")', '');
  74             shouldBeEqualToString('test("object-position: top 33px;")', '');
  75             shouldBeEqualToString('test("object-position: inherit inherit;")', '');
  76             shouldBeEqualToString('test("object-position: initial initial;")', '');
  77             shouldBeEqualToString('test("object-position: -webkit-fill-available;")', '');
  78             shouldBeEqualToString('test("object-position: min-content;")', '');
  79             shouldBeEqualToString('test("object-position: intrinsic;")', '');
  80             shouldBeEqualToString('test("object-position: auto;")', '');
  81             shouldBeEqualToString('test("object-position: none;")', '');
  82             shouldBeEqualToString('test("object-position: fill;")', '');
  83         </script>
  84     </body>
  85 </html>