From 04e639b02d6ec0bb06e5cab5f43304e463a92ace Mon Sep 17 00:00:00 2001
From: Emad Shaaban <emad.shaaban92@gmail.com>
Date: Fri, 25 Aug 2017 14:42:22 +0200
Subject: [PATCH] [UI Test] UI Test for ControlHTML

---
 frappe/public/js/frappe/form/controls/html.js |  8 ++-
 frappe/tests/ui/test_control_html.js          | 51 +++++++++++++++++++
 frappe/tests/ui/tests.txt                     |  1 +
 3 files changed, 58 insertions(+), 2 deletions(-)
 create mode 100644 frappe/tests/ui/test_control_html.js

diff --git a/frappe/public/js/frappe/form/controls/html.js b/frappe/public/js/frappe/form/controls/html.js
index 0a34759ceb..53f1f04c08 100644
--- a/frappe/public/js/frappe/form/controls/html.js
+++ b/frappe/public/js/frappe/form/controls/html.js
@@ -2,7 +2,7 @@ frappe.ui.form.ControlHTML = frappe.ui.form.Control.extend({
 	make: function() {
 		this._super();
 		this.disp_area = this.wrapper;
-		this.frm.$wrapper.on('blur change', () => {
+		$(document).on('change', () => {
 			setTimeout(() => this.refresh_input(), 500);
 		});
 	},
@@ -12,7 +12,11 @@ frappe.ui.form.ControlHTML = frappe.ui.form.Control.extend({
 	},
 	get_content: function() {
 		var content = this.df.options || "";
-		return frappe.render(content, this);
+		try {
+			return frappe.render(content, this);
+		} catch (e) {
+			return content;
+		}
 	},
 	html: function(html) {
 		this.$wrapper.html(html || this.get_content());
diff --git a/frappe/tests/ui/test_control_html.js b/frappe/tests/ui/test_control_html.js
new file mode 100644
index 0000000000..8c0276508c
--- /dev/null
+++ b/frappe/tests/ui/test_control_html.js
@@ -0,0 +1,51 @@
+QUnit.module('controls');
+
+QUnit.test("Test ControlHTML", function(assert) {
+	assert.expect(3);
+	const random_name = frappe.utils.get_random(3).toLowerCase();
+
+	let done = assert.async();
+
+	frappe.run_serially([
+		() => {
+			return frappe.tests.make('Custom Field', [
+				{dt: 'ToDo'},
+				{fieldtype: 'HTML'},
+				{label: random_name},
+				{options: '<h3> Test </h3>'}
+			]);
+		},
+		() => {
+			return frappe.tests.make('Custom Field', [
+				{dt: 'ToDo'},
+				{fieldtype: 'HTML'},
+				{label: random_name + "_template"},
+				{options: '<h3> Test {%= doc.status %} </h3>'}
+			]);
+		},
+		() => frappe.set_route('List', 'ToDo'),
+		() => frappe.new_doc('ToDo'),
+		() => {
+			if (frappe.quick_entry)
+			{
+				frappe.quick_entry.dialog.$wrapper.find('.edit-full').click();
+				return frappe.timeout(1);
+			}
+		},
+		() => {
+			const control = $(`.frappe-control[data-fieldname="${random_name}"]`)[0];
+			return assert.ok(control.innerHTML === '<h3> Test </h3>');
+		},
+		() => {
+			const control = $(`.frappe-control[data-fieldname="${random_name}_template"]`)[0];
+			return assert.ok(control.innerHTML === '<h3> Test Open </h3>');
+		},
+		() => frappe.tests.set_control("status", "Closed"),
+		() => frappe.timeout(1),
+		() => {
+			const control = $(`.frappe-control[data-fieldname="${random_name}_template"]`)[0];
+			return assert.ok(control.innerHTML === '<h3> Test Closed </h3>');
+		},
+		() => done()
+	]);
+});
diff --git a/frappe/tests/ui/tests.txt b/frappe/tests/ui/tests.txt
index bcdd1c6cee..3c0bb98ebb 100644
--- a/frappe/tests/ui/tests.txt
+++ b/frappe/tests/ui/tests.txt
@@ -13,3 +13,4 @@ frappe/custom/doctype/customize_form/test_customize_form.js
 frappe/desk/doctype/event/test_event.js
 frappe/workflow/doctype/workflow/tests/test_workflow_create.js
 frappe/workflow/doctype/workflow/tests/test_workflow_test.js
+frappe/tests/ui/test_control_html.js