keycloakify 6.0.0-beta.0 → 6.0.0-beta.10

package/src/bin/{build-keycloak-theme → keycloakify}/generateJavaStackFiles.ts

@@ -1,37 +1,39 @@
-import * as url from "url";
 import * as fs from "fs";
 import { join as pathJoin, dirname as pathDirname } from "path";
+import { assert } from "tsafe/assert";
+import { Reflect } from "tsafe/Reflect";
+import type { BuildOptions } from "./BuildOptions";
+
+export type BuildOptionsLike = {
+    themeName: string;
+    groupId: string;
+};
+
+{
+    const buildOptions = Reflect<BuildOptions>();
+
+    assert<typeof buildOptions extends BuildOptionsLike ? true : false>();
+}
 
 export function generateJavaStackFiles(params: {
     version: string;
-    themeName: string;
-    homepage?: string;
     keycloakThemeBuildingDirPath: string;
-    doBundleEmailTemplate: boolean;
+    doBundlesEmailTemplate: boolean;
+    buildOptions: BuildOptionsLike;
 }): {
     jarFilePath: string;
 } {
-    const { themeName, version, homepage, keycloakThemeBuildingDirPath, doBundleEmailTemplate } = params;
+    const {
+        version,
+        buildOptions: { groupId, themeName },
+        keycloakThemeBuildingDirPath,
+        doBundlesEmailTemplate
+    } = params;
 
     {
         const { pomFileCode } = (function generatePomFileCode(): {
             pomFileCode: string;
         } {
-            const groupId = (() => {
-                const fallbackGroupId = `there.was.no.homepage.field.in.the.package.json.${themeName}`;
-
-                return (
-                    (!homepage
-                        ? fallbackGroupId
-                        : url
-                              .parse(homepage)
-                              .host?.replace(/:[0-9]+$/, "")
-                              ?.split(".")
-                              .reverse()
-                              .join(".") ?? fallbackGroupId) + ".keycloak"
-                );
-            })();
-
             const artefactId = `${themeName}-keycloak-theme`;
 
             const pomFileCode = [
@@ -45,7 +47,7 @@ export function generateJavaStackFiles(params: {
                 `	<version>${version}</version>`,
                 `	<name>${artefactId}</name>`,
                 `	<description />`,
-                `</project>`,
+                `</project>`
             ].join("\n");
 
             return { pomFileCode };
@@ -69,19 +71,19 @@ export function generateJavaStackFiles(params: {
                         "themes": [
                             {
                                 "name": themeName,
-                                "types": ["login", ...(doBundleEmailTemplate ? ["email"] : [])],
-                            },
-                        ],
+                                "types": ["login", ...(doBundlesEmailTemplate ? ["email"] : [])]
+                            }
+                        ]
                     },
                     null,
-                    2,
+                    2
                 ),
-                "utf8",
-            ),
+                "utf8"
+            )
         );
     }
 
     return {
-        "jarFilePath": pathJoin(keycloakThemeBuildingDirPath, "target", `${themeName}-${version}.jar`),
+        "jarFilePath": pathJoin(keycloakThemeBuildingDirPath, "target", `${themeName}-${version}.jar`)
     };
 }

package/src/bin/{build-keycloak-theme → keycloakify}/generateKeycloakThemeResources.ts

@@ -1,116 +1,147 @@
 import { transformCodebase } from "../tools/transformCodebase";
 import * as fs from "fs";
 import { join as pathJoin, basename as pathBasename } from "path";
-import { replaceImportsInCssCode, replaceImportsFromStaticInJsCode } from "./replaceImportFromStatic";
+import { replaceImportsFromStaticInJsCode } from "./replacers/replaceImportsFromStaticInJsCode";
+import { replaceImportsInCssCode } from "./replacers/replaceImportsInCssCode";
 import { generateFtlFilesCodeFactory, pageIds } from "./generateFtl";
 import { downloadBuiltinKeycloakTheme } from "../download-builtin-keycloak-theme";
 import * as child_process from "child_process";
-import { resourcesCommonPath, resourcesPath, subDirOfPublicDirBasename } from "../../lib/getKcContext/kcContextMocks/urlResourcesPath";
+import { mockTestingResourcesCommonPath, mockTestingResourcesPath, mockTestingSubDirOfPublicDirBasename } from "../mockTestingResourcesPath";
 import { isInside } from "../tools/isInside";
