@zohodesk/client_build_tool 0.0.13 → 0.0.14

package/lib/shared/bundler/webpack/custom_plugins/I18nNumericIndexPlugin/I18nNumericIndexPlugin.js

@@ -0,0 +1,478 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _fs = _interopRequireDefault(require("fs"));
+
+var _path = _interopRequireDefault(require("path"));
+
+var _webpack = require("webpack");
+
+var _propertiesUtils = require("../I18nSplitPlugin/utils/propertiesUtils");
+
+var _I18nGroupRuntimeModule = require("./I18nGroupRuntimeModule");
+
+var _i18nDataLoader = require("./utils/i18nDataLoader.js");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const {
+  RawSource
+} = _webpack.sources;
+const assetStoreKey = Symbol.for('I18nNumericIndexPluginAssets');
+const pluginName = 'I18nNumericIndexPlugin';
+
+function buildChunkMappingFromGroups(customGroups) {
+  if (!customGroups) {
+    return {};
+  }
+
+  const mapping = {};
+  Object.entries(customGroups).forEach(([groupName, config]) => {
+    if (config && Array.isArray(config.chunks)) {
+      config.chunks.forEach(chunkName => {
+        if (chunkName && typeof chunkName === 'string') {
+          mapping[chunkName] = groupName;
+        }
+      });
+    }
+  });
+  return mapping;
+}
+
+class I18nNumericIndexPlugin {
+  constructor(options) {
+    this.options = { ...options,
+      singleFile: options.singleFile || false,
+      singleFileTemplate: options.singleFileTemplate || '[locale].js',
+      includeContentHash: options.includeContentHash || false,
+      generateManifest: options.generateManifest || false,
+      outputFolder: options.outputFolder || 'i18n-chunk',
+      manifestPath: options.manifestPath || null,
+      emitFiles: options.emitFiles !== undefined ? options.emitFiles : true,
+      chunkToGroupMapping: options.chunkToGroupMapping || {},
+      groupPublicPathPrefix: options.groupPublicPathPrefix || '',
+      groupPublicPathRuntimeExpression: options.groupPublicPathRuntimeExpression || ''
+    };
+    this.numericMap = {};
+    this.customGroups = {};
+    this.manifest = {};
+    this.groupAssetUrls = {};
+    this.preparedAssets = [];
+    this.assetsPrepared = false;
+    this.assetsEmitted = false;
+    this.groupChunkMapping = buildChunkMappingFromGroups(this.options.customGroups);
+  }
+
+  apply(compiler) {
+    this.detectI18nGroupComments(compiler);
+    compiler.hooks.thisCompilation.tap(pluginName, compilation => {
+      this.groupAssetUrls = {};
+      this.detectedGroups = {};
+      this.preparedAssets = [];
+      this.assetsPrepared = false;
+      this.assetsEmitted = false;
+
+      if (this.options.customGroups) {
+        compilation.hooks.additionalTreeRuntimeRequirements.tap(pluginName, (chunk, set) => {
+          if (chunk.name === 'main' || chunk.hasRuntime()) {
+            this.ensureAssetsPrepared(compilation);
+            const chunkMapping = this.getChunkIdToGroupMapping(compilation);
+            compilation.addRuntimeModule(chunk, new _I18nGroupRuntimeModule.I18nGroupRuntimeModule({
+              customGroups: this.options.customGroups,
+              chunkIdToGroupMapping: chunkMapping,
+              localeVarName: this.options.localeVarName,
+              jsonpFunc: this.options.jsonpFunc,
+              groupAssetUrls: this.groupAssetUrls,
+              includeContentHash: this.options.includeContentHash,
+              publicPathPrefix: this.options.groupPublicPathPrefix,
+              publicPathRuntimeExpression: this.options.groupPublicPathRuntimeExpression
+            }));
+          }
+        });
+      }
+
+      compilation.hooks.processAssets.tap({
+        name: pluginName,
+        stage: compilation.PROCESS_ASSETS_STAGE_OPTIMIZE
+      }, () => {
+        this.ensureAssetsPrepared(compilation);
+        this.emitPreparedAssets(compilation);
+      });
+    });
+  }
+
+  detectI18nGroupComments(compiler) {
+    compiler.hooks.normalModuleFactory.tap(pluginName, factory => {
+      factory.hooks.parser.for('javascript/auto').tap(pluginName, parser => {
+        parser.hooks.importCall.tap(pluginName, expr => {
+          const comments = expr.leadingComments || [];
+
+          if (comments.length > 0) {
+            comments.forEach(comment => {
+              if (comment.value && comment.value.includes('webpackI18nGroup')) {
+                const match = comment.value.match(/webpackI18nGroup:\s*["']([^"']+)["']/);
+
+                if (match) {
+                  const groupName = match[1];
+
+                  if (!this.detectedGroups) {
+                    this.detectedGroups = {};
+                  }
+
+                  const chunkNameMatch = comment.value.match(/webpackChunkName:\s*["']([^"']+)["']/);
+
+                  if (chunkNameMatch) {
+                    const chunkName = chunkNameMatch[1];
+                    this.detectedGroups[chunkName] = groupName;
+                  }
+                }
+              }
+            });
+          }
+        });
+      });
+    });
+  }
+
+  getChunkIdToGroupMapping(compilation) {
+    const chunkIdToGroup = {};
+    const configuredMappings = { ...this.groupChunkMapping,
+      ...(this.options.chunkToGroupMapping || {})
+    };
+
+    for (const chunk of compilation.chunks) {
+      const chunkName = chunk.name;
+      let groupName = null;
+
+      if (this.detectedGroups && this.detectedGroups[chunkName]) {
+        groupName = this.detectedGroups[chunkName];
+      } else if (configuredMappings[chunkName]) {
+        groupName = configuredMappings[chunkName];
+      }
+
+      if (groupName) {
+        chunkIdToGroup[chunk.id] = groupName;
+      }
+    }
+
+    return chunkIdToGroup;
+  }
+
+  processI18nFiles(compilation) {
+    this.preparedAssets = [];
+    this.groupAssetUrls = {};
+    const {
+      jsResourcePath,
+      propertiesFolderPath,
+      numericMapPath,
+      customGroups,
+      jsonpFunc,
+      numericFilenameTemplate,
+      dynamicFilenameTemplate
+    } = this.options;
+
+    if (!jsResourcePath || !propertiesFolderPath) {
+      return;
+    } // Reset caches for incremental builds
+
+
+    this.numericMap = {};
+    this.manifest = {};
+    this.customGroups = {};
+
+    if (numericMapPath) {
+      const mapData = (0, _i18nDataLoader.loadNumericMap)(numericMapPath, compilation);
+
+      if (mapData && mapData.sortedKeys) {
+        mapData.sortedKeys.forEach((key, id) => {
+          if (key) {
+            this.numericMap[key] = id;
+          }
+        });
+      }
+    }
+
+    let jsResourceKeys = (0, _propertiesUtils.getPropertiesAsJSON)(jsResourcePath);
+    jsResourceKeys = this.normalizeObjectValues(jsResourceKeys);
+
+    if (customGroups) {
+      this.parseCustomGroups(jsResourcePath, customGroups);
+    }
+
+    const allI18nObject = (0, _propertiesUtils.getAllI18n)({
+      folderPath: propertiesFolderPath,
+      disableDefault: false,
+      jsResourceI18nKeys: jsResourceKeys
+    });
+    Object.keys(allI18nObject).forEach(loc => {
+      allI18nObject[loc] = this.normalizeObjectValues(allI18nObject[loc]);
+    });
+    allI18nObject['en_US'] = jsResourceKeys;
+
+    if (this.options.restrictToBaseKeys) {
+      const baseKeys = Object.keys(jsResourceKeys);
+      Object.keys(allI18nObject).forEach(locale => {
+        const merged = { ...jsResourceKeys,
+          ...allI18nObject[locale]
+        };
+        const filtered = {};
+        baseKeys.forEach(k => {
+          filtered[k] = merged[k];
+        });
+        allI18nObject[locale] = filtered;
+      });
+    }
+
+    const locales = Object.keys(allI18nObject);
+    locales.forEach(locale => {
+      const localeData = allI18nObject[locale];
+      const numericData = {};
+      const dynamicData = {};
+      const groupData = {};
+      Object.keys(customGroups || {}).forEach(groupName => {
+        groupData[groupName] = {};
+      }); // Process each key
+
+      Object.keys(localeData).forEach(key => {
+        const value = localeData[key]; // Simple logic: if has numeric ID use it, otherwise it's dynamic
+
+        const numericId = this.numericMap[key];
+        const hasNumericId = numericId !== undefined && numericId !== null;
+
+        if (hasNumericId) {
+          const numericKey = String(numericId); // Check if belongs to a custom group
+
+          const belongsToGroup = this.getKeyGroup(key);
+
+          if (belongsToGroup) {
+            groupData[belongsToGroup][numericKey] = value;
+          } else {
+            numericData[numericKey] = value;
+          }
+        } else {
+          // No numeric ID = dynamic key
+          dynamicData[key] = value;
+        }
+      }); // Handle single-file mode or separate files
+
+      if (this.options.singleFile) {
+        const combinedData = { ...numericData,
+          ...dynamicData
+        };
+
+        if (Object.keys(combinedData).length > 0) {
+          const singleFileTemplate = this.options.singleFileTemplate || '[locale].js';
+          this.prepareChunkAsset(compilation, singleFileTemplate, locale, combinedData, jsonpFunc, null, null);
+        }
+      } else {
+        // Emit numeric chunk
+        if (Object.keys(numericData).length > 0) {
+          this.prepareChunkAsset(compilation, numericFilenameTemplate, locale, numericData, jsonpFunc, null, 'numeric');
+        } // Emit dynamic chunk
+
+
+        if (Object.keys(dynamicData).length > 0) {
+          this.prepareChunkAsset(compilation, dynamicFilenameTemplate, locale, dynamicData, jsonpFunc, null, 'dynamic');
+        }
+      } // Emit custom group chunks (always separate)
+
+
+      Object.entries(groupData).forEach(([groupName, data]) => {
+        const groupConfig = customGroups[groupName];
+
+        if (groupConfig && Object.keys(data).length > 0) {
+          const groupTemplate = groupConfig.filenameTemplate || `[locale]/${groupName}.i18n.js`;
+          this.prepareChunkAsset(compilation, groupTemplate, locale, data, jsonpFunc, groupName, `group-${groupName}`);
+        }
+      });
+    }); // Generate manifest file if enabled
+
+    if (this.options.generateManifest && Object.keys(this.manifest).length > 0) {
+      const manifestPath = this.options.manifestPath || _path.default.join(this.options.outputFolder, 'manifest.json');
+
+      const manifestContent = JSON.stringify(this.manifest, null, 2);
+      this.preparedAssets.push({
+        outputPath: manifestPath,
+        source: new RawSource(manifestContent),
+        shouldEmit: true
+      });
+    }
+  }
+
+  ensureAssetsPrepared(compilation) {
+    if (this.assetsPrepared) {
+      return;
+    }
+
+    this.processI18nFiles(compilation);
+    this.assetsPrepared = true;
+  }
+
+  emitPreparedAssets(compilation) {
+    if (this.assetsEmitted) {
+      return;
+    }
+
+    this.preparedAssets.forEach(asset => {
+      if (asset.shouldEmit !== false) {
+        compilation.emitAsset(asset.outputPath, asset.source);
+      }
+    });
+    this.assetsEmitted = true;
+  }
+
+  parseCustomGroups(jsResourcePath, customGroups) {
+    const content = _fs.default.readFileSync(jsResourcePath, 'utf-8');
+
+    const lines = content.split('\n');
+    Object.entries(customGroups).forEach(([groupName, config]) => {
+      const {
+        bannerStart,
+        bannerEnd
+      } = config;
+      let inGroup = false;
+      const groupKeys = [];
+      lines.forEach(line => {
+        if (line.includes(bannerStart)) {
+          inGroup = true;
+        } else if (line.includes(bannerEnd)) {
+          inGroup = false;
+        } else if (inGroup && line.includes('=')) {
+          const key = line.split('=')[0].trim();
+
+          if (key && !key.startsWith('#')) {
+            groupKeys.push(key);
+          }
+        }
+      });
+      this.customGroups[groupName] = groupKeys;
+    });
+  }
+
+  getKeyGroup(key) {
+    for (const [groupName, keys] of Object.entries(this.customGroups)) {
+      if (keys.includes(key)) {
+        return groupName;
+      }
+    }
+
+    return null;
+  }
+
+  generateContentHash(content, compilation) {
+    const {
+      hashFunction,
+      hashDigest,
+      hashDigestLength
+    } = compilation.outputOptions;
+
+    const hash = _webpack.util.createHash(hashFunction || 'xxhash64');
+
+    hash.update(content);
+    return hash.digest(hashDigest || 'hex').substring(0, hashDigestLength || 8);
+  }
+
+  constructFilePath(template, locale) {
+    const {
+      outputFolder
+    } = this.options;
+    const filePath = template.replace(/\[locale\]/g, locale);
+
+    if (filePath.includes(outputFolder) || filePath.startsWith('/')) {
+      return filePath;
+    }
+
+    return _path.default.join(outputFolder, filePath).replace(/\\/g, '/');
+  }
+
+  prepareChunkAsset(compilation, filenameTemplate, locale, data, jsonpFunc, groupName = null, fileType = null) {
+    if (!filenameTemplate || Object.keys(data).length === 0) {
+      return null;
+    }
+
+    const content = this.generateChunkContent(data, jsonpFunc, groupName);
+    let outputPath = this.constructFilePath(filenameTemplate, locale); // Handle [contenthash] placeholder in template
+
+    if (outputPath.includes('[contenthash]')) {
+      const contentHash = this.generateContentHash(content, compilation);
+      outputPath = outputPath.replace(/\[contenthash\]/g, contentHash);
+    } else if (this.options.includeContentHash) {
+      const contentHash = this.generateContentHash(content, compilation);
+      outputPath = outputPath.replace(/\.js$/, `.${contentHash}.js`);
+    } // Track in manifest if enabled
+
+
+    if (this.options.generateManifest) {
+      const manifestKey = this.options.singleFile ? `${locale}.js` : outputPath;
+      this.manifest[manifestKey] = _path.default.basename(outputPath);
+    }
+
+    const source = new RawSource(content);
+    const assetInfo = {
+      locale,
+      fileType,
+      outputPath,
+      filenameTemplate
+    };
+    this.registerEmittedAsset(compilation, assetInfo);
+    this.preparedAssets.push({
+      outputPath,
+      source,
+      shouldEmit: this.options.emitFiles,
+      info: assetInfo
+    });
+    return outputPath;
+  }
+
+  registerEmittedAsset(compilation, assetInfo) {
+    if (!Object.prototype.hasOwnProperty.call(compilation, assetStoreKey)) {
+      Object.defineProperty(compilation, assetStoreKey, {
+        configurable: true,
+        enumerable: false,
+        value: []
+      });
+    }
+
+    compilation[assetStoreKey].push(assetInfo);
+
+    if (assetInfo.fileType && assetInfo.fileType.startsWith('group-')) {
+      const groupName = assetInfo.fileType.slice('group-'.length);
+
+      if (!this.groupAssetUrls[groupName]) {
+        this.groupAssetUrls[groupName] = {};
+      }
+
+      this.groupAssetUrls[groupName][assetInfo.locale] = assetInfo.outputPath;
+    }
+  }
+
+  generateChunkContent(data, jsonpFunc, groupName) {
+    const jsonString = (0, _propertiesUtils.decodeUnicodeEscapes)(JSON.stringify(data));
+
+    if (groupName) {
+      return `${jsonpFunc}(${jsonString}, "${groupName}");`;
+    }
+
+    return `${jsonpFunc}(${jsonString});`;
+  }
+
+  normalizeValue(value) {
+    if (typeof value !== 'string') return value;
+    return value.replace(/\\t/g, '\t').replace(/\\n/g, '\n').replace(/\\r/g, '\r').replace(/\\f/g, '\f').replace(/\\:/g, ':').replace(/\\=/g, '=').replace(/\\ /g, ' ');
+  }
+
+  normalizeObjectValues(obj) {
+    const out = {};
+    Object.keys(obj || {}).forEach(k => {
+      out[k] = this.normalizeValue(obj[k]);
+    });
+    return out;
+  }
+
+}
+
+exports.default = I18nNumericIndexPlugin;

