keycloakify 10.0.0-rc.14 → 10.0.0-rc.140

package/src/bin/keycloakify/generateFtl/generateFtl.ts

@@ -1,34 +1,48 @@
-import cheerio from "cheerio";
-import { replaceImportsInJsCode } from "../replacers/replaceImportsInJsCode";
-import { generateCssCodeToDefineGlobals } from "../replacers/replaceImportsInCssCode";
-import { replaceImportsInInlineCssCode } from "../replacers/replaceImportsInInlineCssCode";
+import * as cheerio from "cheerio";
+import {
+    replaceImportsInJsCode,
+    BuildContextLike as BuildContextLike_replaceImportsInJsCode
+} from "../replacers/replaceImportsInJsCode";
+import {
+    replaceImportsInCssCode,
+    BuildContextLike as BuildContextLike_replaceImportsInCssCode
+} from "../replacers/replaceImportsInCssCode";
 import * as fs from "fs";
 import { join as pathJoin } from "path";
-import type { BuildOptions } from "../../shared/buildOptions";
+import type { BuildContext } from "../../shared/buildContext";
 import { assert } from "tsafe/assert";
-import { type ThemeType, nameOfTheGlobal, basenameOfTheKeycloakifyResourcesDir, resources_common } from "../../shared/constants";
+import {
+    type ThemeType,
+    BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR,
+    RESOURCES_COMMON
+} from "../../shared/constants";
 import { getThisCodebaseRootDirPath } from "../../tools/getThisCodebaseRootDirPath";
 
-export type BuildOptionsLike = {
-    bundler: "vite" | "webpack";
-    themeVersion: string;
-    urlPathname: string | undefined;
-    reactAppBuildDirPath: string;
-    assetsDirPath: string;
-};
+export type BuildContextLike = BuildContextLike_replaceImportsInJsCode &
+    BuildContextLike_replaceImportsInCssCode & {
+        urlPathname: string | undefined;
+        themeVersion: string;
+        kcContextExclusionsFtlCode: string | undefined;
+    };
 
