| <!DOCTYPE HTML> |
| <script src="../../resources/js-test-pre.js"></script> |
| <style> |
| #controlsimple { color: hsl(120,75%,50%); } |
| #simple { color: hsl(calc(120),calc(75%),calc(50%)); } |
| |
| #controlalpha { color: hsla(120,75%,50%,0.7); } |
| #alpha { color: hsla(calc(120),calc(75%),calc(50%), calc(0.7)); } |
| </style> |
| <div id="test-container"> |
| <hr/> |
| <div id="controlsimple">These two sentences should be the same color (simple)</div> |
| <div id="simple">These two sentences should be the same color (simple)</div> |
| <hr/> |
| <div id="controlalpha">These two sentences should be the same color (alpha)</div> |
| <div id="alpha">These two sentences should be the same color (alpha)</div> |
| </div> |
| <script> |
| description("Tests that CSS3 calc() can be used with the hsl() and hsla() functions"); |
| |
| tests = ["simple", "alpha"]; |
| |
| for (i = 0; i < tests.length; i++) { |
| var test = tests[i]; |
| shouldBeEqualToString('getComputedStyle(document.getElementById("' + test + '"), null).color', getComputedStyle(document.getElementById("control" + test), null).color); |
| } |
| |
| if (window.testRunner) |
| document.body.removeChild(document.getElementById("test-container")); |
| </script> |
| <script src="../../resources/js-test-post.js"></script> |
| |
