Inline-Diff works when the first word in a paragraph is being replaced - fixes #3401

CHANGELOG

@@ -21,7 +21,7 @@ Motions:
 - Fixed empty motion comment field in motion update form [#3194].
 - Fixed error on category sort [#3318].
 - Removed server side image to base64 transformation and
-  added local transformation [#3181]
+  added local transformation [#3181].
 - Added support for export motions in a ZIP archive [#3189].
 - Performance improvement for ZIP creation [#3251].
 - Bugfix: Changing motion line length did not invalidate cache [#3202].
@@ -36,7 +36,8 @@ Motions:
   pdf/docx export [#3329].
 - Added config value for pagenumber alignment in PDF [#3327].
 - Bugfix: Several bugfixes regarding splitting list items in
-  change recommendations [#3288]
+  change recommendations [#3288].
+- Bugfix: Several bugfixes regarding diff version [#3407, #3408].
 - Added inline Editing for motion reason [#3361].
 - Added multiselect filter for motion comments [#3372].
 - Added support for pinning personal notes to the window [#3360].

openslides/motions/static/js/motions/diff.js

@@ -1189,9 +1189,20 @@ angular.module('OpenSlidesApp.motions.diff', ['OpenSlidesApp.motions.lineNumberi
             var workaroundPrepend = "<DUMMY><PREPEND>";
 
             var str = this._diffString(workaroundPrepend + htmlOld, workaroundPrepend + htmlNew),
-                diffUnnormalized = str.replace(/^\s+/g, '').replace(/\s+$/g, '').replace(/ {2,}/g, ' ')
+                diffUnnormalized = str.replace(/^\s+/g, '').replace(/\s+$/g, '').replace(/ {2,}/g, ' ');
-                .replace(/<\/ins><ins>/gi, '').replace(/<\/del><del>/gi, '');
 
+            // Remove <del> tags that only delete line numbers
+            // We need to do this before removing </del><del> as done in one of the next statements
+            diffUnnormalized = diffUnnormalized.replace(
+                /<del>((<BR CLASS="os-line-break"><\/del><del>)?(<span[^>]+os-line-number[^>]+?>)(\s|<\/?del>)*<\/span>)<\/del>/gi,
+                function(found,tag,br,span) {
+                    return (br !== undefined ? br : '') + span + ' </span>';
+                }
+            );
+
+            diffUnnormalized = diffUnnormalized.replace(/<\/ins><ins>/gi, '').replace(/<\/del><del>/gi, '');
+
+            // Move whitespaces around inserted P's out of the INS-tag
             diffUnnormalized = diffUnnormalized.replace(
                 /<ins>(\s*)(<p( [^>]*)?>[\s\S]*?<\/p>)(\s*)<\/ins>/gim,
                 function(match, whiteBefore, inner, tagInner, whiteAfter) {
@@ -1205,6 +1216,8 @@ angular.module('OpenSlidesApp.motions.diff', ['OpenSlidesApp.motions.lineNumberi
                 }
             );
 
+            // If only a few characters of a word have changed, don't display this as a replacement of the whole word,
+            // but only of these specific characters
             diffUnnormalized = diffUnnormalized.replace(/<del>([a-z0-9,_-]* ?)<\/del><ins>([a-z0-9,_-]* ?)<\/ins>/gi, function (found, oldText, newText) {
                 var foundDiff = false, commonStart = '', commonEnd = '',
                     remainderOld = oldText, remainderNew = newText;
@@ -1242,14 +1255,7 @@ angular.module('OpenSlidesApp.motions.diff', ['OpenSlidesApp.motions.lineNumberi
                 return out;
             });
 
-            // Remove <del> tags that only delete line numbers
+            // Replace spaces in line numbers by &nbsp;
-            diffUnnormalized = diffUnnormalized.replace(
-                /<del>((<BR CLASS="os-line-break">)?<span[^>]+os-line-number[^>]+?>\s*<\/span>)<\/del>/gi,
-                function(found,tag) {
-                    return tag;
-                }
-            );
-
             diffUnnormalized = diffUnnormalized.replace(
                 /<span[^>]+os-line-number[^>]+?>\s*<\/span>/gi,
                 function(found) {

tests/karma/motions/diff.service.test.js

@@ -433,6 +433,14 @@ describe('linenumbering', function () {
       expect(diff).toBe('<DEL>Test1 Test2 Test3 Test4 Test5 Test9</DEL><INS>Test1 Test6 Test7 Test8 Test9</INS>');
     });
 
+    it('does not result in separate paragraphs when only the first word has changed', function () {
+      var before = '<p class="os-split-after"><span class="os-line-number line-number-1" data-line-number="1" contenteditable="false">&nbsp;</span>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor </p>',
+          after = '<p class="os-split-after">Bla ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor</p>';
+      var diff = diffService.diff(before, after);
+
+      expect(diff).toBe('<p class="os-split-after"><span class="line-number-1 os-line-number" data-line-number="1" contenteditable="false">&nbsp;</span><del>Lorem</del><ins>Bla</ins> ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor</p>');
+    });
+
     it('merges multiple inserts and deletes', function () {
       var before = "Some additional text to circumvent the threshold Test1 Test2 Test3 Test4 Test5 Test9",
           after = "Some additional text to circumvent the threshold Test1 Test6 Test7 Test8 Test9";
@@ -538,10 +546,10 @@ describe('linenumbering', function () {
               brMarkup(14) + 'gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>',
           after= '<p>Test</p>';
       var diff = diffService.diff(before, after).toLowerCase(),
-          expected = '<p class="delete">' +
+          expected = '<p>' +
-          noMarkup(13).replace(/&nbsp;/, "\u00A0") + 'diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd ' +
+              noMarkup(13) + '<del>diam voluptua. at vero eos et accusam et justo duo dolores et ea rebum. stet clita kasd </del>' +
-          brMarkup(14).replace(/&nbsp;/, "\u00A0") + 'gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>' +
+              brMarkup(14) + '<del>gubergren, no sea takimata sanctus est lorem ipsum dolor sit amet.</del>' +
-          '<p class="insert">Test</p>';
+              '<ins>test</ins></p>';
 
       expect(diff).toBe(expected.toLowerCase());
     });