Resolving serialization

Lcfvs · Dec 10, 2020 · d1380e7 · d1380e7
1 parent ee0dbee
commit d1380e7
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 68 deletions.
diff --git a/lib/dom.js b/lib/dom.js
@@ -31,14 +31,8 @@ function filler (template, node) {
 }
 
 function fill (template) {
-  const {
-    [symbols.node]: node,
-    [symbols.window]: window
-  } = template
-  const {
-    document,
-    Node
-  } = window
+  const { [symbols.node]: node, [symbols.window]: window } = template
+  const { document, Node } = window
   const value = node.nodeType === Node.TEXT_NODE
     ? resolve(node.textContent, template)
     : node.nodeValue.replace(identifier, content => resolve(content, template))
@@ -59,24 +53,18 @@ function filter (node) {
 }
 
 function find (templates, template) {
-  const {
-    [symbols.node]: node,
-    [symbols.window]: window
-  } = template
+  const { [symbols.node]: node, [symbols.window]: window } = template
   const { nodeType } = node
   const { Node } = window
-  const {
-    attributes = [],
-    childNodes = []
-  } = node
+  const { attributes = [], childNodes = [] } = node
 
   return [
     ...templates,
     ...nodeType === Node.TEXT_NODE
       ? [node].filter(filter)
       : [
-        ...attributes.filter(filter),
-        ...childNodes.map(map, template).reduce(find, [])
+        ...[...attributes].filter(filter),
+        ...[...childNodes].map(map, template).reduce(find, [])
       ]
   ]
 }
@@ -93,15 +81,9 @@ function map (node) {
 }
 
 function replace (template) {
-  const {
-    [symbols.node]: node,
-    [symbols.window]: window
-  } = template
+  const { [symbols.node]: node, [symbols.window]: window } = template
   const { document } = window
-  const {
-    parentNode,
-    textContent
-  } = node
+  const { parentNode, textContent } = node
   const container = document.createDocumentFragment()
   const matches = textContent.match(identifier)
 
@@ -132,6 +114,10 @@ function resolve (content, template) {
     }, template)
 }
 
+function content (fragment) {
+  return fragment.childNodes[0].content
+}
+
 function render (template) {
   const { [symbols.node]: node } = template
   const clone = from(template, node.cloneNode(true))
@@ -144,14 +130,17 @@ function wrap (source) {
   return `<template>${source}</template>`
 }
 
+function parse (document, source) {
+  return document
+    .createRange()
+    .createContextualFragment(source)
+}
+
 function tree (fragment) {
   const [...templates] = fragment.querySelectorAll('template')
 
   templates.forEach(template => {
-    const {
-      content,
-      parentNode
-    } = template
+    const { content, parentNode } = template
 
     tree(content)
     parentNode.replaceChild(content, template)
@@ -160,68 +149,44 @@ function tree (fragment) {
   return fragment
 }
 
-function rewrite (source, match) {
+function rewrite (source, match) {//console.log(source)
   return source.replace(match, wrap(match))
 }
 
-function parse (parser, doctype, contents) {
-  const document = parser.parseFromString(`${doctype}${contents}`, 'text/html')
-
-  if (doctype.length) {
-    document.write(contents)
-
-    return document.documentElement
-  } else {
-    return document.createRange()
-      .createContextualFragment(contents)
-  }
-}
-
-function dom ({
-  DOMParser,
-  NodeFilter
-}, source) {
+function dom ({ document, NodeFilter }, source) {
   let [, doctype, contents] = source.match(parts)
-  const parser = new DOMParser()
-  const fragment = parse(parser, doctype, contents)
-  const { ownerDocument } = fragment
-  const walker = ownerDocument.createTreeWalker(fragment, NodeFilter.SHOW_TEXT)
+  const fragment = parse(document, contents)
+  const walker = document.createTreeWalker(fragment, NodeFilter.SHOW_TEXT)
 
   while (true) {
     const node = walker.nextNode()
 
-    if (!node || node.parentNode.nodeName === 'TITLE') {
+    if (!node) {
       break
     }
 
-    const matches = node.nodeValue.match(identifier) || []
+    const { nodeValue } = node
+    const matches = nodeValue.match(identifier) || []
 
     contents = matches.reduce(rewrite, contents)
   }
 
-  if (!doctype.length) {
-    contents = wrap(contents)
-  }
-
   return {
     doctype,
-    node: tree(parse(parser, doctype, contents))
+    template: tree(parse(document, wrap(contents)))
   }
 }
 
 export function template (window, source = '', { ...data } = {}) {
-  const {
-    doctype,
-    node
-  } = dom(window, source)
+  const { doctype, template } = dom(window, source)
 
   return from({
     ...data,
     ...proto,
     [symbols.doctype]: doctype,
     [symbols.source]: source,
     [symbols.window]: window
-  }, node)
+  }, template)
 }
 
 export function serialize (template) {
@@ -230,6 +195,7 @@ export function serialize (template) {
     [symbols.window]: { XMLSerializer }
   } = template
 
-  return new XMLSerializer()
-    .serializeToString(`${doctype}${render(template)}`)
+  const source = new XMLSerializer().serializeToString(render(template))
+
+  return `${doctype}${source}`
 }
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@lcf.vs/dom-engine",
-  "version": "1.1.1",
+  "version": "1.1.3",
   "description": "A composable DOM based template engine",
   "type": "module",
   "main": "lib/engine.js",