fix: do not use development bundling urls in non development context (#98)

* fix: do not use development bundling urls in non development context

* test: fix tests

Author: digitalsadhu

lib/plugin.js

@@ -114,11 +114,11 @@ export default fp(
         await f.register(compressionPn, { enabled: compression });
         await f.register(errorsPn);
         await f.register(assetsPn, { base, cwd });
-        await f.register(bundlerPn, { cwd });
+        await f.register(bundlerPn, { cwd, development });
         await f.register(exceptionsPn, { grace, development });
         await f.register(hydratePn, { appName: name, base: assetBase, development, prefix });
         await f.register(csrPn, { appName: name, base: assetBase, development, prefix });
-        await f.register(ssrPn, { appName: name, base, prefix });
+        await f.register(ssrPn, { appName: name, base, prefix, development });
         await f.register(importElementPn, { appName: name, development, plugins, cwd });
         await f.register(localePn, { locale, cwd });
         await f.register(metricsPn);

plugins/bundler.js

@@ -31,7 +31,9 @@ const build = async ({ entryPoints = [] } = {}) => {
  * @typedef {import("fastify").FastifyRequest<{Params: { "*": string }}>} Request
  */
 
-export default fp(async function bundler(fastify, { cwd = process.cwd() }) {
+export default fp(async function bundler(fastify, { cwd = process.cwd(), development = false }) {
+  if (!development) return;
+
   await fastify.register(etag, { algorithm: "fnv1a" });
 
   fastify.get("/_/dynamic/modules/*", async (/** @type {Request} */ request, reply) => {

plugins/hydrate.js

@@ -5,7 +5,10 @@ import { joinURLPathSegments } from "../lib/utils.js";
 export default fp(async function hydratePlugin(fastify, { appName = "", base = "/", development = false, prefix = "/" }) {
   fastify.decorate("hydrate", function hydrate(type, template) {
     const elementPath = joinURLPathSegments(prefix, `/_/dynamic/files/${type}.js`);
-    const shadowRootPath = joinURLPathSegments(prefix, `/_/dynamic/modules/@webcomponents/template-shadowroot/template-shadowroot.js`);
+    let shadowRootPath = `${base}/client/template-shadowroot.js`;
+    if (development) {
+      shadowRootPath = joinURLPathSegments(prefix, `/_/dynamic/modules/@webcomponents/template-shadowroot/template-shadowroot.js`);
+    }
     // user provided markup, SSR'd
     const ssrMarkup = Array.from(ssr(template)).join("");
     // polyfill for browsers that don't support declarative shadow dom

plugins/ssr.js

@@ -2,9 +2,12 @@ import { render } from "@lit-labs/ssr";
 import fp from "fastify-plugin";
 import { joinURLPathSegments } from "../lib/utils.js";
 
-export default fp(async function ssrPlugin(fastify, { appName = "", prefix = "" }) {
+export default fp(async function ssrPlugin(fastify, { appName = "", base = "/", prefix = "", development = false }) {
   fastify.decorate("ssr", function ssr(type, template) {
-    const shadowRootPath = joinURLPathSegments(prefix, `/_/dynamic/modules/@webcomponents/template-shadowroot/template-shadowroot.js`);
+    let shadowRootPath = `${base}/client/template-shadowroot.js`;
+    if (development) {
+      shadowRootPath = joinURLPathSegments(prefix, `/_/dynamic/modules/@webcomponents/template-shadowroot/template-shadowroot.js`);
+    }
     // user provided markup, SSR'd
     const ssrMarkup = Array.from(render(template)).join("");
     // polyfill for browsers that don't support declarative shadow dom

test/plugins/plugins-bundler.test.js

@@ -25,7 +25,7 @@ afterEach(async (t) => {
 
 test("dependency in node_modules folder bundled and served via url request", async (t) => {
   const app = fastify({ logger: false });
-  await app.register(plugin, { cwd: tmp, enabled: true });
+  await app.register(plugin, { cwd: tmp, development: true });
   const address = await app.listen({ port: 0 });
   const result = await fetch(`${address}/_/dynamic/modules/test-dep`);
   const response = await result.text();
@@ -52,7 +52,7 @@ test("dependency bundled and served via url request: prefixed plugin", async (t)
   const app = fastify({ logger: false });
   await app.register(
     async () => {
-      await app.register(plugin, { cwd: tmp, enabled: true });
+      await app.register(plugin, { cwd: tmp, development: true });
     },
     { prefix: "/test" }
   );
@@ -64,7 +64,7 @@ test("dependency bundled and served via url request: prefixed plugin", async (t)
 
 test("non-existent dependency results in a 404 error", async (t) => {
   const app = fastify({ logger: false });
-  await app.register(plugin, { cwd: tmp, enabled: true });
+  await app.register(plugin, { cwd: tmp, development: true });
   const address = await app.listen({ port: 0 });
   const result = await fetch(`${address}/_/dynamic/modules/does-not-exist`);
   const response = await result.json();