[tbb-commits] [torbutton] branch main updated: Bug 41410: Fix circuit display sizing hack for opening sub-menus.

[gitolite role]

This is an automated email from the git hooks/post-receive script.

pierov pushed a commit to branch main
in repository torbutton.

The following commit(s) were added to refs/heads/main by this push:
     new 362c914b Bug 41410: Fix circuit display sizing hack for opening sub-menus.
362c914b is described below

commit 362c914b5630b30e9608a218880bffa3664693f4
Author: Henry Wilkes <henry at torproject.org>
AuthorDate: Tue Nov 1 12:10:00 2022 +0000

    Bug 41410: Fix circuit display sizing hack for opening sub-menus.
    
    We only apply our hack on popupshowing and popuphiding if the event
    target matches the panel popup.
    
    We also add a FIXME note since the sizing hack is fragile.
    
    We also use the "hidden" attribute to hide the circuit instead of
    setting the inline "display" style.
---
 chrome/content/tor-circuit-display.js | 27 ++++++++++++++++++---------
 chrome/skin/tor-circuit-display.css   |  6 +-----
 2 files changed, 19 insertions(+), 14 deletions(-)

diff --git a/chrome/content/tor-circuit-display.js b/chrome/content/tor-circuit-display.js
index e4b5ceea..76fb7454 100644
--- a/chrome/content/tor-circuit-display.js
+++ b/chrome/content/tor-circuit-display.js
@@ -266,9 +266,7 @@ let createTorCircuitDisplay = (function() {
   // __showCircuitDisplay(show)__.
   // If show === true, makes the circuit display visible.
   let showCircuitDisplay = function(show) {
-    document.getElementById("circuit-display-container").style.display = show
-      ? "block"
-      : "none";
+    document.getElementById("circuit-display-container").hidden = !show;
   };
 
   // __xmlTree(ns, data)__.
@@ -404,8 +402,8 @@ let createTorCircuitDisplay = (function() {
       ]);
 
       // Hide the note about guards if we are using a bridge.
-      document.getElementById("circuit-guard-note-container").style.display =
-        nodeData[0].type === "bridge" ? "none" : "block";
+      document.getElementById("circuit-guard-note-container").hidden =
+        nodeData[0].type === "bridge";
     } else {
       // Only show the Tor circuit if we have credentials and node data.
       logger.eclog(4, "no SOCKS credentials found for current document.");
@@ -473,7 +471,16 @@ let createTorCircuitDisplay = (function() {
   // __ensureCorrectPopupDimensions()__.
   // Make sure the identity popup always displays with the correct height.
   let ensureCorrectPopupDimensions = function() {
-    let setDimensions = () => {
+    // FIXME: This is hacking with the internals of the panel view, which also
+    // sets the width and height for transitions (see PanelMultiView.jsm), so
+    // this fix is fragile.
+    // Ideally the panel view would start using a non-XUL CSS layout, which
+    // would work regardless of the content.
+    let popupMenu = document.getElementById("identity-popup");
+    let setDimensions = event => {
+      if (event.target !== popupMenu) {
+        return;
+      }
       setTimeout(() => {
         let view = document.querySelector(
           "#identity-popup-multiView .panel-viewcontainer"
@@ -492,9 +499,12 @@ let createTorCircuitDisplay = (function() {
           view.setAttribute("width", newWidth);
           view.setAttribute("height", newHeight);
         }
-      }, 0);
+      });
     };
-    let removeDimensions = () => {
+    let removeDimensions = event => {
+      if (event.target !== popupMenu) {
+        return;
+      }
       let view = document.querySelector(
         "#identity-popup-multiView .panel-viewcontainer"
       );
@@ -509,7 +519,6 @@ let createTorCircuitDisplay = (function() {
         view2.style.minWidth = view2.style.maxWidth = "";
       }
     };
-    let popupMenu = document.getElementById("identity-popup");
     popupMenu.addEventListener("popupshowing", setDimensions);
     popupMenu.addEventListener("popuphiding", removeDimensions);
     return () => {
diff --git a/chrome/skin/tor-circuit-display.css b/chrome/skin/tor-circuit-display.css
index c1dfcf79..4f03b882 100644
--- a/chrome/skin/tor-circuit-display.css
+++ b/chrome/skin/tor-circuit-display.css
@@ -53,7 +53,7 @@ and lines drawn between them to represent Tor network inter-relay connections.
   margin-bottom: 8px;
 }
 
-#circuit-display-content > hbox {
+#circuit-display-content > hbox:not([hidden]) {
   display: flex;
 }
 
@@ -140,10 +140,6 @@ ul#circuit-display-nodes li:last-child {
   background-color: var(--button-primary-active-bgcolor);
 }
 
-#circuit-guard-note-container {
-
-}
-
 #circuit-guard-note-container div {
   margin-inline-start: 8px;
 }

-- 
To stop receiving notification emails like this one, please contact
the administrator of this repository.