From b37083d69348fc773b81d9cb7b80cf47d65edee3 Mon Sep 17 00:00:00 2001
From: Matias Cammisa <matias@faire.com>
Date: Fri, 6 Dec 2019 17:45:39 -0500
Subject: [PATCH] escape html characters when converting text node to HTML

---
 src/dom_components/model/ComponentTextNode.js |  7 ++++-
 test/specs/dom_components/model/Component.js  | 31 +++++++++++++++++++
 2 files changed, 37 insertions(+), 1 deletion(-)

diff --git a/src/dom_components/model/ComponentTextNode.js b/src/dom_components/model/ComponentTextNode.js
index 98317d272..b6599d98c 100644
--- a/src/dom_components/model/ComponentTextNode.js
+++ b/src/dom_components/model/ComponentTextNode.js
@@ -10,7 +10,12 @@ export default Component.extend(
     },
 
     toHTML() {
-      return this.get('content');
+      return this.get('content')
+        .replace(/&/g, '&amp;')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;')
+        .replace(/"/g, '&quot;')
+        .replace(/'/g, '&#039;');
     }
   },
   {
diff --git a/test/specs/dom_components/model/Component.js b/test/specs/dom_components/model/Component.js
index 05bd10e1f..c1e3258c5 100644
--- a/test/specs/dom_components/model/Component.js
+++ b/test/specs/dom_components/model/Component.js
@@ -3,6 +3,7 @@ import DomComponents from 'dom_components';
 import Component from 'dom_components/model/Component';
 import ComponentImage from 'dom_components/model/ComponentImage';
 import ComponentText from 'dom_components/model/ComponentText';
+import ComponentTextNode from 'dom_components/model/ComponentTextNode';
 import ComponentLink from 'dom_components/model/ComponentLink';
 import ComponentMap from 'dom_components/model/ComponentMap';
 import ComponentVideo from 'dom_components/model/ComponentVideo';
@@ -481,6 +482,36 @@ describe('Text Component', () => {
   });
 });
 
+describe('Text Node Component', () => {
+  beforeEach(() => {
+    obj = new ComponentTextNode();
+  });
+
+  afterEach(() => {
+    obj = null;
+  });
+
+  test('Has content property', () => {
+    expect(obj.has('content')).toEqual(true);
+  });
+
+  test('Not droppable', () => {
+    expect(obj.get('droppable')).toEqual(false);
+  });
+
+  test('Not editable', () => {
+    expect(obj.get('editable')).toEqual(true);
+  });
+
+  test('Component toHTML with attributes', () => {
+    obj = new ComponentTextNode({
+      attributes: { 'data-test': 'value' },
+      content: `test content &<>"'`
+    });
+    expect(obj.toHTML()).toEqual('test content &amp;&lt;&gt;&quot;&#039;');
+  });
+});
+
 describe('Link Component', () => {
   const aEl = document.createElement('a');