+import type { BuildOptions } from "./BuildOptions";
+import { assert } from "tsafe/assert";
+import { Reflect } from "tsafe/Reflect";
+
+export type BuildOptionsLike = BuildOptionsLike.Standalone | BuildOptionsLike.ExternalAssets;
+
+export namespace BuildOptionsLike {
+    export type Common = {
+        themeName: string;
+        extraPages?: string[];
+        extraThemeProperties?: string[];
+    };
+
+    export type Standalone = Common & {
+        isStandalone: true;
+        urlPathname: string | undefined;
+    };
+
+    export type ExternalAssets = ExternalAssets.SameDomain | ExternalAssets.DifferentDomains;
+
+    export namespace ExternalAssets {
+        export type CommonExternalAssets = Common & {
+            isStandalone: false;
+        };
+
+        export type SameDomain = CommonExternalAssets & {
+            isAppAndKeycloakServerSharingSameDomain: true;
+        };
+
+        export type DifferentDomains = CommonExternalAssets & {
+            isAppAndKeycloakServerSharingSameDomain: false;
+            urlOrigin: string;
+            urlPathname: string | undefined;
+        };
+    }
+}
+
+{
+    const buildOptions = Reflect<BuildOptions>();
+
+    assert<typeof buildOptions extends BuildOptionsLike ? true : false>();
+}
 
 export function generateKeycloakThemeResources(params: {
-    themeName: string;
     reactAppBuildDirPath: string;
     keycloakThemeBuildingDirPath: string;
     keycloakThemeEmailDirPath: string;
-    urlPathname: string;
-    //If urlOrigin is not undefined then it means --externals-assets
-    urlOrigin: undefined | string;
-    extraPagesId: string[];
-    extraThemeProperties: string[];
     keycloakVersion: string;
-}): { doBundleEmailTemplate: boolean } {
-    const {
-        themeName,
-        reactAppBuildDirPath,
-        keycloakThemeBuildingDirPath,
-        keycloakThemeEmailDirPath,
-        urlPathname,
-        urlOrigin,
-        extraPagesId,
-        extraThemeProperties,
-        keycloakVersion,
-    } = params;
-
-    const themeDirPath = pathJoin(keycloakThemeBuildingDirPath, "src", "main", "resources", "theme", themeName, "login");
+    buildOptions: BuildOptionsLike;
+}): { doBundlesEmailTemplate: boolean } {
+    const { reactAppBuildDirPath, keycloakThemeBuildingDirPath, keycloakThemeEmailDirPath, keycloakVersion, buildOptions } = params;
+
+    const themeDirPath = pathJoin(keycloakThemeBuildingDirPath, "src", "main", "resources", "theme", buildOptions.themeName, "login");
 
     let allCssGlobalsToDefine: Record<string, string> = {};
 
     transformCodebase({
-        "destDirPath": urlOrigin === undefined ? pathJoin(themeDirPath, "resources", "build") : reactAppBuildDirPath,
+        "destDirPath": buildOptions.isStandalone ? pathJoin(themeDirPath, "resources", "build") : reactAppBuildDirPath,
         "srcDirPath": reactAppBuildDirPath,
         "transformSourceCode": ({ filePath, sourceCode }) => {
             //NOTE: Prevent cycles, excludes the folder we generated for debug in public/
             if (
-                urlOrigin === undefined &&
+                buildOptions.isStandalone &&
                 isInside({
-                    "dirPath": pathJoin(reactAppBuildDirPath, subDirOfPublicDirBasename),
-                    filePath,
+                    "dirPath": pathJoin(reactAppBuildDirPath, mockTestingSubDirOfPublicDirBasename),
+                    filePath
                 })
             ) {
                 return undefined;
             }
 
-            if (urlOrigin === undefined && /\.css?$/i.test(filePath)) {
+            if (/\.css?$/i.test(filePath)) {
+                if (!buildOptions.isStandalone) {
+                    return undefined;
+                }
+
                 const { cssGlobalsToDefine, fixedCssCode } = replaceImportsInCssCode({
-                    "cssCode": sourceCode.toString("utf8"),
+                    "cssCode": sourceCode.toString("utf8")
                 });
 
                 allCssGlobalsToDefine = {
                     ...allCssGlobalsToDefine,
-                    ...cssGlobalsToDefine,
+                    ...cssGlobalsToDefine
                 };
 
-                return {
-                    "modifiedSourceCode": Buffer.from(fixedCssCode, "utf8"),
-                };
+                return { "modifiedSourceCode": Buffer.from(fixedCssCode, "utf8") };
             }
 
             if (/\.js?$/i.test(filePath)) {
+                if (!buildOptions.isStandalone && buildOptions.isAppAndKeycloakServerSharingSameDomain) {
+                    return undefined;
+                }
+
                 const { fixedJsCode } = replaceImportsFromStaticInJsCode({
                     "jsCode": sourceCode.toString("utf8"),
-                    urlOrigin,
+                    buildOptions
                 });
 
-                return {
-                    "modifiedSourceCode": Buffer.from(fixedJsCode, "utf8"),
-                };
+                return { "modifiedSourceCode": Buffer.from(fixedJsCode, "utf8") };
             }
 
-            return urlOrigin === undefined ? { "modifiedSourceCode": sourceCode } : undefined;
-        },
+            return buildOptions.isStandalone ? { "modifiedSourceCode": sourceCode } : undefined;
+        }
     });
 
-    let doBundleEmailTemplate: boolean;
+    let doBundlesEmailTemplate: boolean;
 
     email: {
         if (!fs.existsSync(keycloakThemeEmailDirPath)) {
             console.log(
                 [
                     `Not bundling email template because ${pathBasename(keycloakThemeEmailDirPath)} does not exist`,
-                    `To start customizing the email template, run: 👉 npx create-keycloak-email-directory 👈`,
-                ].join("\n"),
+                    `To start customizing the email template, run: 👉 npx create-keycloak-email-directory 👈`
+                ].join("\n")
             );
-            doBundleEmailTemplate = false;
+            doBundlesEmailTemplate = false;
             break email;
         }
 
-        doBundleEmailTemplate = true;
+        doBundlesEmailTemplate = true;
 
         transformCodebase({
             "srcDirPath": keycloakThemeEmailDirPath,
-            "destDirPath": pathJoin(themeDirPath, "..", "email"),
+            "destDirPath": pathJoin(themeDirPath, "..", "email")
         });
     }
 
     const { generateFtlFilesCode } = generateFtlFilesCodeFactory({
-        "cssGlobalsToDefine": allCssGlobalsToDefine,
         "indexHtmlCode": fs.readFileSync(pathJoin(reactAppBuildDirPath, "index.html")).toString("utf8"),
-        urlPathname,
-        urlOrigin,
+        "cssGlobalsToDefine": allCssGlobalsToDefine,
+        "buildOptions": buildOptions
     });
 
