DevTools: untruncate links on copy

third_party/WebKit/Source/devtools/front_end/components/Linkifier.js

 /*
  * Copyright (C) 2012 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 285 matching lines @@
    * @param {!Element} anchor
    * @param {!Bindings.LiveLocation} liveLocation
    */
   _updateAnchor(anchor, liveLocation) {
     Components.Linkifier._unbindUILocation(anchor);
     var uiLocation = liveLocation.uiLocation();
     if (!uiLocation)
       return;
 
     Components.Linkifier._bindUILocation(anchor, uiLocation);
-    var text = uiLocation.linkText();
-    var info = Components.Linkifier._linkInfo(anchor);
-    info.originalLinkText = text;
-    text = text.replace(/([a-f0-9]{7})[a-f0-9]{13}[a-f0-9]*/g, '$1\u2026');
-    if (this._maxLength)
-      text = text.trimMiddle(this._maxLength);
-    anchor.textContent = text;
+    var text = uiLocation.linkText(true /* skipTrim */);
+    Components.Linkifier._setTrimmedText(anchor, text, true /* trimHashes */, this._maxLength);
 
     var titleText = uiLocation.uiSourceCode.url();
     if (typeof uiLocation.lineNumber === 'number')
       titleText += ':' + (uiLocation.lineNumber + 1);
     anchor.title = titleText;
     anchor.classList.toggle('webkit-html-blackbox-link', liveLocation.isBlackboxed());
     Components.Linkifier._updateLinkDecorations(anchor);
   }
 
   /**
@@ skipping 66 matching lines @@
    * @param {boolean=} preventClick
    * @returns{!Element}
    */
   static _createLink(text, className, maxLength, title, href, preventClick) {
     var link = createElementWithClass('span', className);
     link.classList.add('devtools-link');
     if (title)
       link.title = title;
     if (href)
       link.href = href;
-    link.textContent = text;
-    if (maxLength)
-      link.textContent = link.textContent.trimMiddle(maxLength);
+    Components.Linkifier._setTrimmedText(link, text, false /* trimHashes */, maxLength);

[lushnikov, 2017/04/22 01:11:48]

can we always trim hashes?

[luoe, 2017/04/22 05:43:16]

I'm all for consistency!  Tried it out and it seems fine.

     link[Components.Linkifier._infoSymbol] = {
       icon: null,
       enableDecorator: false,
       uiLocation: null,
       liveLocation: null,
       url: href || null,
       lineNumber: null,
       columnNumber: null,
       revealable: null,
-      fallback: null,
-      originalLinkText: text
+      fallback: null
     };
     if (!preventClick)
       link.addEventListener('click', Components.Linkifier._handleClick, false);
     else
       link.classList.add('devtools-link-prevent-click');
     return link;
   }
 
   /**
-   * @param {?Element} link
-   * @return {?string}
+   * @param {!Element} link
+   * @param {string} text
+   * @param {boolean=} trimHashes
+   * @param {number=} maxLength
    */
