tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

browser_rules_edit-property-order.js (3676B)

      1 /* Any copyright is dedicated to the Public Domain.
      2 http://creativecommons.org/publicdomain/zero/1.0/ */
      3 
      4 "use strict";
      5 
      6 // Checking properties orders and overrides in the rule-view.
      7 
      8 const TEST_URI = "<style>#testid {}</style><div id='testid'>Styled Node</div>";
      9 
     10 add_task(async function () {
     11  await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
     12  const { inspector, view } = await openRuleView();
     13  await selectNode("#testid", inspector);
     14 
     15  const elementStyle = view._elementStyle;
     16  const elementRule = elementStyle.rules[1];
     17 
     18  info("Checking rules insertion order and checking the applied style");
     19  const firstProp = await addProperty(view, 1, "background-color", "green");
     20  let secondProp = await addProperty(view, 1, "background-color", "blue");
     21 
     22  is(elementRule.textProps[0], firstProp, "Rules should be in addition order.");
     23  is(
     24    elementRule.textProps[1],
     25    secondProp,
     26    "Rules should be in addition order."
     27  );
     28 
     29  // rgb(0, 0, 255) = blue
     30  is(
     31    await getValue("#testid", "background-color"),
     32    "rgb(0, 0, 255)",
     33    "Second property should have been used."
     34  );
     35 
     36  info("Removing the second property and checking the applied style again");
     37  await removeProperty(view, secondProp);
     38  // rgb(0, 128, 0) = green
     39  is(
     40    await getValue("#testid", "background-color"),
     41    "rgb(0, 128, 0)",
     42    "After deleting second property, first should be used."
     43  );
     44 
     45  info(
     46    "Creating a new second property and checking that the insertion order " +
     47      "is still the same"
     48  );
     49 
     50  secondProp = await addProperty(view, 1, "background-color", "blue");
     51 
     52  is(
     53    await getValue("#testid", "background-color"),
     54    "rgb(0, 0, 255)",
     55    "New property should be used."
     56  );
     57  is(
     58    elementRule.textProps[0],
     59    firstProp,
     60    "Rules shouldn't have switched places."
     61  );
     62  is(
     63    elementRule.textProps[1],
     64    secondProp,
     65    "Rules shouldn't have switched places."
     66  );
     67 
     68  info("Disabling the second property and checking the applied style");
     69  await togglePropStatus(view, secondProp);
     70 
     71  is(
     72    await getValue("#testid", "background-color"),
     73    "rgb(0, 128, 0)",
     74    "After disabling second property, first value should be used"
     75  );
     76 
     77  info("Disabling the first property too and checking the applied style");
     78  await togglePropStatus(view, firstProp);
     79 
     80  is(
     81    await getValue("#testid", "background-color"),
     82    "rgba(0, 0, 0, 0)",
     83    "After disabling both properties, value should be empty."
     84  );
     85 
     86  info("Re-enabling the second propertyt and checking the applied style");
     87  await togglePropStatus(view, secondProp);
     88 
     89  is(
     90    await getValue("#testid", "background-color"),
     91    "rgb(0, 0, 255)",
     92    "Value should be set correctly after re-enabling"
     93  );
     94 
     95  info(
     96    "Re-enabling the first property and checking the insertion order " +
     97      "is still respected"
     98  );
     99  await togglePropStatus(view, firstProp);
    100 
    101  is(
    102    await getValue("#testid", "background-color"),
    103    "rgb(0, 0, 255)",
    104    "Re-enabling an earlier property shouldn't make it override " +
    105      "a later property."
    106  );
    107  is(
    108    elementRule.textProps[0],
    109    firstProp,
    110    "Rules shouldn't have switched places."
    111  );
    112  is(
    113    elementRule.textProps[1],
    114    secondProp,
    115    "Rules shouldn't have switched places."
    116  );
    117  info("Modifying the first property and checking the applied style");
    118  await setProperty(view, firstProp, "purple");
    119 
    120  is(
    121    await getValue("#testid", "background-color"),
    122    "rgb(0, 0, 255)",
    123    "Modifying an earlier property shouldn't override a later property."
    124  );
    125 });
    126 
    127 async function getValue(selector, propName) {
    128  const value = await getComputedStyleProperty(selector, null, propName);
    129  return value;
    130 }