| <!DOCTYPE html> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| |
| <div id="container" style="transform: rotate(360deg)"></div> |
| |
| <script> |
| function generatesContainingBlock(property, value) { |
| var outer = document.createElement('div'); |
| outer.style[property] = value; |
| container.appendChild(outer); |
| |
| var inner = document.createElement('div'); |
| outer.appendChild(inner); |
| return inner.offsetParent == outer; |
| } |
| |
| test(function() { |
| assert_true(generatesContainingBlock('transform', 'translate(1px) scale(2) rotate(3deg)')); |
| }, "transform establishes containing block"); |
| test(function() { |
| assert_true(generatesContainingBlock('will-change', 'transform')); |
| }, "will-change: transform establishes containing block"); |
| |
| test(function() { |
| assert_true(generatesContainingBlock('perspective', '4px')); |
| }, "perspective establishes containing block"); |
| test(function() { |
| assert_true(generatesContainingBlock('will-change', 'perspective')); |
| }, "will-change: perspective establishes containing block"); |
| |
| test(function() { |
| assert_true(generatesContainingBlock('translate', '1px')); |
| }, "translate establishes containing block"); |
| test(function() { |
| assert_true(generatesContainingBlock('will-change', 'translate')); |
| }, "will-change: translate establishes containing block"); |
| |
| test(function() { |
| assert_true(generatesContainingBlock('scale', '2')); |
| }, "scale establishes containing block"); |
| test(function() { |
| assert_true(generatesContainingBlock('will-change', 'scale')); |
| }, "will-change: scale establishes containing block"); |
| |
| test(function() { |
| assert_true(generatesContainingBlock('rotate', '3deg')); |
| }, "rotate establishes containing block"); |
| test(function() { |
| assert_true(generatesContainingBlock('will-change', 'rotate')); |
| }, "will-change: rotate establishes containing block"); |
| </script> |
