Add hydration to Solid renderer (#1479)

* feat: add hydration to Solid renderer

* fix: intersection observer, move script to the end

1 files changed, 3 insertions, 8 deletions

diff --git a/packages/renderers/renderer-solid/client.js b/packages/renderers/renderer-solid/client.js
index 815f3d8e5..f4cdb4ead 100644
--- a/packages/renderers/renderer-solid/client.js
+++ b/packages/renderers/renderer-solid/client.js
@@ -1,16 +1,11 @@
-import { createComponent } from 'solid-js';
-import { render } from 'solid-js/web';
+import { hydrate, createComponent } from 'solid-js/web';
 
 export default (element) => (Component, props, childHTML) => {
-  // Solid's `render` does not replace the element's children.
-  // Deleting the root's children is necessary before calling `render`.
-  element.replaceChildren();
-
   const children = document.createElement('astro-fragment');
   children.innerHTML = childHTML;
 
-  // Using Solid's `render` method ensures that a `root` is created
+  // Using Solid's `hydrate` method ensures that a `root` is created
   // in order to properly handle reactivity. It also handles
   // components that are not native HTML elements.
-  render(() => createComponent(Component, { ...props, children }), element);
+  hydrate(() => createComponent(Component, { ...props, children }), element);
 };