assets/highlightjs-line-numbers: Upgrade to 2.7.0

See wcoder/highlightjs-line-numbers.js#62 for more details.

Author: anlambert

package.json

@@ -46,7 +46,7 @@
     "file-loader": "^3.0.1",
     "font-awesome": "^4.7.0",
     "highlight.js": "^9.15.6",
-    "highlightjs-line-numbers.js": "^2.6.0",
+    "highlightjs-line-numbers.js": "^2.7.0",
     "iframe-resizer": "^4.0.4",
     "imports-loader": "^0.8.0",
     "jquery": "^3.3.1",

swh/web/assets/config/webpack.config.development.js

@@ -364,10 +364,6 @@ module.exports = {
         './node_modules/admin-lte/dist/js/adminlte.js'
       },
       licenseOverride: {
-        './swh/web/assets/src/thirdparty/highlightjs-line-numbers/highlightjs-line-numbers.js': {
-          'spdxLicenseExpression': 'MIT',
-          'licenseFilePath': './swh/web/assets/src/thirdparty/highlightjs-line-numbers/LICENSE'
-        },
         './swh/web/assets/src/thirdparty/jquery.tabSlideOut/jquery.tabSlideOut.js': {
           'spdxLicenseExpression': 'GPL-3.0',
           'licenseFilePath': './swh/web/assets/src/thirdparty/jquery.tabSlideOut/LICENSE'

swh/web/assets/src/bundles/revision/diff-utils.js

@@ -65,11 +65,6 @@ function formatDiffLineNumbers(fromLine, toLine, maxNumberChars) {
   return ret;
 }
 
-function adjustCodeBlockLeftMargin(diffElt) {
-  let left = $(diffElt).find('.hljs-ln-numbers-container').width();
-  $(diffElt).find('.hljs-ln-code-container').css('margin-left', left + 'px');
-}
-
 // to compute diff and process it for display
 export function computeDiff(diffUrl, diffId) {
 
@@ -144,10 +139,8 @@ export function computeDiff(diffUrl, diffId) {
           let diffToStr = '';
           let linesOffset = 0;
 
-          let codeLineElts = $(`#${diffId} .hljs-ln-code-container`).children();
-
           $(`#${diffId} .hljs-ln-numbers`).each((i, lnElt) => {
-            let lnText = $(codeLineElts[i]).text();
+            let lnText = lnElt.nextSibling.innerText;
             let linesInfo = linesInfoRegExp.exec(lnText);
             let fromLine = '';
             let toLine = '';
@@ -218,55 +211,45 @@ export function computeDiff(diffUrl, diffId) {
             hljs.lineNumbersBlock(block);
           });
 
-          function highlightDiffLines(diffId) {
-            let codeLineElts = $(`#${diffId} .hljs-ln-code-container`).children();
-            $(`#${diffId} .hljs-ln-numbers`).each((i, lnElt) => {
-              let lnTextElt = codeLineElts[i];
-              let lnText = $(lnTextElt).text();
+          // hljs.lineNumbersBlock is asynchronous so we have to postpone our
+          // next treatments by adding it at the end of the current js events queue
+          setTimeout(() => {
+            // diff highlighting for added/removed lines on top of code highlighting
+            $(`.${diffId} .hljs-ln-numbers`).each((i, lnElt) => {
+              let lnText = lnElt.nextSibling.innerText;
               let linesInfo = linesInfoRegExp.exec(lnText);
               if (linesInfo) {
-                $(lnElt).addClass('swh-diff-lines-info');
-                $(lnTextElt).addClass('swh-diff-lines-info');
-                $(lnTextElt).text('');
-                $(lnTextElt).append(`<span class="hljs-meta">${lnText}</span>`);
+                $(lnElt).parent().addClass('swh-diff-lines-info');
+                let linesInfoText = $(lnElt).parent().find('.hljs-ln-code .hljs-ln-line').text();
+                $(lnElt).parent().find('.hljs-ln-code .hljs-ln-line').children().remove();
+                $(lnElt).parent().find('.hljs-ln-code .hljs-ln-line').text('');
+                $(lnElt).parent().find('.hljs-ln-code .hljs-ln-line').append(`<span class="hljs-meta">${linesInfoText}</span>`);
               } else if (lnText.length > 0 && lnText[0] === '-') {
-                $(lnElt).addClass('swh-diff-removed-line');
-                $(lnTextElt).addClass('swh-diff-removed-line');
+                $(lnElt).parent().addClass('swh-diff-removed-line');
               } else if (lnText.length > 0 && lnText[0] === '+') {
-                $(lnElt).addClass('swh-diff-added-line');
-                $(lnTextElt).addClass('swh-diff-added-line');
+                $(lnElt).parent().addClass('swh-diff-added-line');
               }
             });
-          }
-
-          // hljs.lineNumbersBlock is asynchronous so we have to postpone our
-          // next treatments by adding it at the end of the current js events queue
-          setTimeout(() => {
-
-            // diff highlighting for added/removed lines on top of code highlighting
-            highlightDiffLines(diffId);
-            highlightDiffLines(`${diffId}-from`);
-            highlightDiffLines(`${diffId}-to`);
 
             // set line numbers for unified diff
-            $(`#${diffId} .hljs-ln-numbers .hljs-ln-n`).each((i, lnElt) => {
-              $(lnElt).attr(
+            $(`#${diffId} .hljs-ln-numbers`).each((i, lnElt) => {
+              $(lnElt).children().attr(
                 'data-line-number',
                 formatDiffLineNumbers(fromToLines[i][0], fromToLines[i][1],
                                       maxNumberChars));
             });
 
             // set line numbers for the from side-by-side diff
-            $(`#${diffId}-from .hljs-ln-numbers .hljs-ln-n`).each((i, lnElt) => {
-              $(lnElt).attr(
+            $(`#${diffId}-from .hljs-ln-numbers`).each((i, lnElt) => {
+              $(lnElt).children().attr(
                 'data-line-number',
                 formatDiffLineNumbers(fromLines[i], null,
                                       maxNumberChars));
             });
 
             // set line numbers for the to side-by-side diff
-            $(`#${diffId}-to .hljs-ln-numbers .hljs-ln-n`).each((i, lnElt) => {
-              $(lnElt).attr(
+            $(`#${diffId}-to .hljs-ln-numbers`).each((i, lnElt) => {
+              $(lnElt).children().attr(
                 'data-line-number',
                 formatDiffLineNumbers(null, toLines[i],
                                       maxNumberChars));
@@ -305,8 +288,6 @@ export function computeDiff(diffUrl, diffId) {
 
             setDiffVisible(diffId);
 
-            adjustCodeBlockLeftMargin(`#${diffId}`);
-
           });
         });
       }
@@ -429,8 +410,6 @@ export function showUnifiedDiff(event, diffId) {
 export function showSplittedDiff(event, diffId) {
   $(`#${diffId}-unified-diff`).css('display', 'none');
   $(`#${diffId}-splitted-diff`).css('display', 'block');
-  adjustCodeBlockLeftMargin(`#${diffId}-from`);
-  adjustCodeBlockLeftMargin(`#${diffId}-to`);
 }
 
 // callback when the user clicks on the 'Compute all diffs' button