Bug 929502 - bugs with very long but unwrappable summaries cause the tables to overla...

diff --git a/Bugzilla/Template.pm b/Bugzilla/Template.pm
index fbff69bb3e6de6499220d64b267c864db8b081ec..7489bc5a0c71a2e5c707e44ade56dececa773f01 100644 (file)
--- a/Bugzilla/Template.pm
+++ b/Bugzilla/Template.pm
@@ -707,9 +707,11 @@ sub create {
       # * `test<wbr>_switch<wbr>_window<wbr>_content<wbr>.py`
       # * `Test<wbr>Switch<wbr>To<wbr>Window<wbr>Content`
       # * `<a href="https://www.mozilla.org/">mozilla<wbr>.org</a>`
+      # * `MOZILLA<wbr>_PKIX<wbr>_ERROR<wbr>_MITM<wbr>_DETECTED`
       wbr => sub {
         my ($var) = @_;
-        $var =~ s/([a-z])([A-Z\._])(?![^<]*>)/$1<wbr>$2/g;
+        $var =~ s/([a-z])([A-Z])(?![^<]*>)/$1<wbr>$2/g;
+        $var =~ s/([A-Za-z0-9])([\._])(?![^<]*>)/$1<wbr>$2/g;
         return $var;
       },
 

diff --git a/extensions/MyDashboard/web/js/query.js b/extensions/MyDashboard/web/js/query.js
index fe7a28a76635a50ccd6b2356f994ce8d8ede7f7e..1dd082bf38bbc073d94d8d2be69654086a91b344 100644 (file)
--- a/extensions/MyDashboard/web/js/query.js
+++ b/extensions/MyDashboard/web/js/query.js
@@ -149,7 +149,7 @@ $(function() {
 
         const link_formatter = ({ data, value }) =>
           `<a href="${BUGZILLA.config.basepath}show_bug.cgi?id=${data.bug_id}" target="_blank">
-          ${String(value).htmlEncode()}</a>`;
+          ${isNaN(value) ? value.htmlEncode().wbr() : value}</a>`;
 
         lastChangesQuery = new Y.DataSource.IO({ source: `${BUGZILLA.config.basepath}jsonrpc.cgi` });
 

diff --git a/js/global.js b/js/global.js
index 691229cafb80081c60601af4091e841859c1abad..11510043d4119ed99e57dd991224f7bd32520eac 100644 (file)
--- a/js/global.js
+++ b/js/global.js
@@ -210,6 +210,25 @@ if (!String.prototype.htmlEncode) {
     })();
 }
 
+// Insert `<wbr>` HTML tags to camel and snake case words as well as
+// words containing dots in the given string so a long bug summary,
+// for example, will be wrapped in a preferred manner rather than
+// overflowing or expanding the parent element. This conversion
+// should exclude existing HTML tags such as links. Examples:
+// * `test<wbr>_switch<wbr>_window<wbr>_content<wbr>.py`
+// * `Test<wbr>Switch<wbr>To<wbr>Window<wbr>Content`
+// * `<a href="https://www.mozilla.org/">mozilla<wbr>.org</a>`
+// * `MOZILLA<wbr>_PKIX<wbr>_ERROR<wbr>_MITM<wbr>_DETECTED`
+// This is the JavaScript version of `wbr` in Bugzilla/Template.pm.
+if (!String.prototype.wbr) {
+    (function() {
+        String.prototype.wbr = function() {
+            return this.replace(/([a-z])([A-Z])(?![^<]*>)/g, '$1<wbr>$2')
+                       .replace(/([A-Za-z0-9])([\._])(?![^<]*>)/g, '$1<wbr>$2');
+        };
+    })();
+}
+
 // our auto-completion disables browser native autocompletion, however this
 // excludes it from being restored by bf-cache.  trick the browser into
 // restoring by changing the autocomplete attribute when a page is hidden and