| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../../resources/js-test.js"></script> |
| </head> |
| <body> |
| <script> |
| description("This tests checks that all of the input values for object-position parse correctly."); |
| |
| function test(value) |
| { |
| var div = document.createElement("div"); |
| div.setAttribute("style", value); |
| document.body.appendChild(div); |
| |
| var result = div.style.getPropertyValue("object-position"); |
| document.body.removeChild(div); |
| return result; |
| } |
| |
| function testComputedStyle(value) |
| { |
| var div = document.createElement("div"); |
| div.setAttribute("style", value); |
| document.body.appendChild(div); |
| |
| var result = window.getComputedStyle(div).objectPosition; |
| document.body.removeChild(div); |
| return result; |
| } |
| |
| shouldBeEqualToString('testComputedStyle(";")', '50% 50%'); |
| shouldBeEqualToString('testComputedStyle("object-position: 10px;")', '10px 50%'); |
| shouldBeEqualToString('testComputedStyle("object-position: 10px 10px;")', '10px 10px'); |
| shouldBeEqualToString('testComputedStyle("object-position: right top;")', '100% 0%'); |
| shouldBeEqualToString('testComputedStyle("object-position: top right;")', '100% 0%'); |
| shouldBeEqualToString('testComputedStyle("object-position: left 20px bottom 50%;")', '20px 50%'); |
| shouldBeEqualToString('testComputedStyle("object-position: right 50% bottom 25%;")', '50% 75%'); |
| shouldBeEqualToString('testComputedStyle("object-position: bottom 20px right 12px;")', 'calc(-12px + 100%) calc(-20px + 100%)'); |
| |
| shouldBeEqualToString('test("object-position: inherit;")', 'inherit'); |
| shouldBeEqualToString('test("object-position: initial;")', 'initial'); |
| shouldBeEqualToString('test("object-position: left;")', 'left center'); |
| shouldBeEqualToString('test("object-position: top;")', 'center top'); |
| shouldBeEqualToString('test("object-position: top right;")', 'right top'); |
| shouldBeEqualToString('test("object-position: right top;")', 'right top'); |
| shouldBeEqualToString('test("object-position: center center;")', 'center center'); |
| shouldBeEqualToString('test("object-position: center;")', 'center center'); |
| shouldBeEqualToString('test("object-position: bottom center;")', 'center bottom'); |
| shouldBeEqualToString('test("object-position: left center;")', 'left center'); |
| shouldBeEqualToString('test("object-position: bottom center;")', 'center bottom'); |
| shouldBeEqualToString('test("object-position: center left;")', 'left center'); |
| shouldBeEqualToString('test("object-position: center bottom;")', 'center bottom'); |
| shouldBeEqualToString('test("object-position: 100px;")', '100px center'); |
| shouldBeEqualToString('test("object-position: 100px 100px;")', '100px 100px'); |
| shouldBeEqualToString('test("object-position: 100px 200px;")', '100px 200px'); |
| shouldBeEqualToString('test("object-position: -50% 0;")', '-50% 0px'); |
| shouldBeEqualToString('test("object-position: 3em 0;")', '3em 0px'); |
| shouldBeEqualToString('test("object-position: left 33px;")', 'left 33px'); |
| shouldBeEqualToString('test("object-position: center 33px;")', 'center 33px'); |
| shouldBeEqualToString('test("object-position: 33px center;")', '33px center'); |
| shouldBeEqualToString('test("object-position: 33px bottom;")', '33px bottom'); |
| shouldBeEqualToString('test("object-position: 1vh 1vw;")', '1vh 1vw'); |
| shouldBeEqualToString('test("object-position: left 20px bottom 50%;")', 'left 20px bottom 50%'); |
| shouldBeEqualToString('test("object-position: right 50% bottom 25%;")', 'right 50% bottom 25%'); |
| shouldBeEqualToString('test("object-position: bottom 20px right 12px;")', 'right 12px bottom 20px'); |
| |
| shouldBeEqualToString('test("object-position: 100px 100px 100px;")', ''); |
| shouldBeEqualToString('test("object-position: 100px 100px 200px 200px;")', ''); |
| shouldBeEqualToString('test("object-position: center bottom 25%;")', ''); |
| shouldBeEqualToString('test("object-position: top left center;")', ''); |
| shouldBeEqualToString('test("object-position: top top;")', ''); |
| shouldBeEqualToString('test("object-position: top bottom;")', ''); |
| shouldBeEqualToString('test("object-position: 33px left;")', ''); |
| shouldBeEqualToString('test("object-position: top 33px;")', ''); |
| shouldBeEqualToString('test("object-position: inherit inherit;")', ''); |
| shouldBeEqualToString('test("object-position: initial initial;")', ''); |
| shouldBeEqualToString('test("object-position: -webkit-fill-available;")', ''); |
| shouldBeEqualToString('test("object-position: min-content;")', ''); |
| shouldBeEqualToString('test("object-position: intrinsic;")', ''); |
| shouldBeEqualToString('test("object-position: auto;")', ''); |
| shouldBeEqualToString('test("object-position: none;")', ''); |
| shouldBeEqualToString('test("object-position: fill;")', ''); |
| </script> |
| </body> |
| </html> |
