Bug 1579819 - Limit Search panel tooltips. r=Honza.
authorlloan <lloanalas@outlook.com>
Tue, 08 Oct 2019 07:33:34 +0000
changeset 496727 bc463ab0ad8a6a845101aac7bfcd8023d1265cc7
parent 496726 0409aaf10a058959f1bcf9874fd8ea11ea63eafc
child 496728 42de2e88ff5508db6c7e929862dca28cf09dbd63
push id97394
push userjodvarko@mozilla.com
push dateTue, 08 Oct 2019 07:34:11 +0000
treeherderautoland@bc463ab0ad8a [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersHonza
bugs1579819
milestone71.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1579819 - Limit Search panel tooltips. r=Honza. Differential Revision: https://phabricator.services.mozilla.com/D47516
devtools/client/netmonitor/src/components/search/SearchPanel.js
--- a/devtools/client/netmonitor/src/components/search/SearchPanel.js
+++ b/devtools/client/netmonitor/src/components/search/SearchPanel.js
@@ -92,17 +92,17 @@ class SearchPanel extends Component {
         this.renderValue(props)
       );
     };
 
     return LabelCell({
       ...props,
       title:
         member.level == 1
-          ? this.provider.getValue(member.object)
+          ? this.getTooltip(member.object)
           : this.provider.getResourceTooltipLabel(member.object),
       renderSuffix,
     });
   }
 
   renderTree() {
     const { results } = this.props;
     return TreeView({
@@ -154,45 +154,56 @@ class SearchPanel extends Component {
             ),
           ];
 
           indexStart = match;
 
           return highlightedMatch;
         });
 
-        return span({ title: object.value }, allMatches);
+        return span({ title: this.getTooltip(object) }, allMatches);
       }
 
       const indexStart = caseSensitive
         ? object.value.indexOf(query)
         : object.value.toLowerCase().indexOf(query.toLowerCase());
       const indexEnd = indexStart + query.length;
 
       // Handles a match in a string
       if (indexStart >= 0) {
         return span(
-          { title: object.value },
+          { title: this.getTooltip(object) },
           span({}, object.value.substring(0, indexStart)),
           span(
             { className: "query-match" },
             object.value.substring(indexStart, indexStart + query.length)
           ),
           span({}, object.value.substring(indexEnd, object.value.length))
         );
       }
 
       // Default for key:value matches where query might not
       // be present in the value, but found in the key.
-      return span({ title: object.value }, span({}, object.value));
+      return span({ title: this.getTooltip(object) }, span({}, object.value));
     }
 
     return this.provider.getValue(member.object);
   }
 
+  /**
+   * Returns first 1024 characters of value for use as a tooltip.
+   * @param object
+   * @returns {*}
+   */
+  getTooltip(object) {
+    return object.value.length > 1024
+      ? object.value.substring(0, 1024) + "…"
+      : object.value;
+  }
+
   render() {
     const {
       openSearch,
       closeSearch,
       clearSearchResults,
       connector,
       addSearchQuery,
       search,