Bug: Revert script inject due to issues with Lit duplication causing hydration errors

Author: jlukic

CHANGELOG.md

@@ -1,4 +1,9 @@
 
+## 5.3.0
+
+### Changes
+- This reverts to using `before-hydration` from `5.1.x` releases. Astro 6 has landed `before-hydration` fix in [6.0.5](https://github.com/withastro/astro/releases/tag/astro%406.0.5), and this should be stable in older versions of Astro 5.
+
 ## 5.2.0
 
 ### Changes

dist/index.js

@@ -32,10 +32,7 @@ function index_default() {
           "head-inline",
           readFileSync(new URL("../client-shim.min.js", import.meta.url), { encoding: "utf-8" })
         );
-        injectScript(
-          "head-inline",
-          readFileSync(new URL("../hydration-support.min.js", import.meta.url), { encoding: "utf-8" })
-        );
+        injectScript("before-hydration", `import '@semantic-ui/astro-lit/hydration-support.js';`);
         addRenderer({
           name: "@semantic-ui/astro-lit",
           serverEntrypoint: "@semantic-ui/astro-lit/server.js",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@semantic-ui/astro-lit",
-  "version": "5.2.0",
+  "version": "5.3.0",
   "description": "Use Lit components with Astro",
   "type": "module",
   "types": "./dist/index.d.ts",
@@ -29,7 +29,6 @@
     "client-shim.js",
     "client-shim.min.js",
     "hydration-support.js",
-    "hydration-support.min.js",
     "server.js",
     "server.d.ts",
     "server-shim.js"
@@ -38,9 +37,10 @@
     "build": "npm run build:js && npm run build:types && npm run build:minify",
     "build:js": "esbuild src/index.ts src/client.ts --format=esm --bundle --platform=node --outdir=dist",
     "build:types": "tsc src/client.ts --declaration --emitDeclarationOnly --skipLibCheck --outDir ./dist",
-    "build:minify": "esbuild client-shim.js --minify --outfile=client-shim.min.js && esbuild hydration-support.js --bundle --format=iife --minify --outfile=hydration-support.min.js",
+    "build:minify": "esbuild client-shim.js --minify --outfile=client-shim.min.js",
     "dev": "npm run build -- --watch",
-    "test": "node test/server.test.js && node test/sass.test.js"
+    "test": "node test/server.test.js && node test/sass.test.js",
+    "prepublishOnly": "npm run build"
   },
   "dependencies": {
     "@lit-labs/ssr": "^3.3.1",

src/index.ts

@@ -36,14 +36,8 @@ export default function (): AstroIntegration {
 					'head-inline',
 					readFileSync(new URL('../client-shim.min.js', import.meta.url), { encoding: 'utf-8' })
 				);
-				// Inject hydration support as a blocking script to guarantee it runs
-				// before any module scripts can load lit-element. This avoids a race
-				// condition where lit-element evaluates before the hydration patches
-				// are registered on globalThis.litElementHydrateSupport.
-				injectScript(
-					'head-inline',
-					readFileSync(new URL('../hydration-support.min.js', import.meta.url), { encoding: 'utf-8' })
-				);
+				// Inject the hydration code, before a component is hydrated.
+				injectScript('before-hydration', `import '@semantic-ui/astro-lit/hydration-support.js';`);
 				// Add the lit renderer so that Astro can understand lit components.
 				addRenderer({
 					name: '@semantic-ui/astro-lit',