Impressum test_bug877690.html Interaktion und
Portierbarkeitunbekannt

<!DOCTYPE HTML>
<html>

<head>
<meta charset="utf-8">
<title>Test for InspectorUtils.getCSSValuesForProperty</title>
<script src="/tests/SimpleTest/SimpleTest.js"></script>
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
<script>

/** Test for InspectorUtils.getCSSValuesForProperty **/

const InspectorUtils = SpecialPowers.InspectorUtils;

// Returns true if values contains all and only the expected values. False otherwise.
function testValues(values, expected) {
  values.sort();
  expected.sort();

  info(JSON.stringify([...values]));
  info(JSON.stringify(expected));

  if (values.length !== expected.length) {
    return false;
  }

  for (var i = 0; i < values.length; ++i) {
    if (values[i] !== expected[i]) {
      return false;
    }
  }
  return true;
}

function do_test() {
  var allColors = [
    "COLOR",
    "currentColor",
    "transparent",
    "rgb",
    "rgba",
    "hsl",
    "hsla",
    "hwb",
    "color-mix",
    "color",
    "lab",
    "lch",
    "light-dark",
    "oklab",
    "oklch"
  ];

  var allGradients = [
    "linear-gradient",
    "-webkit-linear-gradient",
    "-moz-linear-gradient",
    "repeating-linear-gradient",
    "-webkit-repeating-linear-gradient",
    "-moz-repeating-linear-gradient",
    "radial-gradient",
    "-webkit-radial-gradient",
    "-moz-radial-gradient",
    "repeating-radial-gradient",
    "-webkit-repeating-radial-gradient",
    "-moz-repeating-radial-gradient",
    "-webkit-gradient",
    "conic-gradient",
    "repeating-conic-gradient",
  ];

  // test a property with keywords and colors
  var prop = "color";
  var values = InspectorUtils.getCSSValuesForProperty(prop);
  var expected = [ "initial", "inherit", "unset", "revert", "revert-layer", ...allColors ];
  ok(testValues(values, expected), "property color's values.");

  // test a shorthand property
  var prop = "background";
  var values = InspectorUtils.getCSSValuesForProperty(prop);
  var expected = [ "auto", "initial", "inherit", "unset", "revert", "revert-layer", ...allColors, "no-repeat", "repeat",
      "repeat-x", "repeat-y", "space", "round", "fixed", "scroll", "local", "center", "top", "bottom", "left", "right",
      "border-box", "padding-box", "content-box", "text", "contain",
      "cover", "none", "-moz-element", "url", ...allGradients, "image-set" ];

  if(SpecialPowers.getBoolPref("layout.css.cross-fade.enabled")) {
    expected.push("cross-fade");
  }

  ok(testValues(values, expected), "property background values.");

  var prop = "border";
  var values = InspectorUtils.getCSSValuesForProperty(prop);
  var expected = [ "initial", "unset", "revert", "revert-layer", "dashed", "dotted", "double",
      "groove", "hidden", "inherit", "inset", "medium", "none", "outset", "ridge",
      "solid", "thick", "thin", ...allColors ]
  ok(testValues(values, expected), "property border values.");

  // test keywords only
  var prop = "border-top";
  var values = InspectorUtils.getCSSValuesForProperty(prop);
  var expected = [ "initial", "inherit", "revert", "revert-layer", "unset", "thin", "medium", "thick", "none", "hidden", "dotted",
      "dashed", "solid", "double", "groove", "ridge", "inset", "outset", ...allColors ];
  ok(testValues(values, expected), "property border-top's values.");

  // tests no keywords or colors
  var prop = "padding-bottom";
  var values = InspectorUtils.getCSSValuesForProperty(prop);
  var expected = [ "initial", "inherit", "unset", "revert", "revert-layer" ];
  ok(testValues(values, expected), "property padding-bottom's values.");

  // test proprety
  var prop = "display";
  var values = InspectorUtils.getCSSValuesForProperty(prop);
  var expected = [ "initial", "inherit", "unset", "revert", "revert-layer", "none", "inline", "block", "inline-block", "list-item",
      "table", "inline-table", "table-row-group", "table-header-group", "table-footer-group", "table-row",
      "table-column-group", "table-column", "table-cell", "table-caption",
      "flex", "inline-flex", "-webkit-box", "-webkit-inline-box",
      "grid", "inline-grid", "inline list-item", "inline flow-root list-item", "flow-root list-item",
      "ruby", "ruby-base", "ruby-base-container", "ruby-text", "ruby-text-container", "block ruby",
      "contents", "flow-root" ];
  ok(testValues(values, expected), "property display's values.");

  // test property
  var prop = "float";
  var values = InspectorUtils.getCSSValuesForProperty(prop);
  var expected = [ "initial", "inherit", "unset", "revert", "revert-layer", "none", "left", "right", "inline-start", "inline-end" ];
  ok(testValues(values, expected), "property float's values.");

  // Test property with "auto"
  var prop = "margin";
  var values = InspectorUtils.getCSSValuesForProperty(prop);
  var expected = [ "initial", "unset", "auto", "inherit", "revert", "revert-layer" ];

  if(SpecialPowers.getBoolPref("layout.css.anchor-positioning.enabled")) {
    expected.push("anchor-size");
  }

  ok(testValues(values, expected), "property margin's values.");

  var prop = "inset";
  var values = InspectorUtils.getCSSValuesForProperty(prop);
  var expected = [ "initial", "unset", "auto", "inherit", "revert", "revert-layer" ];

  if(SpecialPowers.getBoolPref("layout.css.anchor-positioning.enabled")) {
    expected.push(...["anchor", "anchor-size"]);
  }

  ok(testValues(values, expected), "property inset's values.");

  var prop = "width";
  var values = InspectorUtils.getCSSValuesForProperty(prop);
  var expected = [
    "-moz-available",
    "-webkit-fill-available",
    "auto",
    "fit-content",
    "inherit",
    "initial",
    "max-content",
    "min-content",
    "revert",
    "revert-layer",
    "stretch",
    "unset",
  ];

  if(SpecialPowers.getBoolPref("layout.css.anchor-positioning.enabled")) {
    expected.push("anchor-size");
  }

  ok(testValues(values, expected), "property width's values.");

  var prop = "max-width";
  var values = InspectorUtils.getCSSValuesForProperty(prop);
  var expected = [
    "-moz-available",
    "-webkit-fill-available",
    "none",
    "fit-content",
    "inherit",
    "initial",
    "max-content",
    "min-content",
    "revert",
    "revert-layer",
    "stretch",
    "unset",
  ];

  if(SpecialPowers.getBoolPref("layout.css.anchor-positioning.enabled")) {
    expected.push("anchor-size");
  }

  ok(testValues(values, expected), "property max-width's values.");

  // Test property with "normal"
  var prop = "font-style";
  var values = InspectorUtils.getCSSValuesForProperty(prop);
  var expected = [ "initial", "inherit", "unset", "revert", "revert-layer", "italic", "normal", "oblique" ];
  ok(testValues(values, expected), "property font-style's values.");

  // Test property with "cubic-bezier" and "step".
  var prop = "transition";
  var values = InspectorUtils.getCSSValuesForProperty(prop);
  var expected = [ "initial", "all", "unset", "cubic-bezier", "ease", "ease-in", "ease-in-out",
                   "ease-out", "inherit", "revert", "revert-layer", "linear", "none", "step-end", "step-start",
                   "steps", "normal", "allow-discrete" ];
  ok(testValues(values, expected), "property transition's values.");

  // test invalid property
  var prop = "invalidProperty";
  try {
    InspectorUtils.getCSSValuesForProperty(prop);
    ok(false, "invalid property should throw an exception");
  }
  catch(e) {
    // test passed
  }

  // test border-image property, for bug 973345
  var prop = "border-image";
  var values = InspectorUtils.getCSSValuesForProperty(prop);
  var expected = [ "auto", "inherit", "revert", "revert-layer", "initial", "unset", "repeat", "stretch",
                   "-moz-element", "url", ...allGradients,
                   "fill", "none", "round", "space", "image-set" ];

  if(SpecialPowers.getBoolPref("layout.css.cross-fade.enabled")) {
    expected.push("cross-fade");
  }

  ok(testValues(values, expected), "property border-image's values.");

  var prop = "background-size"
  var values = InspectorUtils.getCSSValuesForProperty(prop);
  var expected = [ "auto", "inherit", "revert", "revert-layer", "initial", "unset", "contain", "cover" ];
  ok(testValues(values, expected), "property background-size's values.");

  // Regression test for bug 1255401.
  var prop = "all"
  var values = InspectorUtils.getCSSValuesForProperty(prop);
  var expected = [ "inherit", "initial", "unset", "revert", "revert-layer" ];
  ok(testValues(values, expected), "property all's values.");

  var prop = "quotes"
  var values = InspectorUtils.getCSSValuesForProperty(prop);
  var expected = [ "inherit", "initial", "unset", "revert", "revert-layer", "auto", "none" ];
  ok(testValues(values, expected), "property quotes's values.");

  // Regression test for bug 1255384.
  for (prop of ["counter-increment", "counter-reset"]) {
    var values = InspectorUtils.getCSSValuesForProperty(prop);
    var expected = [ "inherit", "initial", "unset", "none", "revert", "revert-layer" ];
    ok(testValues(values, expected), "property " + prop + "'s values.");
  }

  // Regression test for bug 1430616
  var prop = "text-align";
  var values = InspectorUtils.getCSSValuesForProperty(prop);
  ok(values.includes("match-parent"), "property text-align includes match-parent");

  // Regression test for bug 1255402.
  var expected = [ "inherit", "initial", "unset", "revert", "revert-layer", "left", "right",
                   "top", "center", "bottom" ];
  for (prop of ["object-position", "perspective-origin"]) {
    var values = InspectorUtils.getCSSValuesForProperty(prop);
    ok(testValues(values, expected), "property " + prop + "'s values");
  }

  // Regression test for bug 1255378.
  var expected = [ "inherit", "initial", "unset", "revert", "revert-layer", "none", ...allColors ];
  var values = InspectorUtils.getCSSValuesForProperty("text-shadow");
  ok(testValues(values, expected), "property text-shadow's values");

  var expected = [ "inherit", "initial", "unset", "revert", "revert-layer", "inset", "none", ...allColors ];
  var values = InspectorUtils.getCSSValuesForProperty("box-shadow");
  ok(testValues(values, expected), "property box-shadow's values");

  // Regression test for bug 1255379.
  var shapeFunction = [ "close", "evenodd", "nonzero", "by", "to", "cw", "ccw",
                        "small", "large" ];
  var expected = [ "inherit", "initial", "unset", "revert", "revert-layer",
                   "none", "url", "polygon", "circle", "ellipse", "inset",
                   "path", "rect", "xywh", "fill-box", "stroke-box",
                   "view-box", "margin-box", "border-box", "padding-box",
                   "content-box", ...shapeFunction ];
  var values = InspectorUtils.getCSSValuesForProperty("clip-path");
  ok(testValues(values, expected), "property clip-path's values");

  var expected = [ "inherit", "initial", "unset", "revert", "revert-layer", "auto", "rect" ];
  var values = InspectorUtils.getCSSValuesForProperty("clip");
  ok(testValues(values, expected), "property clip's values");

  // Regression test for bug 1255380.
  var expected = [ "normal", "none", "counter", "counters",
                   "attr", "open-quote", "close-quote", "no-open-quote",
                   "no-close-quote", "inherit", "initial", "unset", "revert",
                   "revert-layer", "-moz-alt-content", "-moz-label-content", "image-set", "url", "-moz-element" ]
    .concat(allGradients);
  var values = InspectorUtils.getCSSValuesForProperty("content");
  ok(testValues(values, expected), "property content's values");

  // Regression test for bug 1255369.
  var expected = ["none", "decimal", "decimal-leading-zero", "arabic-indic", "armenian",
                  "upper-armenian", "lower-armenian", "bengali", "cambodian", "khmer",
                  "cjk-decimal", "devanagari", "georgian", "gujarati", "gurmukhi", "hebrew",
                  "kannada", "lao", "malayalam", "mongolian", "myanmar", "oriya", "persian",
                  "lower-roman", "upper-roman", "tamil", "telugu", "thai", "tibetan",
                  "lower-alpha", "lower-latin", "upper-alpha", "upper-latin",
                  "cjk-earthly-branch", "cjk-heavenly-stem", "lower-greek",
                  "hiragana", "hiragana-iroha", "katakana", "katakana-iroha",
                  "disc", "circle", "square", "disclosure-open", "disclosure-closed",
                  "japanese-informal", "japanese-formal",
                  "korean-hangul-formal", "korean-hanja-informal", "korean-hanja-formal",
                  "simp-chinese-informal", "simp-chinese-formal",
                  "trad-chinese-informal", "trad-chinese-formal", "cjk-ideographic",
                  "ethiopic-numeric", "symbols", "inherit", "initial", "unset", "revert", "revert-layer" ];
  var values = InspectorUtils.getCSSValuesForProperty("list-style-type");
  ok(testValues(values, expected), "property list-style-type's values");

  // Regression test for bug 1696677.
  var values = InspectorUtils.getCSSValuesForProperty("cursor");
  ok(values.includes("url"), "property cursor values include url");
  ok(values.includes("image-set"), "property cursor values include image-set");

  // Test for bug 1935181.
  var values = InspectorUtils.getCSSValuesForProperty("align-items");
  var expected = [
    "baseline",
    "center",
    "end",
    "first baseline",
    "flex-end",
    "flex-start",
    "inherit",
    "initial",
    "last baseline",
    "normal",
    "revert",
    "revert-layer",
    "safe",
    "self-end",
    "self-start",
    "start",
    "stretch",
    "unsafe",
    "unset"
  ];

  if(SpecialPowers.getBoolPref("layout.css.anchor-positioning.enabled")) {
    expected.push("anchor-center");
  }

  ok(testValues(values, expected), "property align-items values.");

  SimpleTest.finish();
}

SimpleTest.waitForExplicitFinish();
addLoadEvent(do_test);

</script>
</head>
<body>
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=877690">Mozilla Bug 877690</a>
<p id="display"></p>
<div id="content" style="display: none">
</div>
<pre id="test">
</pre>
</body>
</html>

Messung V0.5

Impressum test_bug877690.html Interaktion und Portierbarkeitunbekannt

[ 0.30Quellennavigators Projekt ]

Impressum test_bug877690.html Interaktion und
Portierbarkeitunbekannt