PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Merge pull request #3262 from matrix-org/bwindels/fixhtmldiffs

Browse source 
Fix html diffs repeating text sometimes
This commit is contained in:
Bruno Windels 2019-07-31 10:51:37 +00:00 committed by GitHub
commit 678c9a7213
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 29 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
src/utils/MessageDiffUtils.js
View file

@ -219,6 +219,32 @@ function renderDifferenceInDOM(originalRootNode, diff, diffMathPatch) {
} }
} }
function routeIsEqual(r1, r2) {
return r1.length === r2.length && !r1.some((e, i) => e !== r2[i]);
}
// workaround for https://github.com/fiduswriter/diffDOM/issues/90
function filterCancelingOutDiffs(originalDiffActions) {
const diffActions = originalDiffActions.slice();
for (let i = 0; i < diffActions.length; ++i) {
const diff = diffActions[i];
if (diff.action === "removeTextElement") {
const nextDiff = diffActions[i + 1];
const cancelsOut = nextDiff &&
nextDiff.action === "addTextElement" &&
nextDiff.text === diff.text &&
routeIsEqual(nextDiff.route, diff.route);
if (cancelsOut) {
diffActions.splice(i, 2);
}
}
}
return diffActions;
}
/** /**
* Renders a message with the changes made in an edit shown visually. * Renders a message with the changes made in an edit shown visually.
* @param {object} originalContent the content for the base message * @param {object} originalContent the content for the base message
@ -233,7 +259,9 @@ export function editBodyDiffToHtml(originalContent, editContent) {
// diffActions is an array of objects with at least a `action` and `route` // diffActions is an array of objects with at least a `action` and `route`
// property. `action` tells us what the diff object changes, and `route` where. // property. `action` tells us what the diff object changes, and `route` where.
// `route` is a path on the DOM tree expressed as an array of indices. // `route` is a path on the DOM tree expressed as an array of indices.
const diffActions = dd.diff(originalBody, editBody); const originaldiffActions = dd.diff(originalBody, editBody);
// work around https://github.com/fiduswriter/diffDOM/issues/90
const diffActions = filterCancelingOutDiffs(originaldiffActions);
// for diffing text fragments // for diffing text fragments
const diffMathPatch = new DiffMatchPatch(); const diffMathPatch = new DiffMatchPatch();
// parse the base html message as a DOM tree, to which we'll apply the differences found. // parse the base html message as a DOM tree, to which we'll apply the differences found.