Parsing improvement

lib/dom.js

@@ -8,9 +8,10 @@ const symbols = {
 }
 
 const parts = /(^\s*<!doctype [^>]+>|)([\s\S]*)$/i
-const identifier = /{((\??)([a-z][a-z\d_]*(?:\.[a-z][a-z\d_]*)*))}/gi
-const attribute = /(<!--dom-engine::(\??)([a-z][a-z\d_]*(?:\.[a-z][a-z\d_]*)*)::dom-engine-->)/gi
-const text = /^(dom-engine::(\??)([a-z][a-z\d_]*(?:\.[a-z][a-z\d_]*)*)::dom-engine)$/gi
+const identifier = /{((\??)([a-z]\w*(?:\.[a-z]\w*)*))}/g
+const attribute = /(<!--dom-engine::(\??)([a-z]\w*(?:\.[a-z]\w*)*)::dom-engine-->)/g
+const text = /^(dom-engine::(\??)([a-z]\w*(?:\.[a-z]\w*)*)::dom-engine)$/g
+const escaped = /^(&lt;!--dom-engine::(\??)([a-z]\w*(?:\.[a-z]\w*)*)::dom-engine--&gt;)/g
 
 const html = source => context.policy?.createHTML(source) ?? source
 
@@ -33,7 +34,14 @@ const tokenize = node => {
   const map = new Map()
 
   for (const [key, current] of search(node).entries()) {
-    if (current.nodeType === 1) {
+
+    if (current.nodeName === 'TITLE') {
+      const tokens = identify(escaped, current.innerHTML)
+
+      if (tokens.length) {
+        map.set(key, { tokens })
+      }
+    } else if (current.nodeType === 1) {
       const attributes = new Map()
 
       for (const { name, value } of current.attributes) {
@@ -50,8 +58,7 @@ const tokenize = node => {
         })
       }
     } else {
-      const { nodeValue } = current
-      const tokens = identify(text, nodeValue)
+      const tokens = identify(text, current.nodeValue)
 
       if (tokens.length) {
         map.set(key, { tokens })
@@ -171,10 +178,10 @@ const value = (tokens, node, name, template) => {
 
 const content = (tokens, node, template) => {
   const nodes = []
-  let { nodeValue } = node
+  let [target, content] = pick(node)
 
   for (const { identifier, key, optional } of tokens) {
-    const [prefix] = nodeValue.split(identifier)
+    const [prefix] = content.split(identifier)
     const value = resolve(key, optional, template)
     const replacements = Array.isArray(value)
       ? value
@@ -183,10 +190,18 @@ const content = (tokens, node, template) => {
         : [value]
 
     nodes.push(prefix, ...replacements.filter(isFilled).map(child))
-    nodeValue = nodeValue.replace(`${prefix}${identifier}`, '')
+    content = content.replace(`${prefix}${identifier}`, '')
+  }
+
+  target.replaceWith(...nodes, content)
+}
+
+const pick = node => {
+  if (node.nodeName === 'TITLE') {
+    return [node.firstChild, node.innerHTML]
   }
 
-  node.replaceWith(...nodes, nodeValue)
+  return [node, node.nodeValue]
 }
 
 function child (value) {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lcf.vs/dom-engine",
-  "version": "5.2.3",
+  "version": "5.2.4",
   "description": "A composable DOM based template engine",
   "type": "module",
   "exports": {