| <!DOCTYPE html> |
| <script src="../../../resources/testharness.js"></script> |
| <script src="../../../resources/testharnessreport.js"></script> |
| <meta charset="UTF-8"> |
| |
| <style> |
| #test1 { |
| --x: 1px; |
| transform-origin: var(--x) 1px 1px; |
| } |
| |
| #test2 { |
| --y: 1px; |
| transform-origin: 1px var(--y) 1px; |
| } |
| |
| #test3 { |
| --z: 1px; |
| transform-origin: 1px 1px var(--z); |
| } |
| </style> |
| |
| <div id="test1"></div> |
| <div id="test2"></div> |
| <div id="test3"></div> |
| <script> |
| test(function() { |
| assert_equals(getComputedStyle(test1).transformOrigin, "1px 1px 1px", "X component"); |
| assert_equals(getComputedStyle(test2).transformOrigin, "1px 1px 1px", "Y component"); |
| assert_equals(getComputedStyle(test3).transformOrigin, "1px 1px 1px", "Z component"); |
| }, "Test that setting each component of transformOrigin to a variable reference works."); |
| </script> |