| <!doctype html> |
| <meta charset="utf-8"> |
| <link rel="author" href="mailto:[email protected]" title="Emilio Cobos Álvarez"> |
| <link rel="author" href="https://mozilla.org" title="Mozilla"> |
| <link rel="help" href="https://drafts.csswg.org/css-viewport/#zoom-property"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <div style="zoom: 2"> |
| <div style="zoom: 2" id="parent"> |
| <!-- effective zoom of 8, inherited zoom (4) times specified zoom (2) --> |
| <div style="zoom: 2" id="target"></div> |
| </div> |
| </div> |
| <script> |
| const kTestCases = [ |
| // Explicitly inherited reset properties. |
| ["width", "100px", "inherit", "100px"], |
| ["height", "100px", "inherit", "100px"], |
| // Explicitly inherited properties. |
| ["word-spacing", "100px", "inherit", "100px"], |
| ["word-spacing", "100px", "unset", "100px"], |
| // Implicitly inherited properties. |
| ["word-spacing", "100px", "", "100px"], |
| ]; |
| |
| const parent = document.getElementById("parent"); |
| const target = document.getElementById("target"); |
| for (const [prop, parentValue, childValue, expected] of kTestCases) { |
| test(function(t) { |
| parent.style[prop] = parentValue; |
| target.style[prop] = childValue; |
| t.add_cleanup(function() { |
| parent.style[prop] = target.style[prop] = ""; |
| }); |
| assert_equals(getComputedStyle(target).getPropertyValue(prop), expected); |
| }, `${prop}: ${childValue} from ${parentValue}`); |
| } |
| </script> |