package/lib/shared/bundler/webpack/custom_plugins/I18nNumericIndexPlugin/utils/i18nDataLoader.js

@@ -0,0 +1,115 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.loadAllLocaleFiles = loadAllLocaleFiles;
+exports.loadI18nData = loadI18nData;
+exports.loadNumericMap = loadNumericMap;
+exports.loadPropertiesFile = loadPropertiesFile;
+
+var _fs = _interopRequireDefault(require("fs"));
+
+var _path = _interopRequireDefault(require("path"));
+
+var _propertiesUtils = require("../../I18nSplitPlugin/utils/propertiesUtils.js");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function loadPropertiesFile(filePath, compilation, description) {
+  try {
+    return (0, _propertiesUtils.getPropertiesAsJSON)(filePath);
+  } catch (err) {
+    if (compilation) {
+      compilation.errors.push(new Error(`I18nNumericIndexPlugin: Error loading ${description}: ${err.message}`));
+    }
+
+    return {};
+  }
+}
+
+function loadNumericMap(numericMapPath, compilation) {
+  try {
+    const fileContent = _fs.default.readFileSync(numericMapPath, 'utf-8');
+
+    const parsedData = JSON.parse(fileContent);
+    const numericMap = parsedData.originalKeyToNumericId || parsedData;
+    const totalKeys = parsedData.totalKeysInMap || Object.keys(numericMap).length;
+    const values = Object.values(numericMap);
+    const maxId = Math.max(...values.map(id => typeof id === 'number' ? id : Number(id)));
+    const sortedKeys = new Array(maxId + 1);
+    Object.entries(numericMap).forEach(([key, id]) => {
+      sortedKeys[id] = key;
+    });
+    return {
+      sortedKeys,
+      totalKeys
+    };
+  } catch (err) {
+    if (compilation) {
+      compilation.errors.push(new Error(`I18nNumericIndexPlugin: Error loading numeric map: ${err.message}`));
+    }
+
+    return {
+      sortedKeys: [],
+      totalKeys: 0
+    };
+  }
+}
+
+function loadAllLocaleFiles(propertiesPath, compilation, jsResourceBase) {
+  const allI18n = {
+    en_US: jsResourceBase
+  };
+  const locales = ['en_US'];
+
+  try {
+    const files = _fs.default.readdirSync(propertiesPath);
+
+    files.forEach(file => {
+      if (!file.endsWith('.properties')) return;
+      const match = file.match(/^ApplicationResources_([a-z]{2}_[A-Z]{2})\.properties$/);
+
+      if (match) {
+        const locale = match[1];
+
+        const filePath = _path.default.join(propertiesPath, file);
+
+        const localeData = loadPropertiesFile(filePath, compilation, `locale ${locale}`);
+        allI18n[locale] = { ...jsResourceBase,
+          ...localeData
+        };
+
+        if (!locales.includes(locale)) {
+          locales.push(locale);
+        }
+      }
+    });
+  } catch (err) {
+    if (compilation) {
+      compilation.errors.push(new Error(`I18nNumericIndexPlugin: Error reading properties folder: ${err.message}`));
+    }
+  }
+
+  return {
+    allI18n,
+    locales
+  };
+}
+
+function loadI18nData(options, compilation) {
+  const jsResourcePath = _path.default.resolve(compilation.compiler.context, options.jsResourcePath);
+
+  const propertiesPath = _path.default.resolve(compilation.compiler.context, options.propertiesFolderPath);
+
+  const jsResourceBase = loadPropertiesFile(jsResourcePath, compilation, 'JS resources');
+  const {
+    allI18n,
+    locales
+  } = loadAllLocaleFiles(propertiesPath, compilation, jsResourceBase);
+  return {
+    jsResourceBase,
+    allI18n,
+    locales
+  };
+}

