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

Merge pull request #3469 from matrix-org/bwindels/cider-deserialize-fixes

Browse source 
Fix: paragraphs not being preserved when editing in CIDER
This commit is contained in:
Bruno Windels 2019-09-23 13:56:44 +00:00 committed by GitHub
commit f4fd6d699b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 19 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
src/editor/deserialize.js
View file

@ -76,7 +76,7 @@ function parseHeader(el, partCreator) {
return partCreator.plain("#".repeat(depth) + " "); return partCreator.plain("#".repeat(depth) + " ");
} }
function parseElement(n, partCreator, state) { function parseElement(n, partCreator, lastNode, state) {
switch (n.nodeName) { switch (n.nodeName) {
case "H1": case "H1":
case "H2": case "H2":
@ -90,7 +90,7 @@ function parseElement(n, partCreator, state) {
case "BR": case "BR":
return partCreator.newline(); return partCreator.newline();
case "EM": case "EM":
return partCreator.plain(`*${n.textContent}*`); return partCreator.plain(`_${n.textContent}_`);
case "STRONG": case "STRONG":
return partCreator.plain(`**${n.textContent}**`); return partCreator.plain(`**${n.textContent}**`);
case "PRE": case "PRE":
@ -107,6 +107,12 @@ function parseElement(n, partCreator, state) {
return partCreator.plain(`${indent}- `); return partCreator.plain(`${indent}- `);
} }
} }
case "P": {
if (lastNode) {
return partCreator.newline();
}
break;
}
case "OL": case "OL":
case "UL": case "UL":
state.listDepth = (state.listDepth || 0) + 1; state.listDepth = (state.listDepth || 0) + 1;
@ -183,7 +189,7 @@ function parseHtmlMessage(html, partCreator, isQuotedMessage) {
if (n.nodeType === Node.TEXT_NODE) { if (n.nodeType === Node.TEXT_NODE) {
newParts.push(...parseAtRoomMentions(n.nodeValue, partCreator)); newParts.push(...parseAtRoomMentions(n.nodeValue, partCreator));
} else if (n.nodeType === Node.ELEMENT_NODE) { } else if (n.nodeType === Node.ELEMENT_NODE) {
const parseResult = parseElement(n, partCreator, state); const parseResult = parseElement(n, partCreator, lastNode, state);
if (parseResult) { if (parseResult) {
if (Array.isArray(parseResult)) { if (Array.isArray(parseResult)) {
newParts.push(...parseResult); newParts.push(...parseResult);
@ -200,10 +206,6 @@ function parseHtmlMessage(html, partCreator, isQuotedMessage) {
parts.push(...newParts); parts.push(...newParts);
// extra newline after quote, only if there something behind it...
if (lastNode && lastNode.nodeName === "BLOCKQUOTE") {
parts.push(partCreator.newline());
}
const decend = checkDecendInto(n); const decend = checkDecendInto(n);
// when not decending (like for PRE), onNodeLeave won't be called to set lastNode // when not decending (like for PRE), onNodeLeave won't be called to set lastNode
// so do that here. // so do that here.

18
test/editor/deserialize-test.js
View file

@ -94,7 +94,7 @@ describe('editor/deserialize', function() {
const html = "<strong>bold</strong> and <em>emphasized</em> text"; const html = "<strong>bold</strong> and <em>emphasized</em> text";
const parts = normalize(parseEvent(htmlMessage(html), createPartCreator())); const parts = normalize(parseEvent(htmlMessage(html), createPartCreator()));
expect(parts.length).toBe(1); expect(parts.length).toBe(1);
expect(parts[0]).toStrictEqual({type: "plain", text: "**bold** and *emphasized* text"}); expect(parts[0]).toStrictEqual({type: "plain", text: "**bold** and _emphasized_ text"});
}); });
it('hyperlink', function() { it('hyperlink', function() {
const html = 'click <a href="http://example.com/">this</a>!'; const html = 'click <a href="http://example.com/">this</a>!';
@ -105,10 +105,11 @@ describe('editor/deserialize', function() {
it('multiple lines with paragraphs', function() { it('multiple lines with paragraphs', function() {
const html = '<p>hello</p><p>world</p>'; const html = '<p>hello</p><p>world</p>';
const parts = normalize(parseEvent(htmlMessage(html), createPartCreator())); const parts = normalize(parseEvent(htmlMessage(html), createPartCreator()));
expect(parts.length).toBe(3); expect(parts.length).toBe(4);
expect(parts[0]).toStrictEqual({type: "plain", text: "hello"}); expect(parts[0]).toStrictEqual({type: "plain", text: "hello"});
expect(parts[1]).toStrictEqual({type: "newline", text: "\n"}); expect(parts[1]).toStrictEqual({type: "newline", text: "\n"});
expect(parts[2]).toStrictEqual({type: "plain", text: "world"}); expect(parts[2]).toStrictEqual({type: "newline", text: "\n"});
expect(parts[3]).toStrictEqual({type: "plain", text: "world"});
}); });
it('multiple lines with line breaks', function() { it('multiple lines with line breaks', function() {
const html = 'hello<br>world'; const html = 'hello<br>world';
@ -121,18 +122,19 @@ describe('editor/deserialize', function() {
it('multiple lines mixing paragraphs and line breaks', function() { it('multiple lines mixing paragraphs and line breaks', function() {
const html = '<p>hello<br>warm</p><p>world</p>'; const html = '<p>hello<br>warm</p><p>world</p>';
const parts = normalize(parseEvent(htmlMessage(html), createPartCreator())); const parts = normalize(parseEvent(htmlMessage(html), createPartCreator()));
expect(parts.length).toBe(5); expect(parts.length).toBe(6);
expect(parts[0]).toStrictEqual({type: "plain", text: "hello"}); expect(parts[0]).toStrictEqual({type: "plain", text: "hello"});
expect(parts[1]).toStrictEqual({type: "newline", text: "\n"}); expect(parts[1]).toStrictEqual({type: "newline", text: "\n"});
expect(parts[2]).toStrictEqual({type: "plain", text: "warm"}); expect(parts[2]).toStrictEqual({type: "plain", text: "warm"});
expect(parts[3]).toStrictEqual({type: "newline", text: "\n"}); expect(parts[3]).toStrictEqual({type: "newline", text: "\n"});
expect(parts[4]).toStrictEqual({type: "plain", text: "world"}); expect(parts[4]).toStrictEqual({type: "newline", text: "\n"});
expect(parts[5]).toStrictEqual({type: "plain", text: "world"});
}); });
it('quote', function() { it('quote', function() {
const html = '<blockquote><p><em>wise</em><br><strong>words</strong></p></blockquote><p>indeed</p>'; const html = '<blockquote><p><em>wise</em><br><strong>words</strong></p></blockquote><p>indeed</p>';
const parts = normalize(parseEvent(htmlMessage(html), createPartCreator())); const parts = normalize(parseEvent(htmlMessage(html), createPartCreator()));
expect(parts.length).toBe(6); expect(parts.length).toBe(6);
expect(parts[0]).toStrictEqual({type: "plain", text: "> *wise*"}); expect(parts[0]).toStrictEqual({type: "plain", text: "> _wise_"});
expect(parts[1]).toStrictEqual({type: "newline", text: "\n"}); expect(parts[1]).toStrictEqual({type: "newline", text: "\n"});
expect(parts[2]).toStrictEqual({type: "plain", text: "> **words**"}); expect(parts[2]).toStrictEqual({type: "plain", text: "> **words**"});
expect(parts[3]).toStrictEqual({type: "newline", text: "\n"}); expect(parts[3]).toStrictEqual({type: "newline", text: "\n"});
@ -159,7 +161,7 @@ describe('editor/deserialize', function() {
const html = "<em>formatted</em> message for @room"; const html = "<em>formatted</em> message for @room";
const parts = normalize(parseEvent(htmlMessage(html), createPartCreator())); const parts = normalize(parseEvent(htmlMessage(html), createPartCreator()));
expect(parts.length).toBe(2); expect(parts.length).toBe(2);
expect(parts[0]).toStrictEqual({type: "plain", text: "*formatted* message for "}); expect(parts[0]).toStrictEqual({type: "plain", text: "_formatted_ message for "});
expect(parts[1]).toStrictEqual({type: "at-room-pill", text: "@room"}); expect(parts[1]).toStrictEqual({type: "at-room-pill", text: "@room"});
}); });
it('inline code', function() { it('inline code', function() {
@ -220,7 +222,7 @@ describe('editor/deserialize', function() {
const html = "says <em>DON'T SHOUT</em>!"; const html = "says <em>DON'T SHOUT</em>!";
const parts = normalize(parseEvent(htmlMessage(html, "m.emote"), createPartCreator())); const parts = normalize(parseEvent(htmlMessage(html, "m.emote"), createPartCreator()));
expect(parts.length).toBe(1); expect(parts.length).toBe(1);
expect(parts[0]).toStrictEqual({type: "plain", text: "/me says *DON'T SHOUT*!"}); expect(parts[0]).toStrictEqual({type: "plain", text: "/me says _DON'T SHOUT_!"});
}); });
}); });
}); });