Bugfix - Fixing error when using single quotation mark on html

jails-org · Aug 12, 2023 · c4ef784 · c4ef784
1 parent d5cf6d2
commit c4ef784
Show file tree

Hide file tree

Showing 5 changed files with 9 additions and 9 deletions.
diff --git a/dist/index.js b/dist/index.js
diff --git a/dist/index.js.map b/dist/index.js.map
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "jails-js",
-	"version": "5.1.0",
+	"version": "5.1.1",
 	"description": "Jails - Elegant and Minimalistic Javascript Application Library",
 	"main": "dist/index.js",
 	"types": "types/index.d.ts",

diff --git a/src/template-system.ts b/src/template-system.ts
@@ -14,8 +14,8 @@ export const templateConfig = (newconfig) => {
 export default function Template(element, $scopes) {
 
 	element.initialState = getInitialState( element )
-	const html = Transpile(element.outerHTML, config, $scopes)
-	textarea.innerHTML = html
+	// The line below has potential bug, needs improvement.
+	textarea.innerHTML = Transpile(element.outerHTML.replace(/(?!".*)\'(?!.*")/g, "\\'"), config, $scopes)
 
 	return new Function('$element', '$scopes',`
 		var $data = this;
@@ -25,9 +25,11 @@ export default function Template(element, $scopes) {
 		}
 
 		with( $data ){
-			var output = '${textarea.value.replace(/\n/g, '')
+			var output = '${textarea.value
+				.replace(/\n/g, '')
 				.replace(/<%=(.+?)%>/g, `'+safe(function(){return $1;})+'`)
-				.replace(/<%(.+?)%>/g, `';$1\noutput+='`)}'
+				.replace(/<%(.+?)%>/g, `';$1\noutput+='`)
+			}'
 			return output
 		}
 	`)

diff --git a/src/transpile.ts b/src/transpile.ts
@@ -5,8 +5,6 @@ export default function Transpile(html, config, $scopes) {
 	const regexTags = new RegExp(`\\${config.tags[0]}(.+?)\\${config.tags[1]}`, 'g')
 	const virtual = parser.parseFromString(html.replace(/<\/?template[^>]*>/g, ''), 'text/html')
 
-	virtual.documentElement.innerHTML = html.replace(/<\/?template[^>]*>/g, '')
-
 	virtual.querySelectorAll('[html-for], [html-if], [html-inner], [html-class]').forEach((element) => {
 
 		const htmlForeach = element.getAttribute('html-foreach')