diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
| commit | 43a97878ce14b72f0981164f87f2e35e14151312 (patch) | |
| tree | 620249daf56c0258faa40cbdcf9cfba06de2a846 /testing/web-platform/tests/css/cssom/cssstyledeclaration-setter-logical.html | |
| parent | Initial commit. (diff) | |
| download | firefox-43a97878ce14b72f0981164f87f2e35e14151312.tar.xz firefox-43a97878ce14b72f0981164f87f2e35e14151312.zip | |
Adding upstream version 110.0.1.upstream/110.0.1upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/css/cssom/cssstyledeclaration-setter-logical.html')
| -rw-r--r-- | testing/web-platform/tests/css/cssom/cssstyledeclaration-setter-logical.html | 73 |
1 files changed, 73 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/cssom/cssstyledeclaration-setter-logical.html b/testing/web-platform/tests/css/cssom/cssstyledeclaration-setter-logical.html new file mode 100644 index 0000000000..13d68e9a70 --- /dev/null +++ b/testing/web-platform/tests/css/cssom/cssstyledeclaration-setter-logical.html @@ -0,0 +1,73 @@ +<!DOCTYPE html> +<title>CSSOM test: declaration block after setting via CSSOM</title> +<link rel="help" href="https://drafts.csswg.org/cssom/#set-a-css-declaration-value"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<div id="log"></div> +<div id="test"></div> +<script> + test(function() { + const PHYSICAL_PROPS = ["padding-top", "padding-right", + "padding-bottom", "padding-left"]; + const LOGICAL_PROPS = ["padding-block-start", "padding-block-end", + "padding-inline-start", "padding-inline-end"]; + let elem = document.getElementById("test"); + let decls = new Map; + + { + let css = [] + let i = 0; + for (let name of [...PHYSICAL_PROPS, ...LOGICAL_PROPS]) { + let value = `${i++}px`; + css.push(`${name}: ${value};`); + decls.set(name, value); + } + elem.setAttribute("style", css.join(" ")); + } + + let style = elem.style; + function indexOfProperty(prop) { + return Array.prototype.indexOf.apply(style, [prop]); + } + function assertPropAfterProps(prop, props, msg) { + let index = indexOfProperty(prop); + for (let p of props) { + assert_less_than(indexOfProperty(p), index, `${prop} should be after ${p} ${msg}`); + } + } + // We are not changing any value in this test, just order. + function assertValueUnchanged() { + for (let [name, value] of decls.entries()) { + assert_equals(style.getPropertyValue(name), value, + `value of ${name} shouldn't be changed`); + } + } + + assertValueUnchanged(); + // Check that logical properties are all after physical properties + // at the beginning. + for (let p of LOGICAL_PROPS) { + assertPropAfterProps(p, PHYSICAL_PROPS, "initially"); + } + + // Try setting a longhand. + style.setProperty("padding-top", "0px"); + assertValueUnchanged(); + // Check that padding-top is after logical properties, but other + // physical properties are still before logical properties. + assertPropAfterProps("padding-top", LOGICAL_PROPS, "after setting padding-top"); + for (let p of LOGICAL_PROPS) { + assertPropAfterProps(p, PHYSICAL_PROPS.filter(prop => prop != "padding-top"), + "after setting padding-top"); + } + + // Try setting a shorthand. + style.setProperty("padding", "0px 1px 2px 3px"); + assertValueUnchanged(); + // Check that all physical properties are now after logical properties. + for (let p of PHYSICAL_PROPS) { + assertPropAfterProps(p, LOGICAL_PROPS, "after setting padding shorthand"); + } + }, "newly set declaration should be after all declarations " + + "in the same logical property group but have different logical kind"); +</script> |