tor-browser

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

bug1729861.js (2741B)

      1 // # Bug 1729861
      2 
      3 // Expected values. Format: [name, pref_off_value, pref_on_value]
      4 var expected_values = [
      5  [
      6    "device-aspect-ratio",
      7    screen.width + "/" + screen.height,
      8    window.innerWidth + "/" + window.innerHeight,
      9  ],
     10  ["device-height", screen.height + "px", window.innerHeight + "px"],
     11  ["device-width", screen.width + "px", window.innerWidth + "px"],
     12 ];
     13 
     14 // Create a line containing a CSS media query and a rule to set the bg color.
     15 var mediaQueryCSSLine = function (key, val, color) {
     16  return (
     17    "@media (" +
     18    key +
     19    ": " +
     20    val +
     21    ") { #" +
     22    key +
     23    " { background-color: " +
     24    color +
     25    "; } }\n"
     26  );
     27 };
     28 
     29 var green = "rgb(0, 128, 0)";
     30 var blue = "rgb(0, 0, 255)";
     31 
     32 // Set a pref value asynchronously, returning a promise that resolves
     33 // when it succeeds.
     34 var pushPref = function (key, value) {
     35  return SpecialPowers.pushPrefEnv({ set: [[key, value]] });
     36 };
     37 
     38 // Set the resistFingerprinting pref to the given value, and then check that the background
     39 // color has been updated properly as a result of re-evaluating the media queries.
     40 var checkColorForPref = async function (setting, testDivs, expectedColor) {
     41  await pushPref("privacy.resistFingerprinting", setting);
     42  for (let div of testDivs) {
     43    let color = window.getComputedStyle(div).backgroundColor;
     44    is(color, expectedColor, "background for '" + div.id + "' is " + color);
     45  }
     46 };
     47 
     48 var test = async function () {
     49  // If the "off" and "on" expected values are the same, we can't actually
     50  // test anything here. (Might this be the case on mobile?)
     51  let skipTest = false;
     52  for (let [key, offVal, onVal] of expected_values) {
     53    if (offVal == onVal) {
     54      todo(false, "Unable to test because '" + key + "' is invariant");
     55      return;
     56    }
     57  }
     58 
     59  let css =
     60    ".test { margin: 1em; padding: 1em; color: white; width: max-content; font: 2em monospace }\n";
     61 
     62  // Create a test element for each of the media queries we're checking, and append the matching
     63  // "on" and "off" media queries to the CSS.
     64  let testDivs = [];
     65  for (let [key, offVal, onVal] of expected_values) {
     66    let div = document.createElement("div");
     67    div.textContent = key;
     68    div.setAttribute("class", "test");
     69    div.setAttribute("id", key);
     70    testDivs.push(div);
     71    document.getElementById("display").appendChild(div);
     72    css += mediaQueryCSSLine(key, onVal, "green");
     73    css += mediaQueryCSSLine(key, offVal, "blue");
     74  }
     75  document.getElementById("test-css").textContent = css;
     76 
     77  // Check that the test elements change color as expected when we flip the resistFingerprinting pref.
     78  await checkColorForPref(true, testDivs, green);
     79  await checkColorForPref(false, testDivs, blue);
     80  await checkColorForPref(true, testDivs, green);
     81 };