Merge pull request #7 from github/refactor-move-render-logic-into-cla…

…ss-renderinto refactor: move `render()` logic into class `renderInto()`
github · Jan 19, 2021 · 1f7f3be · 1f7f3be
2 parents 469b5d5 + c768956
commit 1f7f3be
Showing 1 changed file with 20 additions and 15 deletions.
diff --git a/src/html.ts b/src/html.ts
@@ -11,7 +11,7 @@ import type {TemplatePart, TemplateTypeInit} from '@github/template-parts'
 
 function processSubTemplate(part: TemplatePart, value: unknown): boolean {
   if (value instanceof TemplateResult && part instanceof NodeTemplatePart) {
-    render(value, part)
+    value.renderInto(part)
     return true
   }
   return false
@@ -36,7 +36,7 @@ function processIterable(part: TemplatePart, value: unknown): boolean {
     for (const item of value) {
       if (item instanceof TemplateResult) {
         const fragment = document.createDocumentFragment()
-        render(item, fragment)
+        item.renderInto(fragment)
         nodes.push(...fragment.children)
       } else if (item instanceof DocumentFragment) {
         nodes.push(...item.children)
@@ -63,6 +63,8 @@ export function processPart(part: TemplatePart, value: unknown): void {
 }
 
 const templates = new WeakMap<TemplateStringsArray, HTMLTemplateElement>()
+const renderedTemplates = new WeakMap<Node | NodeTemplatePart, HTMLTemplateElement>()
+const renderedTemplateInstances = new WeakMap<Node | NodeTemplatePart, TemplateInstance>()
 export class TemplateResult {
   constructor(
     public readonly strings: TemplateStringsArray,
@@ -81,25 +83,28 @@ export class TemplateResult {
       return template
     }
   }
+
+  renderInto(element: Node | NodeTemplatePart): void {
+    const template = this.template
+    if (renderedTemplates.get(element) !== template) {
+      renderedTemplates.set(element, template)
+      const instance = new TemplateInstance(template, this.values, this.processor)
+      renderedTemplateInstances.set(element, instance)
+      if (element instanceof NodeTemplatePart) {
+        element.replace(...instance.children)
+      } else {
+        element.appendChild(instance)
+      }
+    }
+    renderedTemplateInstances.get(element)!.update((this.values as unknown) as Record<string, unknown>)
+  }
 }
 
 const defaultProcessor = createProcessor(processPart)
 export function html(strings: TemplateStringsArray, ...values: unknown[]): TemplateResult {
   return new TemplateResult(strings, values, defaultProcessor)
 }
 
-const renderedTemplates = new WeakMap<Node | NodeTemplatePart, HTMLTemplateElement>()
-const renderedTemplateInstances = new WeakMap<Node | NodeTemplatePart, TemplateInstance>()
 export function render(result: TemplateResult, element: Node | NodeTemplatePart): void {
-  if (renderedTemplates.get(element) !== result.template) {
-    renderedTemplates.set(element, result.template)
-    const instance = new TemplateInstance(result.template, result.values, result.processor)
-    renderedTemplateInstances.set(element, instance)
-    if (element instanceof NodeTemplatePart) {
-      element.replace(...instance.children)
-    } else {
-      element.appendChild(instance)
-    }
-  }
-  renderedTemplateInstances.get(element)!.update((result.values as unknown) as Record<string, unknown>)
+  result.renderInto(element)
 }