package/lib/shared/bundler/webpack/custom_plugins/InitialHtmlPlugin.js

@@ -16,13 +16,28 @@ class InitialHtmlPlugin {
     this.options = options;
   }
 
+  getBaseName(str) {
+    const fileName = str.split("/").pop();
+    const parts = fileName.split("."); // Find index of the hash-like segment
+
+    const hashIndex = parts.findIndex(p => /^[0-9a-f_]{20,}$/i.test(p)); // If a hash is found, return everything before it
+
+    if (hashIndex < 0) {
+      console.error('this initial file dont have a hash');
+      return parts.slice(0, -1).join(".");
+    }
+
+    return parts.slice(0, hashIndex).join("."); // Otherwise fallback: remove only ".js"
+  }
+
   apply(compiler) {
     const {
       filename,
       template,
       minify,
       inject,
-      mainChunkName
+      mainChunkName,
+      enableSubResourceIntegrity
     } = this.options;
     new _htmlWebpackPlugin.default({
       filename,
@@ -37,13 +52,36 @@ class InitialHtmlPlugin {
         const headTags = [];
         const bodyTags = [];
         data.headTags.forEach(tag => {
+          const url = tag.attributes?.src || tag.attributes?.href;
+          let chunkName;
+
+          const addIntegrity = (tag, suffix) => {
+            if (enableSubResourceIntegrity && chunkName) {
+              Object.assign(tag.attributes, {
+                integrity: `{{--${chunkName}-${suffix}-integrity}}`
+              });
+            }
+          };
+
+          if (enableSubResourceIntegrity) {
+            chunkName = this.getBaseName(url);
+          }
+
           Object.assign(tag.attributes, {
-            nonce: '{{--CSP-nonce}}'
+            nonce: '{{--CSP-nonce}}',
+            crossorigin: "anonymous"
           });
 
           if (tag.tagName === 'link') {
+            addIntegrity(tag, 'css');
             headTags.push(tag);
           } else {
+            if (url.endsWith('.i18n.js')) {
+              addIntegrity(tag, 'i18n');
+            } else {
+              addIntegrity(tag, 'js');
+            }
+
             bodyTags.push(tag);
           }
         });