Richard Pospesel pushed to branch tor-browser-102.6.0esr-12.5-1 at The Tor Project / Applications / Tor Browser

Commits:

5 changed files:

Changes:

  • browser/components/preferences/privacy.js
    ... ... @@ -341,11 +341,9 @@ var gPrivacyPane = {
    341 341 
        */
    342 342 
       _initSecurityLevel() {
    343 343 
         SecurityLevelPreferences.init();
    344 
    -    let unload = () => {
    345 
    -      window.removeEventListener("unload", unload);
    346 
    -      SecurityLevelPreferences.uninit();
    347 
    -    };
    348 
    -    window.addEventListener("unload", unload);
    344 
    +    window.addEventListener("unload", () => SecurityLevelPreferences.uninit(), {
    345 
    +      once: true,
    346 
    +    });
    349 347 
       },
    350 348
    351 349 
       /**

  • browser/components/securitylevel/content/securityLevel.js
    ... ... @@ -17,13 +17,14 @@ XPCOMUtils.defineLazyGetter(this, "SecurityLevelStrings", () => {
    17 17 
         security_level_restore: "Restore Defaults",
    18 18 
         security_level_learn_more: "Learn more",
    19 19 
         // Panel
    20 
    -    security_level_change: "Change…",
    20 
    +    security_level_change_setting: "Change Setting…",
    21 21 
         security_level_standard_summary:
    22 22 
           "All browser and website features are enabled.",
    23 23 
         security_level_safer_summary:
    24 24 
           "Disables website features that are often dangerous, causing some sites to lose functionality.",
    25 25 
         security_level_safest_summary:
    26 26 
           "Only allows website features required for static sites and basic services. These changes affect images, media, and scripts.",
    27 
    +    security_level_custom_heading: "Warning!",
    27 28 
         security_level_custom_summary:
    28 29 
           "Your custom browser preferences have resulted in unusual security settings. For security and privacy reasons, we recommend you choose one of the default security levels.",
    29 30 
         // Security level section in about:preferences#privacy
    ... ... @@ -259,7 +260,7 @@ var SecurityLevelPanel = {
    259 260 
         this._elements.restoreDefaultsButton.textContent =
    260 261 
           SecurityLevelStrings.security_level_restore;
    261 262 
         this._elements.settingsButton.textContent =
    262 
    -      SecurityLevelStrings.security_level_change;
    263 
    +      SecurityLevelStrings.security_level_change_setting;
    263 264
    264 265 
         this._elements.restoreDefaultsButton.addEventListener("command", () => {
    265 266 
           this.restoreDefaults();
    ... ... @@ -367,120 +368,112 @@ var SecurityLevelPanel = {
    367 368
    368 369 
     var SecurityLevelPreferences = {
    369 370 
       _securityPrefsBranch: null,
    371 
    +  /**
    372 
    +   * The notification box shown when the user has a custom security setting.
    373 
    +   *
    374 
    +   * @type {Element}
    375 
    +   */
    376 
    +  _customNotification: null,
    377 
    +  /**
    378 
    +   * The radiogroup for this preference.
    379 
    +   *
    380 
    +   * @type {Element}
    381 
    +   */
    382 
    +  _radiogroup: null,
    383 
    +  /**
    384 
    +   * A list of radio options and their containers.
    385 
    +   *
    386 
    +   * @type {Array<Object>}
    387 
    +   */
    388 
    +  _radioOptions: null,
    370 389
    371 390 
       _populateXUL() {
    372 
    -    const groupbox = document.querySelector("#securityLevel-groupbox");
    373 
    -    const radiogroup = groupbox.querySelector("#securityLevel-radiogroup");
    374 
    -    radiogroup.addEventListener(
    375 
    -      "command",
    376 
    -      SecurityLevelPreferences.selectSecurityLevel
    391 
    +    this._customNotification = document.getElementById(
    392 
    +      "securityLevel-customNotification"
    377 393 
         );
    394 
    +    this._radiogroup = document.getElementById("securityLevel-radiogroup");
    378 395
    379 
    -    groupbox.querySelector("h2").textContent =
    396 
    +    document.querySelector("#securityLevel-groupbox h2").textContent =
    380 397 
           SecurityLevelStrings.security_level;
    381 
    -    groupbox.querySelector("#securityLevel-overview").textContent =
    398 
    +    document.getElementById("securityLevel-overview").textContent =
    382 399 
           SecurityLevelStrings.security_level_overview;
    383 
    -    groupbox
    384 
    -      .querySelector("#securityLevel-learnMore")
    400 
    +    document
    401 
    +      .getElementById("securityLevel-learnMore")
    385 402 
           .setAttribute("value", SecurityLevelStrings.security_level_learn_more);
    386 403
    387 
    -    const populateRadioElements = (level, descr) => {
    388 
    -      const vbox = groupbox.querySelector(`#securityLevel-vbox-${level}`);
    389 
    -      vbox
    390 
    -        .querySelector("radio")
    391 
    -        .setAttribute("label", SecurityLevelStrings[`security_level_${level}`]);
    392 
    -      vbox
    393 
    -        .querySelector(".securityLevel-customWarning")
    394 
    -        .setAttribute("value", SecurityLevelStrings.security_level_custom);
    395 
    -      vbox.querySelector(".summary").textContent =
    396 
    -        SecurityLevelStrings[`security_level_${level}_summary`];
    397 
    -      const labelRestoreDefaults = vbox.querySelector(
    398 
    -        ".securityLevel-restoreDefaults"
    399 
    -      );
    400 
    -      labelRestoreDefaults.setAttribute(
    401 
    -        "value",
    402 
    -        SecurityLevelStrings.security_level_restore
    404 
    +    document.getElementById("securityLevel-customHeading").textContent =
    405 
    +      SecurityLevelStrings.security_level_custom_heading;
    406 
    +    document.getElementById("securityLevel-customDescription").textContent =
    407 
    +      SecurityLevelStrings.security_level_custom_summary;
    408 
    +    const restoreDefaultsButton = document.getElementById(
    409 
    +      "securityLevel-restoreDefaults"
    410 
    +    );
    411 
    +    restoreDefaultsButton.textContent =
    412 
    +      SecurityLevelStrings.security_level_restore;
    413 
    +
    414 
    +    this._radioOptions = Array.from(
    415 
    +      this._radiogroup.querySelectorAll(".securityLevel-radio-option"),
    416 
    +      container => {
    417 
    +        return { container, radio: container.querySelector("radio") };
    418 
    +      }
    419 
    +    );
    420 
    +    const descListItemsMap = {
    421 
    +      safer: [
    422 
    +        SecurityLevelStrings.security_level_js_https_only,
    423 
    +        SecurityLevelStrings.security_level_limit_typography,
    424 
    +        SecurityLevelStrings.security_level_limit_media,
    425 
    +      ],
    426 
    +      safest: [
    427 
    +        SecurityLevelStrings.security_level_js_disabled,
    428 
    +        SecurityLevelStrings.security_level_limit_typography_svg,
    429 
    +        SecurityLevelStrings.security_level_limit_media,
    430 
    +      ],
    431 
    +    };
    432 
    +    for (const { container, radio } of this._radioOptions) {
    433 
    +      const level = radio.value;
    434 
    +      radio.setAttribute(
    435 
    +        "label",
    436 
    +        SecurityLevelStrings[`security_level_${level}`]
    403 437 
           );
    404 
    -      labelRestoreDefaults.addEventListener(
    405 
    -        "click",
    406 
    -        SecurityLevelStrings.restoreDefaults
    438 
    +      container.querySelector(".summary").textContent =
    439 
    +        SecurityLevelStrings[`security_level_${level}_summary`];
    440 
    +      const descListItems = descListItemsMap[level];
    441 
    +      if (!descListItems) {
    442 
    +        continue;
    443 
    +      }
    444 
    +      const descrList = container.querySelector(
    445 
    +        ".securityLevel-descriptionList"
    407 446 
           );
    408 
    -      if (descr) {
    409 
    -        const descrList = vbox.querySelector(".securityLevel-descriptionList");
    410 
    -        // TODO: Add the elements in securityLevelPreferences.inc.xhtml again
    411 
    -        // when we switch to Fluent
    412 
    -        for (const text of descr) {
    413 
    -          let elem = document.createXULElement("description");
    414 
    -          elem.textContent = text;
    415 
    -          elem.className = "indent";
    416 
    -          descrList.append(elem);
    417 
    -        }
    447 
    +      // TODO: Add the elements in securityLevelPreferences.inc.xhtml again
    448 
    +      // when we switch to Fluent
    449 
    +      for (const text of descListItems) {
    450 
    +        let elem = document.createXULElement("description");
    451 
    +        elem.textContent = text;
    452 
    +        elem.className = "indent";
    453 
    +        descrList.append(elem);
    418 454 
           }
    419 
    -    };
    420 
    -    populateRadioElements("standard");
    421 
    -    populateRadioElements("safer", [
    422 
    -      SecurityLevelStrings.security_level_js_https_only,
    423 
    -      SecurityLevelStrings.security_level_limit_typography,
    424 
    -      SecurityLevelStrings.security_level_limit_media,
    425 
    -    ]);
    426 
    -    populateRadioElements("safest", [
    427 
    -      SecurityLevelStrings.security_level_js_disabled,
    428 
    -      SecurityLevelStrings.security_level_limit_typography_svg,
    429 
    -      SecurityLevelStrings.security_level_limit_media,
    430 
    -    ]);
    455 
    +    }
    456 
    +
    457 
    +    restoreDefaultsButton.addEventListener("command", () => {
    458 
    +      SecurityLevelPrefs.securityCustom = false;
    459 
    +    });
    460 
    +    this._radiogroup.addEventListener("select", () => {
    461 
    +      SecurityLevelPrefs.securityLevel = this._radiogroup.value;
    462 
    +    });
    431 463 
       },
    432 464
    433 465 
       _configUIFromPrefs() {
    434 
    -    // read our prefs
    435 
    -    const securityLevel = SecurityLevelPrefs.securityLevel;
    436 
    -    const securityCustom = SecurityLevelPrefs.securityCustom;
    437 
    -
    438 
    -    // get our elements
    439 
    -    const groupbox = document.querySelector("#securityLevel-groupbox");
    440 
    -    let radiogroup = groupbox.querySelector("#securityLevel-radiogroup");
    441 
    -    let labelStandardCustom = groupbox.querySelector(
    442 
    -      "#securityLevel-vbox-standard label.securityLevel-customWarning"
    443 
    -    );
    444 
    -    let labelSaferCustom = groupbox.querySelector(
    445 
    -      "#securityLevel-vbox-safer label.securityLevel-customWarning"
    446 
    -    );
    447 
    -    let labelSafestCustom = groupbox.querySelector(
    448 
    -      "#securityLevel-vbox-safest label.securityLevel-customWarning"
    449 
    -    );
    450 
    -    let labelStandardRestoreDefaults = groupbox.querySelector(
    451 
    -      "#securityLevel-vbox-standard label.securityLevel-restoreDefaults"
    452 
    -    );
    453 
    -    let labelSaferRestoreDefaults = groupbox.querySelector(
    454 
    -      "#securityLevel-vbox-safer label.securityLevel-restoreDefaults"
    455 
    -    );
    456 
    -    let labelSafestRestoreDefaults = groupbox.querySelector(
    457 
    -      "#securityLevel-vbox-safest label.securityLevel-restoreDefaults"
    458 
    -    );
    459 
    -
    460 
    -    // hide custom label by default until we know which level we're at
    461 
    -    labelStandardCustom.hidden = true;
    462 
    -    labelSaferCustom.hidden = true;
    463 
    -    labelSafestCustom.hidden = true;
    464 
    -
    465 
    -    labelStandardRestoreDefaults.hidden = true;
    466 
    -    labelSaferRestoreDefaults.hidden = true;
    467 
    -    labelSafestRestoreDefaults.hidden = true;
    468 
    -
    469 
    -    radiogroup.value = securityLevel;
    470 
    -
    471 
    -    switch (securityLevel) {
    472 
    -      case "standard":
    473 
    -        labelStandardCustom.hidden = !securityCustom;
    474 
    -        labelStandardRestoreDefaults.hidden = !securityCustom;
    475 
    -        break;
    476 
    -      case "safer":
    477 
    -        labelSaferCustom.hidden = !securityCustom;
    478 
    -        labelSaferRestoreDefaults.hidden = !securityCustom;
    479 
    -        break;
    480 
    -      case "safest":
    481 
    -        labelSafestCustom.hidden = !securityCustom;
    482 
    -        labelSafestRestoreDefaults.hidden = !securityCustom;
    483 
    -        break;
    466 
    +    this._radiogroup.value = SecurityLevelPrefs.securityLevel;
    467 
    +    const isCustom = SecurityLevelPrefs.securityCustom;
    468 
    +    this._radiogroup.disabled = isCustom;
    469 
    +    this._customNotification.hidden = !isCustom;
    470 
    +    // Have the container's selection CSS class match the selection state of the
    471 
    +    // radio elements.
    472 
    +    for (const { container, radio } of this._radioOptions) {
    473 
    +      container.classList.toggle(
    474 
    +        "securityLevel-radio-option-selected",
    475 
    +        radio.selected
    476 
    +      );
    484 477 
         }
    485 478 
       },
    486 479
    ... ... @@ -514,17 +507,4 @@ var SecurityLevelPreferences = {
    514 507 
             break;
    515 508 
         }
    516 509 
       },
    517 
    -
    518 
    -  selectSecurityLevel() {
    519 
    -    // radio group elements
    520 
    -    let radiogroup = document.getElementById("securityLevel-radiogroup");
    521 
    -
    522 
    -    // update pref based on selected radio option
    523 
    -    SecurityLevelPrefs.securityLevel = radiogroup.value;
    524 
    -    SecurityLevelPreferences.restoreDefaults();
    525 
    -  },
    526 
    -
    527 
    -  restoreDefaults() {
    528 
    -    SecurityLevelPrefs.securityCustom = false;
    529 
    -  },
    530 510 
     }; /* SecurityLevelPreferences */

  • browser/components/securitylevel/content/securityLevelPreferences.css
    1 
    -label.securityLevel-customWarning {
    2 
    -  border-radius: 4px;
    3 
    -  background-color: var(--yellow-50);
    4 
    -  color: black;
    5 
    -  font-size: 1em;
    6 
    -  height: 1.6em;
    7 
    -  padding: 0.4em 0.5em;
    1 
    +#securityLevel-groupbox {
    2 
    +  --section-highlight-background-color: color-mix(in srgb, var(--in-content-accent-color) 20%, transparent);
    3 
    +}
    4 
    +
    5 
    +#securityLevel-customNotification {
    6 
    +  /* Spacing similar to #fpiIncompatibilityWarning. */
    7 
    +  margin-block: 16px;
    8 
    +}
    9 
    +
    10 
    +.info-icon.securityLevel-custom-warning-icon {
    11 
    +  list-style-image: url("chrome://global/skin/icons/warning.svg");
    12 
    +}
    13 
    +
    14 
    +#securityLevel-customHeading {
    15 
    +  font-weight: bold;
    8 16 
     }
    9 17
    10 
    -radiogroup#securityLevel-radiogroup description {
    11 
    -  color: var(--in-content-page-color)!important;
    18 
    +/* Overwrite indent rule from preferences.css */
    19 
    +#securityLevel-radiogroup description.indent {
    20 
    +  color: var(--in-content-page-color);
    12 21 
     }
    13 22
    14 
    -radiogroup#securityLevel-radiogroup radio {
    23 
    +#securityLevel-radiogroup radio {
    15 24 
       font-weight: bold;
    16 25 
     }
    17 26
    18 
    -radiogroup#securityLevel-radiogroup > vbox {
    27 
    +#securityLevel-radiogroup[disabled] {
    28 
    +  opacity: 0.5;
    29 
    +}
    30 
    +
    31 
    +/* Overwrite the rule in common-shared.css so we don't get 0.25 opacity overall
    32 
    + * on the radio text. */
    33 
    +#securityLevel-radiogroup[disabled] radio[disabled] {
    34 
    +  opacity: 1.0;
    35 
    +}
    36 
    +
    37 
    +.securityLevel-radio-option {
    19 38 
       border: 1px solid var(--in-content-box-border-color);
    20 39 
       border-radius: 4px;
    21 40 
       margin: 3px 0;
    22 41 
       padding: 9px;
    23 42 
     }
    24 43
    25 
    -radiogroup#securityLevel-radiogroup[value=standard] > vbox#securityLevel-vbox-standard,
    26 
    -radiogroup#securityLevel-radiogroup[value=safer] > vbox#securityLevel-vbox-safer,
    27 
    -radiogroup#securityLevel-radiogroup[value=safest] > vbox#securityLevel-vbox-safest {
    28 
    -  --section-highlight-background-color: color-mix(in srgb, var(--in-content-accent-color) 20%, transparent);
    44 
    +.securityLevel-radio-option.securityLevel-radio-option-selected {
    29 45 
       background-color: var(--section-highlight-background-color);
    30 46 
       border: 1px solid var(--in-content-accent-color);
    31 47
    32 48 
     }
    33 49
    34 
    -vbox.securityLevel-descriptionList {
    50 
    +.securityLevel-radio-option:not(
    51 
    +  .securityLevel-radio-option-selected
    52 
    +) .securityLevel-descriptionList {
    35 53 
       display: none;
    36 54 
     }
    37 55
    38 
    -radiogroup#securityLevel-radiogroup[value=safer] vbox#securityLevel-vbox-safer vbox.securityLevel-descriptionList,
    39 
    -radiogroup#securityLevel-radiogroup[value=safest] vbox#securityLevel-vbox-safest vbox.securityLevel-descriptionList {
    40 
    -  display: inherit;
    41 
    -}
    42 
    -
    43 
    -vbox.securityLevel-descriptionList description {
    56 
    +.securityLevel-descriptionList description {
    44 57 
       display: list-item;
    45 58 
     }
    46 
    -
    47 
    -vbox#securityLevel-vbox-standard,
    48 
    -vbox#securityLevel-vbox-safer,
    49 
    -vbox#securityLevel-vbox-safest {
    50 
    -  margin-top: 0.4em;
    51 
    -}

  • browser/components/securitylevel/content/securityLevelPreferences.inc.xhtml
    ... ... @@ -2,62 +2,58 @@
    2 2 
               data-category="panePrivacy"
    3 3 
               data-subcategory="securitylevel"
    4 4 
               hidden="true">
    5 
    -  <label><html:h2/></label>
    5 
    +  <label><html:h2></html:h2></label>
    6 6 
       <vbox flex="1">
    7 7 
         <description flex="1">
    8 
    -      <html:span id="securityLevel-overview" class="tail-with-learn-more"/>
    8 
    +      <html:span id="securityLevel-overview" class="tail-with-learn-more">
    9 
    +      </html:span>
    9 10 
           <label id="securityLevel-learnMore"
    10 11 
                  class="learnMore text-link"
    11 12 
                  is="text-link"
    12 13 
                  href="about:manual#security-settings"
    13 14 
                  useoriginprincipal="true"/>
    14 15 
         </description>
    16 
    +    <hbox id="securityLevel-customNotification"
    17 
    +          class="info-box-container"
    18 
    +          flex="1">
    19 
    +      <hbox class="info-icon-container">
    20 
    +        <image class="info-icon securityLevel-custom-warning-icon"/>
    21 
    +      </hbox>
    22 
    +      <vbox flex="1">
    23 
    +        <label id="securityLevel-customHeading"/>
    24 
    +        <description id="securityLevel-customDescription" flex="1"/>
    25 
    +      </vbox>
    26 
    +      <hbox align="center">
    27 
    +        <button id="securityLevel-restoreDefaults"/>
    28 
    +      </hbox>
    29 
    +    </hbox>
    15 30 
         <radiogroup id="securityLevel-radiogroup">
    16 
    -      <vbox id="securityLevel-vbox-standard">
    17 
    -        <hbox>
    18 
    -          <radio value="standard"/>
    19 
    -          <vbox>
    20 
    -            <spacer flex="1"/>
    21 
    -            <label class="securityLevel-customWarning"/>
    22 
    -            <spacer flex="1"/>
    23 
    -          </vbox>
    24 
    -          <spacer flex="1"/>
    25 
    -        </hbox>
    26 
    -        <description flex="1" class="indent">
    27 
    -          <html:span class="summary tail-with-learn-more"/>
    28 
    -          <label class="securityLevel-restoreDefaults learnMore text-link"/>
    29 
    -        </description>
    31 
    +      <vbox class="securityLevel-radio-option">
    32 
    +        <radio value="standard"
    33 
    +               aria-describedby="securityLevelSummary-standard"/>
    34 
    +        <vbox id="securityLevelSummary-standard">
    35 
    +          <description class="summary indent" flex="1"/>
    36 
    +        </vbox>
    30 37 
           </vbox>
    31 
    -      <vbox id="securityLevel-vbox-safer">
    32 
    -        <hbox>
    33 
    -          <radio value="safer"/>
    34 
    -          <vbox>
    35 
    -            <spacer flex="1"/>
    36 
    -            <label class="securityLevel-customWarning"/>
    37 
    -            <spacer flex="1"/>
    38 
    -          </vbox>
    39 
    -        </hbox>
    40 
    -        <description flex="1" class="indent">
    41 
    -          <html:span class="summary tail-with-learn-more"/>
    42 
    -          <label class="securityLevel-restoreDefaults learnMore text-link"/>
    43 
    -        </description>
    44 
    -        <vbox class="securityLevel-descriptionList indent">
    38 
    +      <vbox class="securityLevel-radio-option">
    39 
    +        <!-- NOTE: We point the accessible description to the wrapping vbox
    40 
    +          - rather than its first description element. This means that when the
    41 
    +          - securityLevel-descriptionList is shown or hidden, its text content
    42 
    +          - is included or excluded from the accessible description,
    43 
    +          - respectively. -->
    44 
    +        <radio value="safer"
    45 
    +               aria-describedby="securityLevelSummary-safer"/>
    46 
    +        <vbox id="securityLevelSummary-safer">
    47 
    +          <description class="summary indent" flex="1"/>
    48 
    +          <vbox class="securityLevel-descriptionList indent"/>
    45 49 
             </vbox>
    46 50 
           </vbox>
    47 
    -      <vbox id="securityLevel-vbox-safest">
    48 
    -        <hbox>
    49 
    -          <radio value="safest"/>
    50 
    -          <vbox>
    51 
    -            <spacer flex="1"/>
    52 
    -            <label class="securityLevel-customWarning"/>
    53 
    -            <spacer flex="1"/>
    54 
    -          </vbox>
    55 
    -        </hbox>
    56 
    -        <description flex="1" class="indent">
    57 
    -          <html:span class="summary tail-with-learn-more"/>
    58 
    -          <label class="securityLevel-restoreDefaults learnMore text-link"/>
    59 
    -        </description>
    60 
    -        <vbox class="securityLevel-descriptionList indent">
    51 
    +      <vbox class="securityLevel-radio-option">
    52 
    +        <radio value="safest"
    53 
    +               aria-describedby="securityLevelSummary-safest"/>
    54 
    +        <vbox id="securityLevelSummary-safest">
    55 
    +          <description class="summary indent" flex="1"/>
    56 
    +          <vbox class="securityLevel-descriptionList indent"/>
    61 57 
             </vbox>
    62 58 
           </vbox>
    63 59 
         </radiogroup>

  • browser/components/securitylevel/locale/en-US/securityLevel.properties
    ... ... @@ -13,9 +13,11 @@ security_level_learn_more = Learn more
    13 13
    14 14 
     # Panel
    15 15 
     security_level_change = Change…
    16 
    +security_level_change_setting = Change Setting…
    16 17 
     security_level_standard_summary = All browser and website features are enabled.
    17 18 
     security_level_safer_summary = Disables website features that are often dangerous, causing some sites to lose functionality.
    18 19 
     security_level_safest_summary = Only allows website features required for static sites and basic services. These changes affect images, media, and scripts.
    20 
    +security_level_custom_heading = Warning!
    19 21 
     security_level_custom_summary = Your custom browser preferences have resulted in unusual security settings. For security and privacy reasons, we recommend you choose one of the default security levels.
    20 22
    21 23 
     ## Security level section in about:preferences#privacy

    • —
    View it on GitLab.
    You're receiving this email because of your account on gitlab.torproject.org. Manage all notifications · Help