OpenCloud
/
riot-web
mirror of https://github.com/vector-im/riot-web
1
0
Fork 0
Code Issues Releases Wiki Activity

Fix list formatting alternating on edit (#7422) 

Co-authored-by: Andy Balaam <andyb@element.io>
pull/21833/head
Renan Cleyson 2021-12-21 07:07:44 -03:00 committed by GitHub
parent 8b2a478a25
commit 9ac85bcaa3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 35 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/editor/deserialize.ts
View File

@ -242,7 +242,19 @@ function parseHtmlMessage(html: string, partCreator: PartCreator, isQuotedMessag
} }
if (n.nodeType === Node.TEXT_NODE) { if (n.nodeType === Node.TEXT_NODE) {
newParts.push(...parseAtRoomMentions(n.nodeValue, partCreator)); let { nodeValue } = n;
// Sometimes commonmark adds a newline at the end of the list item text
if (n.parentNode.nodeName === "LI") {
nodeValue = nodeValue.trimEnd();
}
newParts.push(...parseAtRoomMentions(nodeValue, partCreator));
const grandParent = n.parentNode.parentNode;
const isTight = n.parentNode.nodeName !== "P" || grandParent?.nodeName !== "LI";
if (!isTight) {
newParts.push(partCreator.newline());
}
} else if (n.nodeType === Node.ELEMENT_NODE) { } else if (n.nodeType === Node.ELEMENT_NODE) {
const parseResult = parseElement(n, partCreator, lastNode, state); const parseResult = parseElement(n, partCreator, lastNode, state);
if (parseResult) { if (parseResult) {

22
test/editor/deserialize-test.js
View File

@ -237,6 +237,18 @@ describe('editor/deserialize', function() {
expect(parts[3]).toStrictEqual({ type: "newline", text: "\n" }); expect(parts[3]).toStrictEqual({ type: "newline", text: "\n" });
expect(parts[4]).toStrictEqual({ type: "plain", text: "3. Finish" }); expect(parts[4]).toStrictEqual({ type: "plain", text: "3. Finish" });
}); });
it('non tight lists', () => {
const html = "<ol><li><p>Start</p></li><li><p>Continue</p></li><li><p>Finish</p></li></ol>";
const parts = normalize(parseEvent(htmlMessage(html), createPartCreator()));
expect(parts.length).toBe(8);
expect(parts[0]).toStrictEqual({ type: "plain", text: "1. Start" });
expect(parts[1]).toStrictEqual({ type: "newline", text: "\n" });
expect(parts[2]).toStrictEqual({ type: "newline", text: "\n" });
expect(parts[3]).toStrictEqual({ type: "plain", text: "2. Continue" });
expect(parts[4]).toStrictEqual({ type: "newline", text: "\n" });
expect(parts[5]).toStrictEqual({ type: "newline", text: "\n" });
expect(parts[6]).toStrictEqual({ type: "plain", text: "3. Finish" });
});
it('nested unordered lists', () => { it('nested unordered lists', () => {
const html = "<ul><li>Oak<ul><li>Spruce<ul><li>Birch</li></ul></li></ul></li></ul>"; const html = "<ul><li>Oak<ul><li>Spruce<ul><li>Birch</li></ul></li></ul></li></ul>";
const parts = normalize(parseEvent(htmlMessage(html), createPartCreator())); const parts = normalize(parseEvent(htmlMessage(html), createPartCreator()));
@ -257,6 +269,16 @@ describe('editor/deserialize', function() {
expect(parts[3]).toStrictEqual({ type: "newline", text: "\n" }); expect(parts[3]).toStrictEqual({ type: "newline", text: "\n" });
expect(parts[4]).toStrictEqual({ type: "plain", text: `${FOUR_SPACES.repeat(2)}1. Birch` }); expect(parts[4]).toStrictEqual({ type: "plain", text: `${FOUR_SPACES.repeat(2)}1. Birch` });
}); });
it('nested tight lists', () => {
const html = "<ol><li>Oak\n<ol><li>Spruce\n<ol><li>Birch</li></ol></li></ol></li></ol>";
const parts = normalize(parseEvent(htmlMessage(html), createPartCreator()));
expect(parts.length).toBe(5);
expect(parts[0]).toStrictEqual({ type: "plain", text: "1. Oak" });
expect(parts[1]).toStrictEqual({ type: "newline", text: "\n" });
expect(parts[2]).toStrictEqual({ type: "plain", text: `${FOUR_SPACES}1. Spruce` });
expect(parts[3]).toStrictEqual({ type: "newline", text: "\n" });
expect(parts[4]).toStrictEqual({ type: "plain", text: `${FOUR_SPACES.repeat(2)}1. Birch` });
});
it('mx-reply is stripped', function() { it('mx-reply is stripped', function() {
const html = "<mx-reply>foo</mx-reply>bar"; const html = "<mx-reply>foo</mx-reply>bar";
const parts = normalize(parseEvent(htmlMessage(html), createPartCreator())); const parts = normalize(parseEvent(htmlMessage(html), createPartCreator()));