Merge pull request #6258 from matrix-org/t3chguy/fix/17752
This commit is contained in:
commit
f6bb0f4e75
2 changed files with 11 additions and 23 deletions
|
@ -15,20 +15,8 @@ limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
declare module "diff-dom" {
|
declare module "diff-dom" {
|
||||||
enum Action {
|
|
||||||
AddElement = "addElement",
|
|
||||||
AddTextElement = "addTextElement",
|
|
||||||
RemoveTextElement = "removeTextElement",
|
|
||||||
RemoveElement = "removeElement",
|
|
||||||
ReplaceElement = "replaceElement",
|
|
||||||
ModifyTextElement = "modifyTextElement",
|
|
||||||
AddAttribute = "addAttribute",
|
|
||||||
RemoveAttribute = "removeAttribute",
|
|
||||||
ModifyAttribute = "modifyAttribute",
|
|
||||||
}
|
|
||||||
|
|
||||||
export interface IDiff {
|
export interface IDiff {
|
||||||
action: Action;
|
action: string;
|
||||||
name: string;
|
name: string;
|
||||||
text?: string;
|
text?: string;
|
||||||
route: number[];
|
route: number[];
|
||||||
|
|
|
@ -17,7 +17,7 @@ limitations under the License.
|
||||||
import React, { ReactNode } from 'react';
|
import React, { ReactNode } from 'react';
|
||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
import { diff_match_patch as DiffMatchPatch } from 'diff-match-patch';
|
import { diff_match_patch as DiffMatchPatch } from 'diff-match-patch';
|
||||||
import { Action, DiffDOM, IDiff } from "diff-dom";
|
import { DiffDOM, IDiff } from "diff-dom";
|
||||||
import { IContent } from "matrix-js-sdk/src/models/event";
|
import { IContent } from "matrix-js-sdk/src/models/event";
|
||||||
|
|
||||||
import { bodyToHtml, checkBlockNode, IOptsReturnString } from "../HtmlUtils";
|
import { bodyToHtml, checkBlockNode, IOptsReturnString } from "../HtmlUtils";
|
||||||
|
@ -149,7 +149,7 @@ function stringAsTextNode(string: string): Text {
|
||||||
function renderDifferenceInDOM(originalRootNode: Node, diff: IDiff, diffMathPatch: DiffMatchPatch): void {
|
function renderDifferenceInDOM(originalRootNode: Node, diff: IDiff, diffMathPatch: DiffMatchPatch): void {
|
||||||
const {refNode, refParentNode} = findRefNodes(originalRootNode, diff.route);
|
const {refNode, refParentNode} = findRefNodes(originalRootNode, diff.route);
|
||||||
switch (diff.action) {
|
switch (diff.action) {
|
||||||
case Action.ReplaceElement: {
|
case "replaceElement": {
|
||||||
const container = document.createElement("span");
|
const container = document.createElement("span");
|
||||||
const delNode = wrapDeletion(diffTreeToDOM(diff.oldValue));
|
const delNode = wrapDeletion(diffTreeToDOM(diff.oldValue));
|
||||||
const insNode = wrapInsertion(diffTreeToDOM(diff.newValue));
|
const insNode = wrapInsertion(diffTreeToDOM(diff.newValue));
|
||||||
|
@ -158,17 +158,17 @@ function renderDifferenceInDOM(originalRootNode: Node, diff: IDiff, diffMathPatc
|
||||||
refNode.parentNode.replaceChild(container, refNode);
|
refNode.parentNode.replaceChild(container, refNode);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case Action.RemoveTextElement: {
|
case "removeTextElement": {
|
||||||
const delNode = wrapDeletion(stringAsTextNode(diff.value));
|
const delNode = wrapDeletion(stringAsTextNode(diff.value));
|
||||||
refNode.parentNode.replaceChild(delNode, refNode);
|
refNode.parentNode.replaceChild(delNode, refNode);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case Action.RemoveElement: {
|
case "removeElement": {
|
||||||
const delNode = wrapDeletion(diffTreeToDOM(diff.element));
|
const delNode = wrapDeletion(diffTreeToDOM(diff.element));
|
||||||
refNode.parentNode.replaceChild(delNode, refNode);
|
refNode.parentNode.replaceChild(delNode, refNode);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case Action.ModifyTextElement: {
|
case "modifyTextElement": {
|
||||||
const textDiffs = diffMathPatch.diff_main(diff.oldValue, diff.newValue);
|
const textDiffs = diffMathPatch.diff_main(diff.oldValue, diff.newValue);
|
||||||
diffMathPatch.diff_cleanupSemantic(textDiffs);
|
diffMathPatch.diff_cleanupSemantic(textDiffs);
|
||||||
const container = document.createElement("span");
|
const container = document.createElement("span");
|
||||||
|
@ -184,12 +184,12 @@ function renderDifferenceInDOM(originalRootNode: Node, diff: IDiff, diffMathPatc
|
||||||
refNode.parentNode.replaceChild(container, refNode);
|
refNode.parentNode.replaceChild(container, refNode);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case Action.AddElement: {
|
case "addElement": {
|
||||||
const insNode = wrapInsertion(diffTreeToDOM(diff.element));
|
const insNode = wrapInsertion(diffTreeToDOM(diff.element));
|
||||||
insertBefore(refParentNode, refNode, insNode);
|
insertBefore(refParentNode, refNode, insNode);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case Action.AddTextElement: {
|
case "addTextElement": {
|
||||||
// XXX: sometimes diffDOM says insert a newline when there shouldn't be one
|
// XXX: sometimes diffDOM says insert a newline when there shouldn't be one
|
||||||
// but we must insert the node anyway so that we don't break the route child IDs.
|
// but we must insert the node anyway so that we don't break the route child IDs.
|
||||||
// See https://github.com/fiduswriter/diffDOM/issues/100
|
// See https://github.com/fiduswriter/diffDOM/issues/100
|
||||||
|
@ -199,9 +199,9 @@ function renderDifferenceInDOM(originalRootNode: Node, diff: IDiff, diffMathPatc
|
||||||
}
|
}
|
||||||
// e.g. when changing a the href of a link,
|
// e.g. when changing a the href of a link,
|
||||||
// show the link with old href as removed and with the new href as added
|
// show the link with old href as removed and with the new href as added
|
||||||
case Action.RemoveAttribute:
|
case "removeAttribute":
|
||||||
case Action.AddAttribute:
|
case "addAttribute":
|
||||||
case Action.ModifyAttribute: {
|
case "modifyAttribute": {
|
||||||
const delNode = wrapDeletion(refNode.cloneNode(true));
|
const delNode = wrapDeletion(refNode.cloneNode(true));
|
||||||
const updatedNode = refNode.cloneNode(true) as HTMLElement;
|
const updatedNode = refNode.cloneNode(true) as HTMLElement;
|
||||||
if (diff.action === "addAttribute" || diff.action === "modifyAttribute") {
|
if (diff.action === "addAttribute" || diff.action === "modifyAttribute") {
|
||||||
|
|
Loading…
Reference in a new issue