fix(html): only call update() after initial render

Calling update on the create step meant this was initializing some
DocumentFragments twice, which causes them to empty out their contents,
therefore elements were not getting rendered correctly. Aside from that,
it's unnecessary work to call update with exactly the same contents!

Author: keithamus

src/html.ts

@@ -95,6 +95,7 @@ export class TemplateResult {
       } else {
         element.appendChild(instance)
       }
+      return
     }
     renderedTemplateInstances.get(element)!.update((this.values as unknown) as Record<string, unknown>)
   }

test/html.ts

@@ -16,6 +16,22 @@ describe('render', () => {
     surface = document.createElement('section')
   })
 
+  it('calls `createCallback` on first render', () => {
+    const main = (x = null) => html`<div class="${x}"></div>`
+    let called = false
+    const instance = main()
+    instance.processor = {
+      processCallback() {
+        throw new Error('Expected processCallback to not be called')
+      },
+      createCallback() {
+        called = true
+      }
+    }
+    instance.renderInto(surface)
+    expect(called).to.equal(true)
+  })
+
   it('memoizes by TemplateResult#template, updating old templates with new values', () => {
     const main = (x = null) => html`<div class="${x}"></div>`
     render(main('foo'), surface)
@@ -51,6 +67,17 @@ describe('render', () => {
       render(main(fragment), surface)
       expect(surface.innerHTML).to.equal('<span>Hello Universe!</span>')
     })
+
+    it('renders DocumentFragments nested in sub templates nested in arrays', () => {
+      const sub = () => {
+        const frag = document.createDocumentFragment()
+        frag.appendChild(document.createElement('div'))
+        return html`<span>${frag}</span>`
+      }
+      const main = () => html`<div>${[sub(), sub()]}</div>`
+      render(main(), surface)
+      expect(surface.innerHTML).to.contain('<div><span><div></div></span><span><div></div></span></div>')
+    })
   })
 
   describe('iterables', () => {