-  static originalLinkText(link) {
-    var info = this._linkInfo(link);
-    return info ? info.originalLinkText : null;
+  static _setTrimmedText(link, text, trimHashes, maxLength) {
+    // Find the indices which define the hidden substring.
+    var hiddenIndices = [Math.floor(text.length / 2), Math.floor(text.length / 2)];
+    if (maxLength && text.length > maxLength) {
+      var maxLengthIndices = middleTruncatedIndices(text, maxLength);
+      hiddenIndices[0] = Math.min(hiddenIndices[0], maxLengthIndices[0]);
+      hiddenIndices[1] = Math.max(hiddenIndices[1], maxLengthIndices[1]);
+    }
+    if (trimHashes) {
+      var hashIndices = hashTruncatedIndices(text);
+      hiddenIndices[0] = Math.min(hiddenIndices[0], hashIndices[0]);
+      hiddenIndices[1] = Math.max(hiddenIndices[1], hashIndices[1]);

[lushnikov, 2017/04/22 01:11:48]

in case of:
1. text.length < maxLength
2. text has a cache-busting in the very end

this will truncate link from center up to the very end (where the hash is
located).

[luoe, 2017/04/22 05:43:16]

I see, so my "max/min from the center" approach does not work correctly.  The
new approach using splitByRegexes should address this.
I've added a test for the short url with hashes case.

+    }
+    var leftIndex = hiddenIndices[0];
+    var rightIndex = hiddenIndices[1];
+
+    if (leftIndex < rightIndex) {
+      link.removeChildren();
+      link.createTextChild(text.substr(0, leftIndex));

[lushnikov, 2017/04/22 01:11:48]

nit: text.substring(0, leftIndex)

we try to use substring to avoid confusion between substr and substring

[luoe, 2017/04/22 05:43:16]

Done.

+      var ellipsisNode = link.createChild('span', 'devtools-link-ellipsis').createTextChild('\u200B');
+      ellipsisNode[Components.Linkifier._untruncatedNodeTextSymbol] = text.substr(leftIndex, rightIndex - leftIndex);
+      link.createTextChild(text.substr(rightIndex, text.length - rightIndex));

[lushnikov, 2017/04/22 01:11:48]

nit: text.substring(rightIndex)

[luoe, 2017/04/22 05:43:16]

Done.

+    } else {
+      link.textContent = text;
+    }
+
+    /**
+     * @param {string} text
+     * @param {number} maxLength
+     * @return {!Array<number>}
+     */
+    function middleTruncatedIndices(text, maxLength) {
+      var leftIndex = Math.floor(maxLength / 2);
+      var rightIndex = text.length - Math.ceil(maxLength / 2) + 1;
+
+      // Do not truncate between characters that use multiple code points (emojis).
+      if (text.codePointAt(rightIndex - 1) >= 0x10000) {
+        rightIndex++;
+        leftIndex++;
+      }
+      if (leftIndex > 0 && text.codePointAt(leftIndex - 1) >= 0x10000)
+        leftIndex--;
+      return [leftIndex, rightIndex];
+    }
+
+    /**
+     * @param {string} text
+     * @return {!Array<number>}
+     */
+    function hashTruncatedIndices(text) {
+      var leftIndex = text.length;
+      var rightIndex = 0;
+      var hashRegex = /[a-f0-9]{20,}/g;
+      var match = hashRegex.exec(text);
+      while (match !== null) {
+        leftIndex = Math.min(leftIndex, match.index + 7);
+        rightIndex = Math.max(rightIndex, match.index + match[0].length);
+        match = hashRegex.exec(text);
+      }
+      return [leftIndex, rightIndex];
+    }
   }
 
   /**
+   * @param {!Node} node
+   * @return {string}
+   */
+  static untruncatedNodeText(node) {
+    return node[Components.Linkifier._untruncatedNodeTextSymbol] || node.textContent;
+  }
+
+  /**
    * @param {?Element} link
    * @return {?Components._LinkInfo}
    */
   static _linkInfo(link) {
     return /** @type {?Components._LinkInfo} */ (link ? link[Components.Linkifier._infoSymbol] || null : null);
   }
 
   /**
    * @param {!Event} event
    */
@@ skipping 101 matching lines @@
   }
 };
 
 /** @type {!Set<!Components.Linkifier>} */
 Components.Linkifier._instances = new Set();
 /** @type {?Components.LinkDecorator} */
 Components.Linkifier._decorator = null;
 
 Components.Linkifier._sourceCodeAnchors = Symbol('Linkifier.anchors');
 Components.Linkifier._infoSymbol = Symbol('Linkifier.info');
+Components.Linkifier._untruncatedNodeTextSymbol = Symbol('Linkifier.untruncatedNodeText');
 
 /**
  * @typedef {{
  *     icon: ?UI.Icon,
  *     enableDecorator: boolean,
  *     uiLocation: ?Workspace.UILocation,
  *     liveLocation: ?Bindings.LiveLocation,
  *     url: ?string,
  *     lineNumber: ?number,
  *     columnNumber: ?number,
  *     revealable: ?Object,
- *     fallback: ?Element,
- *     originalLinkText: string
+ *     fallback: ?Element
  * }}
  */
 Components._LinkInfo;
 
 /**
  * The maximum length before strings are considered too long for finding URLs.
  * @const
  * @type {number}
  */
 Components.Linkifier.MaxLengthToIgnoreLinkifier = 10000;
@@ skipping 205 matching lines @@
     contextMenu.appendSeparator();
     contextMenu.appendItem(Common.UIString('Save'), save.bind(null, false));
 
     if (contentProvider instanceof Workspace.UISourceCode) {
       var uiSourceCode = /** @type {!Workspace.UISourceCode} */ (contentProvider);
       if (!uiSourceCode.project().canSetFileContent())
         contextMenu.appendItem(Common.UIString.capitalize('Save ^as...'), save.bind(null, true));
     }
   }
 };