summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/html/rendering/dimension-attributes.html
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 00:47:55 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 00:47:55 +0000
commit26a029d407be480d791972afb5975cf62c9360a6 (patch)
treef435a8308119effd964b339f76abb83a57c29483 /testing/web-platform/tests/html/rendering/dimension-attributes.html
parentInitial commit. (diff)
downloadfirefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz
firefox-26a029d407be480d791972afb5975cf62c9360a6.zip
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/html/rendering/dimension-attributes.html')
-rw-r--r--testing/web-platform/tests/html/rendering/dimension-attributes.html233
1 files changed, 233 insertions, 0 deletions
diff --git a/testing/web-platform/tests/html/rendering/dimension-attributes.html b/testing/web-platform/tests/html/rendering/dimension-attributes.html
new file mode 100644
index 0000000000..1d94205e0b
--- /dev/null
+++ b/testing/web-platform/tests/html/rendering/dimension-attributes.html
@@ -0,0 +1,233 @@
+<!doctype html>
+<meta charset=utf-8>
+<title>Test handling of attributes that map to dimension properties</title>
+<meta name="timeout" content="long">
+<link rel="help"
+ href="https://html.spec.whatwg.org/multipage/rendering.html#maps-to-the-dimension-property">
+<link rel="help"
+ href="https://html.spec.whatwg.org/multipage/rendering.html#maps-to-the-dimension-property-(ignoring-zero)">
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<body>
+<!-- We need a place to put our elements so they're bound to a document and
+ have computed style, but we don't want percentages resolved to lengths,
+ so need to make sure they have no CSS boxes -->
+<div id="container" style="display: none"></div>
+<script>
+ /*
+ * This test tests
+ *
+ * https://html.spec.whatwg.org/multipage/rendering.html#maps-to-the-dimension-property
+ * and
+ * https://html.spec.whatwg.org/multipage/rendering.html#maps-to-the-dimension-property-(ignoring-zero)
+ * for various elements and various values.
+ */
+
+ /*
+ * Array of input/output pairs. The input is the string to use as the
+ * attribute value. The output is the string expected as the computed style
+ * for the relevant CSS property.
+ */
+const valid_values = [
+ // Valid values
+ [ "200", "200px" ],
+ [ "1007", "1007px" ],
+ [ " 00523 ", "523px" ],
+ [ "200.25", "200.25px" ],
+ [ "200.7", "200.7px" ],
+ [ "200.", "200px" ],
+ [ "200in", "200px" ],
+ [ "200.25in", "200.25px" ],
+ [ "200 %", "200px" ],
+ [ "200 abc", "200px" ],
+ [ "200%", "200%" ],
+ [ "200%abc", "200%" ],
+ [ "200.25%", "200.25%" ],
+ [ "200.%", "200%" ],
+ [ "20.25e2", "20.25px" ],
+ [ "20.25E2", "20.25px" ],
+];
+
+ /*
+ * Values that are only valid for the not-ignoring-zero case.
+ */
+const zero_values = [
+ [ "0", "0px" ],
+ [ "0%", "0%" ],
+ [ "0px", "0px" ],
+];
+
+ /*
+ * Array of invalid values. These should lead to the default value of the
+ * relevant CSS property.
+ */
+const invalid_values = [
+ "-0",
+ "-0%",
+ "-200",
+ "-200px",
+ " -200",
+ "+-200",
+ "-+200",
+ "-200%",
+ "+200",
+ " +200in ",
+ " +200.25in ",
+ "+200%",
+ " +200.25% ",
+ " +200.25%abc",
+ "+0",
+ "+0%",
+ ".",
+ ".%",
+ ".x",
+ ".5",
+ ".5%"
+];
+
+const valid_values_with_0 =
+ valid_values.concat(zero_values);
+const invalid_values_with_0 =
+ invalid_values.concat(zero_values.map((v) => v[0]));
+
+function newElem(name) {
+ return () => document.createElement(name);
+}
+
+function newImageInput() {
+ return () => {
+ var elem = newElem("input")();
+ elem.type = "image";
+ return elem;
+ }
+}
+
+function newImgSource() {
+ return () => {
+ var elem = newElem("source")();
+ elem.setAttribute("srcset", "/images/green-100x50.png");
+ return elem;
+ }
+}
+
+/*
+ * Array of tests. Each test consists of the following information:
+ *
+ * 1) An element creation function.
+ * 2) The name of the attribute to set
+ * 3) The name of the CSS property to get.
+ * 4) A boolean indicating whether 0 is a valid value for the dimension
+ * attribute.
+ */
+const tests = [
+ [ newElem("hr"), "width", "width", true ],
+ [ newElem("iframe"), "width", "width", true ],
+ [ newElem("iframe"), "height", "height", true ],
+ [ newImageInput(), "width", "width", true ],
+ [ newImageInput(), "height", "height", true ],
+ [ newElem("marquee"), "width", "width", true ],
+ [ newElem("marquee"), "height", "height", true ],
+ [ newElem("video"), "width", "width", true ],
+ [ newElem("video"), "height", "height", true ],
+ [ newElem("object"), "width", "width", true ],
+ [ newElem("object"), "height", "height", true ],
+ [ newElem("embed"), "width", "width", true ],
+ [ newElem("embed"), "height", "height", true ],
+ [ newElem("img"), "width", "width", true ],
+ [ newElem("img"), "height", "height", true ],
+ [ newElem("td"), "width", "width", false ],
+ [ newElem("td"), "height", "height", false ],
+ [ newElem("table"), "width", "width", false ],
+ [ newElem("table"), "height", "height", true ],
+ [ newElem("tr"), "height", "height", true ],
+ [ newElem("col"), "width", "width", true ],
+ [ newElem("embed"), "hspace", "marginLeft", true ],
+ [ newElem("embed"), "hspace", "marginRight", true ],
+ [ newElem("embed"), "vspace", "marginTop", true ],
+ [ newElem("embed"), "vspace", "marginBottom", true ],
+ [ newElem("img"), "hspace", "marginLeft", true ],
+ [ newElem("img"), "hspace", "marginRight", true ],
+ [ newElem("img"), "vspace", "marginTop", true ],
+ [ newElem("img"), "vspace", "marginBottom", true ],
+ [ newElem("object"), "hspace", "marginLeft", true ],
+ [ newElem("object"), "hspace", "marginRight", true ],
+ [ newElem("object"), "vspace", "marginTop", true ],
+ [ newElem("object"), "vspace", "marginBottom", true ],
+ [ newImageInput(), "hspace", "marginLeft", true ],
+ [ newImageInput(), "hspace", "marginRight", true ],
+ [ newImageInput(), "vspace", "marginTop", true ],
+ [ newImageInput(), "vspace", "marginBottom", true ],
+ [ newElem("marquee"), "hspace", "marginLeft", true ],
+ [ newElem("marquee"), "hspace", "marginRight", true ],
+ [ newElem("marquee"), "vspace", "marginTop", true ],
+ [ newElem("marquee"), "vspace", "marginBottom", true ],
+ // <source width> is mapped to <img> width if both are in <picture>.
+ [ newImgSource(), "width", "width", true, newElem("img"), newElem("picture") ],
+ // <source height> is mapped to <img> height if both are in <picture>.
+ [ newImgSource(), "height", "height", true, newElem("img"), newElem("picture") ],
+];
+
+function style(element) {
+ return element.ownerDocument.defaultView.getComputedStyle(element);
+}
+
+const container = document.getElementById("container");
+
+for (let [ctor, attr, prop, zero_allowed, mappedElemCtor, containerCtor] of tests) {
+ let valid, invalid;
+ if (zero_allowed) {
+ valid = valid_values_with_0;
+ invalid = invalid_values;
+ } else {
+ valid = valid_values;
+ invalid = invalid_values_with_0;
+ }
+
+ let elemContainer = null;
+ if (!!containerCtor) {
+ elemContainer = containerCtor();
+ container.appendChild(elemContainer);
+ } else {
+ elemContainer = container;
+ }
+
+ let runTest = (value, expected) => {
+ let elem = ctor();
+ let mappedElem = !!mappedElemCtor ? mappedElemCtor() : elem;
+ test(function() {
+ this.add_cleanup(() => {
+ elem.remove();
+ if (!!mappedElemCtor) {
+ mappedElem.remove();
+ }
+ });
+ elem.setAttribute(attr, value);
+ assert_equals(elem.getAttribute(attr), value);
+ elemContainer.appendChild(elem);
+ if (!!mappedElemCtor) {
+ elemContainer.appendChild(mappedElem);
+ }
+ assert_equals(style(mappedElem)[prop], expected);
+ }, `<${elem.localName} ${attr}="${value}"> mapping to ` +
+ `<${mappedElem.localName}> ${prop} property`);
+ }
+
+ for (let [value, result] of valid) {
+ runTest(value, result);
+ }
+
+ let default_elem = !!mappedElemCtor ? mappedElemCtor() : ctor();
+ elemContainer.appendChild(default_elem);
+ let defaultVal = style(default_elem)[prop];
+ default_elem.remove();
+ for (let value of invalid) {
+ runTest(value, defaultVal);
+ }
+
+ if (!!containerCtor) {
+ elemContainer.remove();
+ }
+}
+
+</script>
+</body>
generated by cgit v1.2.3 (git 2.39.1) at 2024-07-10 20:05:30 +0000