fix(isr): fix breaking changes with the new modifyGeneratedHtml config (#1766)

eneajaho · web-flow · commit 0bb7443a2f51 · 2024-08-31T21:59:47.000+02:00
diff --git a/apps/ssr-isr/server.ts b/apps/ssr-isr/server.ts
@@ -32,6 +32,7 @@ export function app(): express.Express {
     bootstrap,
     commonEngine,
     modifyGeneratedHtml: defaultModifyGeneratedHtml,
+
     // cache: fsCacheHandler,
   });
 
@@ -68,14 +69,11 @@ export function app(): express.Express {
 const defaultModifyGeneratedHtml: ModifyHtmlCallbackFn = (
   req: Request,
   html: string,
-  revalidateTime?: number | null,
 ): string => {
   const time = new Date().toISOString().replace(/T/, ' ').replace(/\..+/, '');
 
   let msg = '<!-- ';
   msg += `\n🚀 ISR: Served from cache! \n⌛ Last updated: ${time}. `;
-  if (revalidateTime)
-    msg += `\n⏭️ Next refresh is after ${revalidateTime} seconds. `;
   msg += ' \n-->';
   html = html.replace('Original content', 'Modified content');
   return html + msg;
diff --git a/libs/isr/models/src/isr-handler-config.ts b/libs/isr/models/src/isr-handler-config.ts
@@ -141,6 +141,15 @@ export type ModifyHtmlCallbackFn = (
 
 export interface RenderConfig {
   providers?: Provider[];
+
+  // TODO: remove this in a major as a BREAKING CHANGE (we can provide some schematics to fix the breaking change maybe)
+  /**
+   * This callback lets you hook into the generated html and provide any modifications
+   * necessary on-the-fly.
+   * Use with caution as this may lead to a performance loss on serving the html.
+   * @deprecated
+   */
+  modifyGeneratedHtml?: (req: Request, html: string) => string;
 }
 
 /**
diff --git a/libs/isr/server/src/cache-generation.ts b/libs/isr/server/src/cache-generation.ts
@@ -22,6 +22,7 @@ export class CacheGeneration {
     public cache: CacheHandler,
     public logger: ISRLogger,
   ) {}
+
   async generate(
     req: Request,
     res: Response,
@@ -38,6 +39,7 @@ export class CacheGeneration {
 
     return this.generateWithCacheKey(req, res, cacheKey, providers, mode);
   }
+
   async generateWithCacheKey(
     req: Request,
     res: Response,
@@ -58,6 +60,7 @@ export class CacheGeneration {
 
       this.urlsOnHold.push(cacheKey);
     }
+
     const renderUrlConfig: RenderUrlConfig = {
       req,
       res,
@@ -69,6 +72,7 @@ export class CacheGeneration {
       browserDistFolder: this.isrConfig.browserDistFolder,
       inlineCriticalCss: this.isrConfig.inlineCriticalCss,
     };
+
     try {
       const html = await renderUrl(renderUrlConfig);
       const { revalidate, errors } = getRouteISRDataFromHTML(html);
diff --git a/libs/isr/server/src/isr-handler.ts b/libs/isr/server/src/isr-handler.ts
@@ -2,6 +2,7 @@ import {
   CacheHandler,
   InvalidateConfig,
   ISRHandlerConfig,
+  ModifyHtmlCallbackFn,
   RenderConfig,
   ServeFromCacheConfig,
   VariantRebuildItem,
@@ -228,6 +229,23 @@ export class ISRHandler {
     next: NextFunction,
     config?: RenderConfig,
   ): Promise<Response | void> {
+    // TODO: remove this in a major as a BREAKING CHANGE
+    if (config?.modifyGeneratedHtml) {
+      if (this.isrConfig.modifyGeneratedHtml !== undefined) {
+        console.warn(
+          'You can only specify `modifyGeneratedHtml` once. The one in render function will be removed in the next version.',
+        );
+      }
+      const patchedModifyFn: ModifyHtmlCallbackFn = (
+        req: Request,
+        html: string,
+        validate?: number | null,
+      ) => {
+        return config!.modifyGeneratedHtml!(req, html);
+      };
+      this.isrConfig['modifyGeneratedHtml'] = patchedModifyFn;
+    }
+
     try {
       const result = await this.cacheGeneration.generate(
         req,
diff --git a/libs/isr/server/src/modify-generated-html.ts b/libs/isr/server/src/modify-generated-html.ts
@@ -1,5 +1,5 @@
+import { ModifyHtmlCallbackFn } from '@rx-angular/isr/models';
 import { Request } from 'express';
-import { ModifyHtmlCallbackFn } from '../../models/src';
 
 export const defaultModifyGeneratedHtml: ModifyHtmlCallbackFn = (
   req: Request,
