72836e7121
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!
2021-01-25 18:01:49 +00:00
e865f63107
fix(html): Allow for nested text nodes in iterables
...
This changes the API from `children` to `childNodes` because `children`
does not include `Text` nodes.
diff --git src/html.ts src/html.ts
index d0578b1..6fe4502 100644
--- src/html.ts
+++ src/html.ts
@@ -19,7 +19,7 @@ function processSubTemplate(part: TemplatePart, value: unknown): boolean {
function processDocumentFragment(part: TemplatePart, value: unknown): boolean {
if (value instanceof DocumentFragment && part instanceof NodeTemplatePart) {
- part.replace((value as unknown) as ChildNode)
+ if (value.childNodes.length) part.replace(...value.childNodes)
return true
}
return false
diff --git test/html.ts test/html.ts
index 6dbfc6c..0ff3ee2 100644
--- test/html.ts
+++ test/html.ts
@@ -40,6 +40,17 @@ describe('render', () => {
render(main(child('Goodbye')), surface)
expect(surface.innerHTML).to.equal('<div><span>Goodbye</span></div>')
})
+
+ it('can nest document fragments and text nodes', () => {
+ const main = frag => html`<span>${frag}</span>`
+ const fragment = document.createDocumentFragment()
+ fragment.append(new Text('Hello World'))
+ render(main(fragment), surface)
+ expect(surface.innerHTML).to.equal('<span>Hello World</span>')
+ fragment.append(document.createTextNode('Hello Universe!'))
+ render(main(fragment), surface)
+ expect(surface.innerHTML).to.equal('<span>Hello Universe!</span>')
+ })
})
describe('iterables', () => {
2021-01-19 16:59:21 +00:00
Keith Cirkel
Dusty Greif