| <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> |
| <html> |
| <head> |
| <script src="../../resources/js-test-pre.js"></script> |
| </head> |
| <body> |
| <script> |
| description('Tests padding-start and padding-end'); |
| |
| function test(dir, prop, value, queryProp) |
| { |
| var div = document.createElement('div'); |
| div.setAttribute('style', 'width:100px;' + prop + ':' + value); |
| div.dir = dir; |
| document.body.appendChild(div); |
| |
| var result = getComputedStyle(div).getPropertyValue(queryProp); |
| document.body.removeChild(div); |
| return result; |
| } |
| |
| function testWidth(dir, prop, value) |
| { |
| var div = document.createElement('div'); |
| div.setAttribute('style', 'width:100px;' + prop + ':' + value); |
| div.dir = dir; |
| document.body.appendChild(div); |
| |
| var result = div.offsetWidth; |
| document.body.removeChild(div); |
| return result; |
| } |
| |
| shouldBe('testWidth("ltr", "-webkit-padding-start", "10px")', '110'); |
| shouldBe('testWidth("ltr", "-webkit-padding-end", "20px")', '120'); |
| shouldBeEqualToString('test("ltr", "-webkit-padding-start", "10px", "padding-left")', '10px'); |
| shouldBeEqualToString('test("ltr", "-webkit-padding-end", "20px", "padding-right")', '20px'); |
| shouldBeEqualToString('test("ltr", "padding-left", "10px", "-webkit-padding-start")', '10px'); |
| shouldBeEqualToString('test("ltr", "padding-right", "20px", "-webkit-padding-end")', '20px'); |
| |
| shouldBe('testWidth("rtl", "-webkit-padding-start", "10px")', '110'); |
| shouldBe('testWidth("rtl", "-webkit-padding-end", "20px")', '120'); |
| shouldBeEqualToString('test("rtl", "-webkit-padding-start", "10px", "padding-right")', '10px'); |
| shouldBeEqualToString('test("rtl", "-webkit-padding-end", "20px", "padding-left")', '20px'); |
| shouldBeEqualToString('test("rtl", "padding-right", "10px", "-webkit-padding-start")', '10px'); |
| shouldBeEqualToString('test("rtl", "padding-left", "20px", "-webkit-padding-end")', '20px'); |
| </script> |
| <script src="../../resources/js-test-post.js"></script> |
| </body> |
| </html> |