-assert<BuildOptions extends BuildOptionsLike ? true : false>();
+assert<BuildContext extends BuildContextLike ? true : false>();
 
 export function generateFtlFilesCodeFactory(params: {
     themeName: string;
     indexHtmlCode: string;
-    cssGlobalsToDefine: Record<string, string>;
-    buildOptions: BuildOptionsLike;
+    buildContext: BuildContextLike;
     keycloakifyVersion: string;
     themeType: ThemeType;
     fieldNames: string[];
 }) {
-    const { themeName, cssGlobalsToDefine, indexHtmlCode, buildOptions, keycloakifyVersion, themeType, fieldNames } = params;
+    const {
+        themeName,
+        indexHtmlCode,
+        buildContext,
+        keycloakifyVersion,
+        themeType,
+        fieldNames
+    } = params;
 
     const $ = cheerio.load(indexHtmlCode);
 
@@ -38,7 +52,10 @@ export function generateFtlFilesCodeFactory(params: {
 
             assert(jsCode !== null);
 
-            const { fixedJsCode } = replaceImportsInJsCode({ jsCode, buildOptions });
+            const { fixedJsCode } = replaceImportsInJsCode({
+                jsCode,
+                buildContext
+            });
 
             $(element).text(fixedJsCode);
         });
@@ -48,9 +65,10 @@ export function generateFtlFilesCodeFactory(params: {
 
             assert(cssCode !== null);
 
-            const { fixedCssCode } = replaceImportsInInlineCssCode({
+            const { fixedCssCode } = replaceImportsInCssCode({
                 cssCode,
-                buildOptions
+                cssFileRelativeDirPath: undefined,
+                buildContext
             });
 
             $(element).text(fixedCssCode);
@@ -59,7 +77,8 @@ export function generateFtlFilesCodeFactory(params: {
         (
             [
                 ["link", "href"],
-                ["script", "src"]
+                ["script", "src"],
+                ["script", "data-src"]
             ] as const
         ).forEach(([selector, attrName]) =>
             $(selector).each((...[, element]) => {
@@ -72,46 +91,46 @@ export function generateFtlFilesCodeFactory(params: {
                 $(element).attr(
                     attrName,
                     href.replace(
-                        new RegExp(`^${(buildOptions.urlPathname ?? "/").replace(/\//g, "\\/")}`),
-                        `\${url.resourcesPath}/${basenameOfTheKeycloakifyResourcesDir}/`
+                        new RegExp(
+                            `^${(buildContext.urlPathname ?? "/").replace(/\//g, "\\/")}`
+                        ),
+                        `\${xKeycloakify.resourcesPath}/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}/`
                     )
                 );
             })
         );
-
-        if (Object.keys(cssGlobalsToDefine).length !== 0) {
-            $("head").prepend(
-                [
-                    "",
-                    "<style>",
-                    generateCssCodeToDefineGlobals({
-                        cssGlobalsToDefine,
-                        buildOptions
-                    }).cssCodeToPrependInHead,
-                    "</style>",
-                    ""
-                ].join("\n")
-            );
-        }
     }
 
     //FTL is no valid html, we can't insert with cheerio, we put placeholder for injecting later.
-    const ftlObjectToJsCodeDeclaringAnObject = fs
+    const kcContextDeclarationTemplateFtl = fs
         .readFileSync(
-            pathJoin(getThisCodebaseRootDirPath(), "src", "bin", "keycloakify", "generateFtl", "ftl_object_to_js_code_declaring_an_object.ftl")
+            pathJoin(
+                getThisCodebaseRootDirPath(),
+                "src",
+                "bin",
+                "keycloakify",
+                "generateFtl",
+                "kcContextDeclarationTemplate.ftl"
+            )
         )
         .toString("utf8")
-        .match(/^<script>const _=((?:.|\n)+)<\/script>[\n]?$/)![1]
-        .replace("FIELD_NAMES_eKsIY4ZsZ4xeM", fieldNames.map(name => `"${name}"`).join(", "))
-        .replace("KEYCLOAKIFY_VERSION_xEdKd3xEdr", keycloakifyVersion)
-        .replace("KEYCLOAKIFY_THEME_VERSION_sIgKd3xEdr3dx", buildOptions.themeVersion)
-        .replace("KEYCLOAKIFY_THEME_TYPE_dExKd3xEdr", themeType)
-        .replace("KEYCLOAKIFY_THEME_NAME_cXxKd3xEer", themeName)
-        .replace("RESOURCES_COMMON_cLsLsMrtDkpVv", resources_common);
+        .replace("{{themeType}}", themeType)
+        .replace("{{themeName}}", themeName)
+        .replace("{{keycloakifyVersion}}", keycloakifyVersion)
+        .replace("{{themeVersion}}", buildContext.themeVersion)
+        .replace("{{fieldNames}}", fieldNames.map(name => `"${name}"`).join(", "))
+        .replace("{{RESOURCES_COMMON}}", RESOURCES_COMMON)
+        .replace(
+            "{{userDefinedExclusions}}",
+            buildContext.kcContextExclusionsFtlCode ?? ""
+        );
 
-    const ftlObjectToJsCodeDeclaringAnObjectPlaceholder = '{ "x": "vIdLqMeOed9sdLdIdOxdK0d" }';
+    const ftlObjectToJsCodeDeclaringAnObjectPlaceholder =
+        '{ "x": "vIdLqMeOed9sdLdIdOxdK0d" }';
 
-    $("head").prepend(`<script>\nwindow.${nameOfTheGlobal}=${ftlObjectToJsCodeDeclaringAnObjectPlaceholder}</script>`);
+    $("head").prepend(
+        `<script>\n${ftlObjectToJsCodeDeclaringAnObjectPlaceholder}\n</script>`
+    );
 
     // Remove part of the document marked as ignored.
     {
@@ -119,7 +138,9 @@ export function generateFtlFilesCodeFactory(params: {
 
         startTags.each((...[, startTag]) => {
             const $startTag = $(startTag);
-            const $endTag = $startTag.nextAll('meta[name="keycloakify-ignore-end"]').first();
+            const $endTag = $startTag
+                .nextAll('meta[name="keycloakify-ignore-end"]')
+                .first();
 
             if ($endTag.length) {
                 let currentNode = $startTag.next();
@@ -146,9 +167,14 @@ export function generateFtlFilesCodeFactory(params: {
         let ftlCode = $.html();
 
         Object.entries({
-            [ftlObjectToJsCodeDeclaringAnObjectPlaceholder]: ftlObjectToJsCodeDeclaringAnObject,
-            "PAGE_ID_xIgLsPgGId9D8e": pageId
-        }).map(([searchValue, replaceValue]) => (ftlCode = ftlCode.replace(searchValue, replaceValue)));
+            [ftlObjectToJsCodeDeclaringAnObjectPlaceholder]:
+                kcContextDeclarationTemplateFtl,
+            "{{pageId}}": pageId,
+            "{{ftlTemplateFileName}}": pageId
+        }).map(
+            ([searchValue, replaceValue]) =>
+                (ftlCode = ftlCode.replace(searchValue, replaceValue))
+        );
 
         return { ftlCode };
     }