Make URLs breakable

See issue #1604

Author: JakeStoeffler

src/search/FindInFiles.js

@@ -215,7 +215,7 @@ define(function (require, exports, module) {
 
                     // Add row for file name
                     $("<tr class='file-section' />")
-                        .append("<td colspan='3'>" + StringUtils.format(Strings.FIND_IN_FILES_FILE_PATH, item.fullPath) + "</td>")
+                        .append("<td colspan='3'>" + StringUtils.format(Strings.FIND_IN_FILES_FILE_PATH, StringUtils.breakableUrl(item.fullPath)) + "</td>")
                         .click(function () {
                             // Clicking file section header collapses/expands result rows for that file
                             var $fileHeader = $(this);

src/search/QuickOpen.js

@@ -569,7 +569,7 @@ define(function (require, exports, module) {
         // Use the filename formatter
         query = StringUtils.htmlEscape(query);
         var displayName = StringUtils.htmlEscape(item.label);
-        var displayPath = StringUtils.htmlEscape(ProjectManager.makeProjectRelativeIfPossible(item.fullPath));
+        var displayPath = StringUtils.breakableUrl(StringUtils.htmlEscape(ProjectManager.makeProjectRelativeIfPossible(item.fullPath)));
 
         if (query.length > 0) {
             // make the user's query bold within the item's text

src/utils/StringUtils.js

@@ -140,6 +140,19 @@ define(function (require, exports, module) {
             return (a2 > b2) ? 1 : -1;
         }
     }
+    
+    /**
+     * Return a path or URL string that can be broken near path separators.
+     * @param {string} url the path or URL to format
+     * @return {string} the formatted path or URL
+     */
+    function breakableUrl(url) {
+        // Inject zero-width space character (U+200B) near path separators (/) to allow line breaking there
+        return url.replace(
+            new RegExp(regexEscape("/"), "g"),
+            "/" + "​"
+        );
+    }
 
     // Define public API
     exports.format          = format;
@@ -149,4 +162,5 @@ define(function (require, exports, module) {
     exports.getLines        = getLines;
     exports.offsetToLineNum = offsetToLineNum;
     exports.urlSort         = urlSort;
+    exports.breakableUrl    = breakableUrl;
 });