mystiq/hydrogen-web
Archived
4
1
Fork 1
Code Issues Pull requests Projects Releases Packages Wiki Activity

Do some additional validation, blocking block nodes inside inline nodes.

Browse source
This commit is contained in:
Danila Fedorin 2021-07-13 14:47:10 -07:00
parent 4b92903ddd
commit 5e39eb8f6c
1 changed files with 119 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

149
src/domain/session/room/timeline/deserialize.js
View file

@ -10,7 +10,8 @@ import { MessageBody, HeaderBlock, ListBlock, CodeBlock, FormatPart, NewLinePart
* Nodes that don't have any properties to them other than their tag.
* While <a> has `href`, and <img> has `src`, these have... themselves.
*/
const basicNodes = ["EM", "STRONG", "CODE", "DEL", "P", "DIV", "SPAN" ]
const basicInline = ["EM", "STRONG", "CODE", "DEL", "SPAN" ];
const basicBlock = ["DIV"];
class Deserializer {
constructor(result, mediaRepository) {
@ -21,7 +22,7 @@ class Deserializer {
parseLink(node, children) {
// TODO Not equivalent to `node.href`!
// Add another HTMLParseResult method?
let href = this.result.getAttributeValue(node, "href");
const href = this.result.getAttributeValue(node, "href");
return new LinkPart(href, children);
}
@ -37,7 +38,7 @@ class Deserializer {
if (result.getNodeElementName(child) !== "LI") {
continue;
}
const item = this.parseNodes(result.getChildNodes(child));
const item = this.parseAnyNodes(result.getChildNodes(child));
nodes.push(item);
}
return new ListBlock(start, nodes);
@ -79,9 +80,59 @@ class Deserializer {
return new ImagePart(url, width, height, alt, title);
}
parseElement(node) {
/** Once a node is known to be an element,
* attempt to interpret it as an inline element.
*
* @returns the inline message part, or null if the element
* is not inline or not allowed.
*/
parseInlineElement(node) {
const result = this.result;
const tag = result.getNodeElementName(node);
const children = result.getChildNodes(node);
switch (tag) {
case "A": {
const inlines = this.parseInlineNodes(children);
return this.parseLink(node, inlines);
}
case "BR":
return new NewLinePart();
default: {
if (!basicInline.includes(tag)) {
return null;
}
const inlines = this.parseInlineNodes(children);
return new FormatPart(tag, inlines);
}
}
}
/** Attempt to interpret a node as inline.
*
* @returns the inline message part, or null if the
* element is not inline or not allowed.
*/
parseInlineNode(node) {
const result = this.result;
if (result.isTextNode(node)) {
// TODO Linkify
return new TextPart(result.getNodeText(node));
} else if (result.isElementNode(node)) {
return this.parseInlineElement(node);
}
return null;
}
/** Once a node is known to be an element, attempt
* to interpret it as a block element.
*
* @returns the block message part, or null of the
* element is not a block or not allowed.
*/
parseBlockElement(node) {
const result = this.result;
const tag = result.getNodeElementName(node);
const children = result.getChildNodes(node);
switch (tag) {
case "H1":
case "H2":
@ -89,66 +140,87 @@ class Deserializer {
case "H4":
case "H5":
case "H6": {
const children = this.parseChildNodes(node);
return new HeaderBlock(parseInt(tag[1]), children)
}
case "A": {
const children = this.parseChildNodes(node);
return this.parseLink(node, children);
const inlines = this.parseInlineNodes(children);
return new HeaderBlock(parseInt(tag[1]), inlines)
}
case "UL":
case "OL":
return this.parseList(node);
case "PRE":
return this.parseCodeBlock(node);
case "BR":
return new NewLinePart();
case "HR":
return new RulePart();
case "IMG":
return this.parseImage(node);
case "P": {
const inlines = this.parseInlineNodes(children);
return new FormatPart(tag, inlines);
}
default: {
if (!basicNodes.includes(tag)) {
if (!basicBlock.includes(tag)) {
return null;
}
const children = this.parseChildNodes(node);
return new FormatPart(tag, children);
const blocks = this.parseAnyNodes(children);
return new FormatPart(tag, blocks);
}
}
}
parseNode(node) {
/** Attempt to parse a node as a block.
*
* @return the block message part, or null if the node
* is not a block element.
*/
parseBlockNode(node) {
const result = this.result;
if (result.isTextNode(node)) {
return new TextPart(result.getNodeText(node));
} else if (result.isElementNode(node)) {
return this.parseElement(node);
if (result.isElementNode(node)) {
return this.parseBlockElement(node);
}
return null;
}
parseChildNodes(node) {
const childNodes = this.result.getChildNodes(node);
return this.parseNodes(childNodes);
_parseInlineNodes(nodes, into) {
for (const htmlNode of nodes) {
const node = this.parseInlineNode(htmlNode);
if (node) {
into.push(node);
continue;
}
// Node is either block or unrecognized. In
// both cases, just move on to its children.
this._parseInlineNodes(this.result.getChildNodes(htmlNode), into);
}
}
parseNodes(nodes) {
const parsed = [];
parseInlineNodes(nodes) {
const into = [];
this._parseInlineNodes(nodes, into);
return into;
}
_parseAnyNodes(nodes, into) {
for (const htmlNode of nodes) {
let node = this.parseNode(htmlNode);
// Just ignore invalid / unknown tags.
const node = this.parseInlineNode(htmlNode) || this.parseBlockNode(htmlNode);
if (node) {
parsed.push(node);
into.push(node);
continue;
}
// Node is unrecognized. Just move on to its children.
this._parseAnyNodes(this.result.getChildNodes(htmlNode), into);
}
return parsed;
}
parseAnyNodes(nodes) {
const into = [];
this._parseAnyNodes(nodes, into);
return into;
}
}
export function parseHTMLBody(platform, mediaRepository, html) {
const parseResult = platform.parseHTML(html);
const deserializer = new Deserializer(parseResult, mediaRepository);
const parts = deserializer.parseNodes(parseResult.rootNodes);
const parts = deserializer.parseAnyNodes(parseResult.rootNodes);
return new MessageBody(html, parts);
}
@ -256,6 +328,23 @@ export function tests() {
];
test(assert, input, output);
},
"Block elements ignored inside inline elements": assert => {
const input = '<span><p><code>Hello</code></p></span>';
const output = [
new FormatPart("span", [new FormatPart("code", [new TextPart("Hello")])])
];
test(assert, input, output);
},
"Unknown tags are ignored, but their children are kept": assert => {
const input = '<span><dfn><code>Hello</code></dfn><footer><em>World</em></footer></span>';
const output = [
new FormatPart("span", [
new FormatPart("code", [new TextPart("Hello")]),
new FormatPart("em", [new TextPart("World")])
])
];
test(assert, input, output);
},
/* Doesnt work: HTML library doesn't handle <pre><code> properly.
"Text with code block": assert => {
const code = 'main :: IO ()\nmain = putStrLn "Hello"'