From ea857e675d7e2ddf03f8b6112539bc3962ab7cd3 Mon Sep 17 00:00:00 2001
From: Matthew Phillips <matthew@matthewphillips.info>
Date: Mon, 19 Apr 2021 15:14:53 -0400
Subject: [PATCH] Fix visible components (#112)

* Fix visible components

The wrapper component is grabbed with querySelector, so no need for `.item()` call which was throwing.

* Add back in display contents
---
 src/frontend/render/renderer.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/frontend/render/renderer.ts b/src/frontend/render/renderer.ts
index 00b4f56227..2c3d972ede 100644
--- a/src/frontend/render/renderer.ts
+++ b/src/frontend/render/renderer.ts
@@ -31,7 +31,7 @@ export function createRenderer(renderer: SupportedComponentRenderer) {
       } catch (e) {
         value = '';
       }
-      value = `<div data-astro-id="${innerContext['data-astro-id']}">${value}</div>`;
+      value = `<div data-astro-id="${innerContext['data-astro-id']}" style="dislplay: contents">${value}</div>`;
 
       const script = `
         ${typeof wrapperStart === 'function' ? wrapperStart(innerContext) : wrapperStart}
@@ -55,7 +55,7 @@ export function createRenderer(renderer: SupportedComponentRenderer) {
     idle: createDynamicRender('requestIdleCallback(async () => {', '})'),
     visible: createDynamicRender(
       'const o = new IntersectionObserver(async ([entry]) => { if (!entry.isIntersecting) { return; } o.disconnect();',
-      ({ root }) => `}); Array.from(${root}.item(0).children).forEach(child => o.observe(child))`
+      ({ root }) => `}); Array.from(${root}.children).forEach(child => o.observe(child))`
     ),
   };
 }