-    [...pageIds, ...extraPagesId].forEach(pageId => {
+    [...pageIds, ...(buildOptions.extraPages ?? [])].forEach(pageId => {
         const { ftlCode } = generateFtlFilesCode({ pageId });
 
         fs.mkdirSync(themeDirPath, { "recursive": true });
@@ -123,35 +154,35 @@ export function generateKeycloakThemeResources(params: {
 
         downloadBuiltinKeycloakTheme({
             keycloakVersion,
-            "destDirPath": tmpDirPath,
+            "destDirPath": tmpDirPath
         });
 
         const themeResourcesDirPath = pathJoin(themeDirPath, "resources");
 
         transformCodebase({
             "srcDirPath": pathJoin(tmpDirPath, "keycloak", "login", "resources"),
-            "destDirPath": themeResourcesDirPath,
+            "destDirPath": themeResourcesDirPath
         });
 
         const reactAppPublicDirPath = pathJoin(reactAppBuildDirPath, "..", "public");
 
         transformCodebase({
             "srcDirPath": pathJoin(tmpDirPath, "keycloak", "common", "resources"),
-            "destDirPath": pathJoin(themeResourcesDirPath, pathBasename(resourcesCommonPath)),
+            "destDirPath": pathJoin(themeResourcesDirPath, pathBasename(mockTestingResourcesCommonPath))
         });
 
         transformCodebase({
             "srcDirPath": themeResourcesDirPath,
-            "destDirPath": pathJoin(reactAppPublicDirPath, resourcesPath),
+            "destDirPath": pathJoin(reactAppPublicDirPath, mockTestingResourcesPath)
         });
 
-        const keycloakResourcesWithinPublicDirPath = pathJoin(reactAppPublicDirPath, subDirOfPublicDirBasename);
+        const keycloakResourcesWithinPublicDirPath = pathJoin(reactAppPublicDirPath, mockTestingSubDirOfPublicDirBasename);
 
         fs.writeFileSync(
             pathJoin(keycloakResourcesWithinPublicDirPath, "README.txt"),
             Buffer.from(
-                ["This is just a test folder that helps develop", "the login and register page without having to run a Keycloak container"].join(" "),
-            ),
+                ["This is just a test folder that helps develop", "the login and register page without having to run a Keycloak container"].join(" ")
+            )
         );
 
         fs.writeFileSync(pathJoin(keycloakResourcesWithinPublicDirPath, ".gitignore"), Buffer.from("*", "utf8"));
@@ -161,8 +192,8 @@ export function generateKeycloakThemeResources(params: {
 
     fs.writeFileSync(
         pathJoin(themeDirPath, "theme.properties"),
-        Buffer.from("parent=keycloak".concat("\n\n", extraThemeProperties.join("\n\n")), "utf8"),
+        Buffer.from(["parent=keycloak", ...(buildOptions.extraThemeProperties ?? [])].join("\n\n"), "utf8")
     );
 
-    return { doBundleEmailTemplate };
+    return { doBundlesEmailTemplate };
 }

package/src/bin/{build-keycloak-theme → keycloakify}/generateStartKeycloakTestingContainer.ts

@@ -1,13 +1,34 @@
 import * as fs from "fs";
 import { join as pathJoin } from "path";
+import { assert } from "tsafe/assert";
+import { Reflect } from "tsafe/Reflect";
+import type { BuildOptions } from "./BuildOptions";
+
+export type BuildOptionsLike = {
+    themeName: string;
+};
+
+{
+    const buildOptions = Reflect<BuildOptions>();
+
+    assert<typeof buildOptions extends BuildOptionsLike ? true : false>();
+}
 
 generateStartKeycloakTestingContainer.basename = "start_keycloak_testing_container.sh";
 
 const containerName = "keycloak-testing-container";
 
 /** Files for being able to run a hot reload keycloak container */
-export function generateStartKeycloakTestingContainer(params: { keycloakVersion: string; themeName: string; keycloakThemeBuildingDirPath: string }) {
-    const { themeName, keycloakThemeBuildingDirPath, keycloakVersion } = params;
+export function generateStartKeycloakTestingContainer(params: {
+    keycloakVersion: string;
+    keycloakThemeBuildingDirPath: string;
+    buildOptions: BuildOptionsLike;
+}) {
+    const {
+        keycloakThemeBuildingDirPath,
+        keycloakVersion,
+        buildOptions: { themeName }
+    } = params;
 
     fs.writeFileSync(
         pathJoin(keycloakThemeBuildingDirPath, generateStartKeycloakTestingContainer.basename),
@@ -31,14 +52,14 @@ export function generateStartKeycloakTestingContainer(params: { keycloakVersion:
                     "main",
                     "resources",
                     "theme",
-                    themeName,
+                    themeName
                 )}:/opt/keycloak/themes/${themeName}:rw \\`,
                 `   -it quay.io/keycloak/keycloak:${keycloakVersion} \\`,
                 `   start-dev`,
-                "",
+                ""
             ].join("\n"),
-            "utf8",
+            "utf8"
         ),
-        { "mode": 0o755 },
+        { "mode": 0o755 }
     );
 }

package/src/bin/keycloakify/index.ts

@@ -0,0 +1,8 @@
+#!/usr/bin/env node
+
+export * from "./keycloakify";
+import { main } from "./keycloakify";
+
+if (require.main === module) {
+    main();
+}

package/src/bin/{build-keycloak-theme/build-keycloak-theme.ts → keycloakify/keycloakify.ts}

@@ -3,101 +3,60 @@ import { generateJavaStackFiles } from "./generateJavaStackFiles";
 import { join as pathJoin, relative as pathRelative, basename as pathBasename } from "path";
 import * as child_process from "child_process";
 import { generateStartKeycloakTestingContainer } from "./generateStartKeycloakTestingContainer";
-import { URL } from "url";
 import * as fs from "fs";
-
-type ParsedPackageJson = {
-    name: string;
-    version: string;
-    homepage?: string;
-};
+import { readBuildOptions } from "./BuildOptions";
 
 const reactProjectDirPath = process.cwd();
 
-const doUseExternalAssets = process.argv[2]?.toLowerCase() === "--external-assets";
-
-const parsedPackageJson: ParsedPackageJson = require(pathJoin(reactProjectDirPath, "package.json"));
-
 export const keycloakThemeBuildingDirPath = pathJoin(reactProjectDirPath, "build_keycloak");
 export const keycloakThemeEmailDirPath = pathJoin(keycloakThemeBuildingDirPath, "..", "keycloak_email");
 
-function sanitizeThemeName(name: string) {
-    return name
-        .replace(/^@(.*)/, "$1")
-        .split("/")
-        .join("-");
-}
-
 export function main() {
     console.log("🔏 Building the keycloak theme...⌚");
 
-    const extraPagesId: string[] = (parsedPackageJson as any)["keycloakify"]?.["extraPages"] ?? [];
-    const extraThemeProperties: string[] = (parsedPackageJson as any)["keycloakify"]?.["extraThemeProperties"] ?? [];
-    const themeName = sanitizeThemeName(parsedPackageJson.name);
-
-    const { doBundleEmailTemplate } = generateKeycloakThemeResources({
-        keycloakThemeBuildingDirPath,
-        keycloakThemeEmailDirPath,
-        "reactAppBuildDirPath": pathJoin(reactProjectDirPath, "build"),
-        themeName,
-        ...(() => {
-            const url = (() => {
-                const { homepage } = parsedPackageJson;
-
-                if (homepage !== undefined) {
-                    return new URL(homepage);
-                }
-
-                const cnameFilePath = pathJoin(reactProjectDirPath, "public", "CNAME");
-
-                if (fs.existsSync(cnameFilePath)) {
-                    return new URL(`https://${fs.readFileSync(cnameFilePath).toString("utf8").replace(/\s+$/, "")}`);
-                }
+    const buildOptions = readBuildOptions({
+        "packageJson": fs.readFileSync(pathJoin(reactProjectDirPath, "package.json")).toString("utf8"),
+        "CNAME": (() => {
+            const cnameFilePath = pathJoin(reactProjectDirPath, "public", "CNAME");
 
+            if (!fs.existsSync(cnameFilePath)) {
                 return undefined;
-            })();
-
-            return {
-                "urlPathname": url === undefined ? "/" : url.pathname.replace(/([^/])$/, "$1/"),
-                "urlOrigin": !doUseExternalAssets
-                    ? undefined
-                    : (() => {
-                          if (url === undefined) {
-                              console.error("ERROR: You must specify 'homepage' in your package.json");
-                              process.exit(-1);
-                          }
+            }
 
-                          return url.origin;
-                      })(),
-            };
+            return fs.readFileSync(cnameFilePath).toString("utf8");
         })(),
-        extraPagesId,
-        extraThemeProperties,
+        "isExternalAssetsCliParamProvided": process.argv[2]?.toLowerCase() === "--external-assets"
+    });
+
+    const { doBundlesEmailTemplate } = generateKeycloakThemeResources({
+        keycloakThemeBuildingDirPath,
+        keycloakThemeEmailDirPath,
+        "reactAppBuildDirPath": pathJoin(reactProjectDirPath, "build"),
+        buildOptions,
         //We have to leave it at that otherwise we break our default theme.
         //Problem is that we can't guarantee that the the old resources
         //will still be available on the newer keycloak version.
-        "keycloakVersion": "11.0.3",
+        "keycloakVersion": "11.0.3"
     });
 
     const { jarFilePath } = generateJavaStackFiles({
-        "version": parsedPackageJson.version,
-        themeName,
-        "homepage": parsedPackageJson.homepage,
+        "version": buildOptions.version,
         keycloakThemeBuildingDirPath,
-        doBundleEmailTemplate,
+        doBundlesEmailTemplate,
+        buildOptions
     });
 
     child_process.execSync("mvn package", {
-        "cwd": keycloakThemeBuildingDirPath,
+        "cwd": keycloakThemeBuildingDirPath
     });
 
-    //We want, however to test in a container running the latest Keycloak version
-    const containerKeycloakVersion = "18.0.0";
+    //We want, however, to test in a container running the latest Keycloak version
+    const containerKeycloakVersion = "18.0.2";
 
     generateStartKeycloakTestingContainer({
         keycloakThemeBuildingDirPath,
-        themeName,
         "keycloakVersion": containerKeycloakVersion,
+        buildOptions
     });
 
     console.log(
@@ -145,11 +104,11 @@ export function main() {
             "- Log into the admin console 👉 http://localhost:8080/admin username: admin, password: admin 👈",
             '- Create a realm named "myrealm"',
             '- Create a client with ID: "myclient", "Root URL": "https://www.keycloak.org/app/" and "Valid redirect URIs": "https://www.keycloak.org/app/*"',
-            `- Select Login Theme: ${themeName} (don't forget to save at the bottom of the page)`,
+            `- Select Login Theme: ${buildOptions.themeName} (don't forget to save at the bottom of the page)`,
             `- Go to 👉 https://www.keycloak.org/app/ 👈 Click "Save" then "Sign in". You should see your login page`,
             "",
             "Video demoing this process: https://youtu.be/N3wlBoH4hKg",
-            "",
-        ].join("\n"),
+            ""
+        ].join("\n")
     );
 }

package/src/bin/keycloakify/replacers/replaceImportsFromStaticInJsCode.ts

@@ -0,0 +1,86 @@
+import { ftlValuesGlobalName } from "../ftlValuesGlobalName";
+import type { BuildOptions } from "../BuildOptions";
+import { assert } from "tsafe/assert";
+import { is } from "tsafe/is";
+import { Reflect } from "tsafe/Reflect";
+
+export type BuildOptionsLike = BuildOptionsLike.Standalone | BuildOptionsLike.ExternalAssets;
+
+export namespace BuildOptionsLike {
+    export type Standalone = {
+        isStandalone: true;
+    };
+
+    export type ExternalAssets = {
+        isStandalone: false;
+        urlOrigin: string;
+    };
+}
+
+{
+    const buildOptions = Reflect<BuildOptions>();
+
+    assert(!is<BuildOptions.ExternalAssets.CommonExternalAssets>(buildOptions));
+
+    assert<typeof buildOptions extends BuildOptionsLike ? true : false>();
+}
+
+export function replaceImportsFromStaticInJsCode(params: { jsCode: string; buildOptions: BuildOptionsLike }): { fixedJsCode: string } {
+    /* 
+	NOTE:
+
+	When we have urlOrigin defined it means that 
+	we are building with --external-assets
+	so we have to make sur that the fixed js code will run 
+	inside and outside keycloak.
+
+	When urlOrigin isn't defined we can assume the fixedJsCode
+	will always run in keycloak context.
+	*/
+
+    const { jsCode, buildOptions } = params;
+
+    const getReplaceArgs = (language: "js" | "css"): Parameters<typeof String.prototype.replace> => [
+        new RegExp(`([a-zA-Z]+)\\.([a-zA-Z]+)=function\\(([a-zA-Z]+)\\){return"static\\/${language}\\/"`, "g"),
+        (...[, n, u, e]) => `
+			${n}[(function(){
+                var pd= Object.getOwnPropertyDescriptor(n, "p");
+                if( pd === undefined || pd.configurable ){
+                ${
+                    buildOptions.isStandalone
+                        ? `
+                        Object.defineProperty(${n}, "p", {
+                            get: function() { return window.${ftlValuesGlobalName}.url.resourcesPath; },
+                            set: function (){}
+                        });
+                    `
+                        : `
+                    var p= "";
+                    Object.defineProperty(${n}, "p", {
+                        get: function() { return ("${ftlValuesGlobalName}" in window ? "${buildOptions.urlOrigin}" : "") + p; },
+                        set: function (value){ p = value;}
+                    });
+                    `
+                }
+                }
+				return "${u}";
+			})()] = function(${e}) { return "${buildOptions.isStandalone ? "/build/" : ""}static/${language}/"`
+    ];
+
+    const fixedJsCode = jsCode
+        .replace(...getReplaceArgs("js"))
+        .replace(...getReplaceArgs("css"))
+        .replace(/([a-zA-Z]+\.[a-zA-Z]+)\+"static\//g, (...[, group]) =>
+            buildOptions.isStandalone
+                ? `window.${ftlValuesGlobalName}.url.resourcesPath + "/build/static/`
+                : `("${ftlValuesGlobalName}" in window ? "${buildOptions.urlOrigin}" : "") + ${group} + "static/`
+        )
+        //TODO: Write a test case for this
+        .replace(/".chunk.css",([a-zA-Z])+=([a-zA-Z]+\.[a-zA-Z]+)\+([a-zA-Z]+),/, (...[, group1, group2, group3]) =>
+            buildOptions.isStandalone
+                ? `".chunk.css",${group1} = window.${ftlValuesGlobalName}.url.resourcesPath + "/build/" + ${group3},`
+                : `".chunk.css",${group1} = ("${ftlValuesGlobalName}" in window ? "${buildOptions.urlOrigin}" : "") + ${group2} + ${group3},`
+        );
+
+    return { fixedJsCode };
+}