@zohodesk/client_build_tool 0.0.11-exp.26.0 → 0.0.11-exp.28.0

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

@@ -20,29 +20,28 @@ class I18nGroupRuntimeModule extends _webpack.RuntimeModule {
       customGroups,
       chunkIdToGroupMapping,
       localeVarName,
-      jsonpFunc,
-      i18nPublicPathVar
-    } = this.options; // Use the pre-computed chunk ID to group mapping
-
+      i18nPublicPathVar,
+      groupAssetUrls,
+      includeContentHash,
+      mode
+    } = this.options;
     const chunkIdToGroup = chunkIdToGroupMapping || {};
+    const hasGroupAssetOverrides = !!groupAssetUrls && Object.values(groupAssetUrls).some(localeMap => localeMap && Object.keys(localeMap).length > 0);
+    const hashAware = includeContentHash || hasGroupAssetOverrides;
+    const isDevelopment = mode === 'development';
     return `
     // I18n Group Loading Runtime
     (function() {
       var loadedGroups = {};
       var chunkIdToGroup = ${JSON.stringify(chunkIdToGroup)};
+      var groupAssetUrls = ${JSON.stringify(groupAssetUrls || {})};
+      var hashAware = ${hashAware ? 'true' : 'false'};
+      var isDev = ${isDevelopment ? 'true' : 'false'};
       var cachedI18nBase;
-      var loadReasonKey = '__i18nGroupLoadReason';
-
-      // Only log if we have actual mappings to track
-      if (Object.keys(chunkIdToGroup).length > 0) {
-        console.log('[i18n-group:runtime] I18n Group Runtime Module loaded');
-        console.log('[i18n-group:runtime] Chunk ID to Group mapping:', chunkIdToGroup);
-      }
+      var scriptCache = null;
 
       function ensureTrailingSlash(path) {
-        if (!path) {
-          return '';
-        }
+        if (!path) return '';
         return path.charAt(path.length - 1) === '/' ? path : path + '/';
       }
 
@@ -53,39 +52,11 @@ class I18nGroupRuntimeModule extends _webpack.RuntimeModule {
             return candidate;
           }
         } catch (err) {
-          // ignore – fall back to DOM/publicPath detection
+          // Fall back to DOM/publicPath detection
         }
         return '';
       }
 
-      function withLoadReason(reason, fn) {
-        var previous = __webpack_require__[loadReasonKey];
-        __webpack_require__[loadReasonKey] = reason;
-        try {
-          return fn();
-        } finally {
-          __webpack_require__[loadReasonKey] = previous;
-        }
-      }
-
-      if (typeof __webpack_require__.pfc === 'function') {
-        var originalPrefetchChunk = __webpack_require__.pfc;
-        __webpack_require__.pfc = function(prefetchChunkId) {
-          return withLoadReason('prefetch', function() {
-            return originalPrefetchChunk(prefetchChunkId);
-          });
-        };
-      }
-
-      if (typeof __webpack_require__.plc === 'function') {
-        var originalPreloadChunk = __webpack_require__.plc;
-        __webpack_require__.plc = function(preloadChunkId) {
-          return withLoadReason('preload', function() {
-            return originalPreloadChunk(preloadChunkId);
-          });
-        };
-      }
-
       function resolveI18nBase() {
         if (cachedI18nBase !== undefined) {
           return cachedI18nBase;
@@ -94,9 +65,11 @@ class I18nGroupRuntimeModule extends _webpack.RuntimeModule {
         var base = resolveConfiguredBase();
 
         if (!base && typeof document !== 'undefined') {
-          var scripts = document.getElementsByTagName('script');
-          for (var i = 0; i < scripts.length; i++) {
-            var src = scripts[i].getAttribute('data-src') || scripts[i].getAttribute('src') || '';
+          if (!scriptCache) {
+            scriptCache = Array.from(document.getElementsByTagName('script'));
+          }
+          for (var i = 0; i < scriptCache.length; i++) {
+            var src = scriptCache[i].getAttribute('data-src') || scriptCache[i].getAttribute('src') || '';
             var markerIndex = src.indexOf('i18n-chunk/');
             if (markerIndex !== -1) {
               base = src.slice(0, markerIndex);
@@ -113,24 +86,18 @@ class I18nGroupRuntimeModule extends _webpack.RuntimeModule {
         }
 
         cachedI18nBase = ensureTrailingSlash(base);
-        if (typeof console !== 'undefined' && console.log) {
-          console.log('[i18n-group:base]', cachedI18nBase || '<empty>');
-        }
         return cachedI18nBase;
       }
 
       function buildI18nUrl(relativePath) {
         var base = resolveI18nBase();
-        if (!relativePath) {
-          return base;
-        }
+        if (!relativePath) return base;
         if (relativePath.charAt(0) === '/') {
           relativePath = relativePath.slice(1);
         }
         return base + relativePath;
       }
-      
-      // Function to load i18n group
+
       function loadI18nGroup(groupName, loadReason) {
         if (loadedGroups[groupName]) {
           return Promise.resolve();
@@ -149,178 +116,172 @@ class I18nGroupRuntimeModule extends _webpack.RuntimeModule {
           (loadReason === 'preload' && config.preload === false);
 
         if (shouldSkip) {
-          if (typeof console !== 'undefined' && console.log) {
-            console.log('[i18n-group:skip]', groupName, loadReason, 'prefetch/preload disabled');
-          }
           return Promise.resolve();
         }
 
         return new Promise(function(resolve, reject) {
-          var relativePath = config.filenameTemplate
-            .replace('[locale]', locale);
-          var i18nUrl = buildI18nUrl(relativePath);
+          var relativePath = config.filenameTemplate.replace('[locale]', locale);
 
-          if (typeof console !== 'undefined' && console.log) {
-            console.log('[i18n-group:load]', groupName, loadReason || 'require', i18nUrl);
+          if (hashAware && groupAssetUrls[groupName] && groupAssetUrls[groupName][locale]) {
+            relativePath = groupAssetUrls[groupName][locale];
           }
 
+          var i18nUrl = buildI18nUrl(relativePath);
+
           var script = document.createElement('script');
           script.src = i18nUrl;
           script.async = true;
-          
+
+          var cleanup = function() {
+            if (script.parentNode) {
+              script.parentNode.removeChild(script);
+            }
+          };
+
           script.onload = function() {
             loadedGroups[groupName] = true;
-            if (typeof console !== 'undefined' && console.log) {
-              console.log('[i18n-group:loaded]', groupName, loadReason || 'require', i18nUrl);
+            if (isDev) {
+              console.log('[i18n-group:loaded]', groupName, i18nUrl);
             }
+            cleanup();
             resolve();
           };
 
           script.onerror = function() {
-            if (typeof console !== 'undefined' && console.error) {
+            if (isDev) {
               console.error('[i18n-group:error]', groupName, i18nUrl);
             }
-            reject(new Error('Failed to load i18n group: ' + groupName));
+            cleanup();
+            loadedGroups[groupName] = true;
+            resolve();
           };
-          
+
           document.head.appendChild(script);
         });
       }
 
       function findGroupByChunkId(chunkId) {
-        // Direct numeric chunk ID lookup
         return chunkIdToGroup[chunkId];
       }
-      
-      // Store original webpack chunk loading function
+
       var originalEnsureChunk = __webpack_require__.e;
-      
-      // Override webpack's chunk loading if it exists
+
       if (originalEnsureChunk) {
         __webpack_require__.e = function(chunkId) {
-          if (typeof console !== 'undefined' && console.log) {
-            console.log('[i18n-group:debug] Chunk loading called for ID:', chunkId);
-          }
-
-          // Capture the arguments for later use
           var args = arguments;
           var self = this;
-
-          // Check if this chunk needs an i18n group
           var groupName = findGroupByChunkId(chunkId);
-          if (typeof console !== 'undefined' && console.log) {
-            console.log('[i18n-group:debug] Found group for chunk', chunkId, ':', groupName);
-            console.log('[i18n-group:debug] Chunk mapping:', chunkIdToGroup);
-          }
 
           if (groupName && !loadedGroups[groupName]) {
-            if (typeof console !== 'undefined' && console.log) {
-              var chunkFilename = typeof __webpack_require__ !== 'undefined' && typeof __webpack_require__.u === 'function'
-                ? __webpack_require__.u(chunkId)
-                : '<no __webpack_require__.u>';
-              console.log('[i18n-group:hook]', chunkId, '→', groupName, '| reason:', (__webpack_require__[loadReasonKey] || 'require'), '| file:', chunkFilename);
-            }
-            // Load the i18n group FIRST, then load the chunk
-            var loadReason = __webpack_require__[loadReasonKey] || 'require';
-            var i18nPromise = loadI18nGroup(groupName, loadReason);
-            // Chain: i18n loads first, then chunk loads
+            var i18nPromise = loadI18nGroup(groupName, 'require');
+
             return i18nPromise.then(function() {
-              // Only start loading the actual chunk after i18n is loaded
+              return originalEnsureChunk.apply(self, args);
+            }).catch(function(err) {
+              if (isDev) {
+                console.error('[i18n-group:critical] i18n failed, proceeding without:', err);
+              }
               return originalEnsureChunk.apply(self, args);
             });
           } else {
-            if (typeof console !== 'undefined' && console.log) {
-              if (!groupName) {
-                console.log('[i18n-group:debug] No group found for chunk', chunkId);
-              } else if (loadedGroups[groupName]) {
-                console.log('[i18n-group:debug] Group', groupName, 'already loaded for chunk', chunkId);
-              }
-            }
-            // No i18n needed, just load the chunk normally
             return originalEnsureChunk.apply(this, arguments);
           }
         };
       }
-      
-      // Also check for webpackI18nGroup comments in dynamic imports
-      function wrapLoadScript(originalLoadScript) {
-        return function(url, done, key, chunkId) {
-          var groupName = findGroupByChunkId(chunkId);
-          if (groupName && !loadedGroups[groupName]) {
-            var locale = ${localeVarName} || 'en_US';
-            var groupConfig = ${JSON.stringify(customGroups)};
-            var config = groupConfig[groupName];
 
-            if (config) {
-              var relativePath = config.filenameTemplate
-                .replace('[locale]', locale);
-              var i18nUrl = buildI18nUrl(relativePath);
+      // Simple URL-based detection for setup pages
+      function detectGroupFromUrl() {
+        if (typeof window === 'undefined') return null;
 
-              if (config.prefetch === false) {
-                if (typeof console !== 'undefined' && console.log) {
-                  console.log('[i18n-group:skip-prefetch-loader]', groupName, chunkId, i18nUrl);
-                }
-                return originalLoadScript.call(__webpack_require__, url, done, key, chunkId);
-              }
+        var url = window.location.href;
+        var groupConfig = ${JSON.stringify(customGroups)};
 
-              var i18nScript = document.createElement('script');
-              i18nScript.src = i18nUrl;
-              i18nScript.onload = function() {
-                loadedGroups[groupName] = true;
-                originalLoadScript.call(__webpack_require__, url, done, key, chunkId);
-              };
-              i18nScript.onerror = function() {
-                if (typeof console !== 'undefined' && console.error) {
-                  console.error('[i18n-group:error]', groupName, i18nUrl);
-                }
-                originalLoadScript.call(__webpack_require__, url, done, key, chunkId);
-              };
-              document.head.appendChild(i18nScript);
-              return;
+        for (var groupName in groupConfig) {
+          var config = groupConfig[groupName];
+          if (config.urlPatterns && Array.isArray(config.urlPatterns)) {
+            for (var i = 0; i < config.urlPatterns.length; i++) {
+              var pattern = config.urlPatterns[i];
+              if (url.includes(pattern)) {
+                return groupName;
+              }
             }
           }
+        }
 
-          return originalLoadScript.call(__webpack_require__, url, done, key, chunkId);
-        };
+        return null;
       }
 
-      function installLoadScriptHook(loadScript) {
-        if (typeof loadScript !== 'function') {
-          Object.defineProperty(__webpack_require__, 'l', {
-            configurable: true,
-            enumerable: true,
-            get: function() {
-              return loadScript;
-            },
-            set: function(newLoader) {
-              installLoadScriptHook(newLoader);
+      function checkAndLoadGroupFromUrl() {
+        try {
+          var detectedGroup = detectGroupFromUrl();
+          if (detectedGroup && !loadedGroups[detectedGroup]) {
+            if (isDev) {
+              console.log('[i18n-group:url-detect]', detectedGroup, 'loading for current URL');
             }
-          });
-          return;
+            loadI18nGroup(detectedGroup, 'url-detection').catch(function(err) {
+              if (isDev) {
+                console.error('[i18n-group:url-detect] Failed to load', detectedGroup, ':', err);
+              }
+            });
+          }
+        } catch (err) {
+          if (isDev) {
+            console.error('[i18n-group:url-detect] Error in URL detection:', err);
+          }
         }
-
-        Object.defineProperty(__webpack_require__, 'l', {
-          configurable: true,
-          enumerable: true,
-          writable: true,
-          value: wrapLoadScript(loadScript)
-        });
       }
 
-      if (typeof __webpack_require__.l === 'function') {
-        installLoadScriptHook(__webpack_require__.l);
-      } else {
-        Object.defineProperty(__webpack_require__, 'l', {
-          configurable: true,
-          enumerable: true,
-          set: function(newLoader) {
-            installLoadScriptHook(newLoader);
-          },
-          get: function() {
-            return undefined;
+      // Initialize preload and prefetch mechanisms
+      function initializeGroupLoading() {
+        if (typeof window === 'undefined') return;
+
+        var groupConfig = ${JSON.stringify(customGroups)};
+
+        // 1. Immediate preload for critical groups
+        for (var groupName in groupConfig) {
+          var config = groupConfig[groupName];
+          if (config.preload === true && !loadedGroups[groupName]) {
+            if (isDev) {
+              console.log('[i18n-group:preload]', groupName, 'loading immediately');
+            }
+            loadI18nGroup(groupName, 'preload').catch(function(err) {
+              if (isDev) {
+                console.error('[i18n-group:preload] Failed to preload', groupName, ':', err);
+              }
+            });
           }
-        });
+        }
+
+        // 2. Schedule prefetch for background loading
+        function schedulePrefetch() {
+          for (var groupName in groupConfig) {
+            var config = groupConfig[groupName];
+            if (config.prefetch === true && !loadedGroups[groupName] && config.preload !== true) {
+              if (isDev) {
+                console.log('[i18n-group:prefetch]', groupName, 'scheduling background load');
+              }
+              loadI18nGroup(groupName, 'prefetch').catch(function(err) {
+                if (isDev) {
+                  console.error('[i18n-group:prefetch] Failed to prefetch', groupName, ':', err);
+                }
+              });
+            }
+          }
+        }
+
+        // Use requestIdleCallback for prefetch if available, otherwise setTimeout
+        if (window.requestIdleCallback) {
+          window.requestIdleCallback(schedulePrefetch, { timeout: 5000 });
+        } else {
+          setTimeout(schedulePrefetch, 100);
+        }
+
+        // 3. Check current URL for immediate loading
+        checkAndLoadGroupFromUrl();
       }
+
+      // Initialize loading mechanisms
+      initializeGroupLoading();
     })();
     `;
   }

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

@@ -1,23 +1,30 @@
 "use strict";
 
-const HtmlWebpackPlugin = require('html-webpack-plugin');
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.I18nNumericIndexHtmlInjectorPlugin = void 0;
 
-const path = require('path');
+var _htmlWebpackPlugin = _interopRequireDefault(require("html-webpack-plugin"));
+
+var _path = _interopRequireDefault(require("path"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const pluginName = 'I18nNumericIndexHtmlInjectorPlugin';
+const assetStoreKey = Symbol.for('I18nNumericIndexPluginAssets');
 
 class I18nNumericIndexHtmlInjectorPlugin {
   constructor(options) {
     this.options = { ...options,
-      injectI18nUrlInIndex: options.injectI18nUrlInIndex !== undefined ? options.injectI18nUrlInIndex : true // Default to true
-
+      injectI18nUrlInIndex: options.injectI18nUrlInIndex !== undefined ? options.injectI18nUrlInIndex : true,
+      includeContentHash: options.includeContentHash || false
     };
   }
 
   apply(compiler) {
     compiler.hooks.thisCompilation.tap(pluginName, compilation => {
-      HtmlWebpackPlugin.getHooks(compilation).beforeAssetTagGeneration.tapAsync(pluginName, (hookData, cb) => {
-        // Skip HTML injection if injectI18nUrlInIndex is false
+      _htmlWebpackPlugin.default.getHooks(compilation).beforeAssetTagGeneration.tapAsync(pluginName, (hookData, cb) => {
         if (!this.options.injectI18nUrlInIndex) {
           return cb(null, hookData);
         }
@@ -26,7 +33,7 @@ class I18nNumericIndexHtmlInjectorPlugin {
           assets
         } = hookData;
         const {
-          outputFolder,
+          outputFolder = 'i18n-chunk',
           numericFilenameTemplate,
           dynamicFilenameTemplate,
           singleFileTemplate,
@@ -34,47 +41,55 @@ class I18nNumericIndexHtmlInjectorPlugin {
           singleFile,
           i18nAssetsPublicPathPrefix = ''
         } = this.options;
-        const newI18nAssetUrlsToAdd = []; // Construct full paths using outputFolder
-
-        const constructFullPath = (template, isSingleFile = false) => {
-          if (!template) return null; // Replace locale placeholder
-
-          let filePath = template.replace(/\[locale\]/g, htmlTemplateLabel); // Remove [contenthash] placeholder for HTML injection
-          // The actual hash will be determined at build time
-
-          filePath = filePath.replace(/\.\[contenthash\]/g, ''); // If template already contains outputFolder or starts with a path separator, use as-is
+        const newI18nAssetUrlsToAdd = [];
+        const emittedAssetNames = compilation.getAssets().map(asset => asset.name);
+        const recordedAssets = compilation[assetStoreKey] || [];
+
+        const resolveAssetPath = (template, fileType) => {
+          if (!template) return null;
+          const recorded = recordedAssets.find(asset => {
+            if (fileType === 'single') return !asset.fileType;
+            return asset.fileType === fileType;
+          });
+
+          if (recorded) {
+            const assetPath = recorded.outputPath.replace(recorded.locale, htmlTemplateLabel);
+            return i18nAssetsPublicPathPrefix + assetPath;
+          }
 
-          if (filePath.includes(outputFolder) || filePath.startsWith('/')) {
-            return filePath.replace(/\\/g, '/');
-          } // For single-file mode with a simple template like '[locale].js', 
-          // put it directly in outputFolder without subdirectories
+          const filePath = template.replace(/\[locale\]/g, htmlTemplateLabel);
+          const fullPath = filePath.includes(outputFolder) || filePath.startsWith('/') ? filePath : _path.default.join(outputFolder, filePath);
 
+          if (emittedAssetNames.includes(fullPath)) {
+            return i18nAssetsPublicPathPrefix + fullPath;
+          }
 
-          if (isSingleFile && !filePath.includes('/')) {
-            return path.join(outputFolder || 'i18n-chunk', filePath).replace(/\\/g, '/');
-          } // For other cases, preserve subdirectories
+          if (fullPath.includes('[contenthash]')) {
+            const pattern = fullPath.replace('[contenthash]', '*');
+            const matchingAsset = emittedAssetNames.find(name => name.startsWith(pattern.split('*')[0]) && name.endsWith(pattern.split('*')[1]));
 
+            if (matchingAsset) {
+              return i18nAssetsPublicPathPrefix + matchingAsset;
+            }
+          }
 
-          return path.join(outputFolder || 'i18n-chunk', filePath).replace(/\\/g, '/');
+          return i18nAssetsPublicPathPrefix + fullPath;
         };
 
         if (singleFile) {
-          // In single file mode, use singleFileTemplate
-          const singleTemplate = singleFileTemplate || '[locale].js';
-          const combinedFilename = constructFullPath(singleTemplate, true);
+          const combinedFilename = resolveAssetPath(singleFileTemplate, 'single');
 
           if (combinedFilename) {
             newI18nAssetUrlsToAdd.push(combinedFilename);
           }
         } else {
-          // Add both numeric and dynamic files
-          const numericFilename = constructFullPath(numericFilenameTemplate);
+          const numericFilename = resolveAssetPath(numericFilenameTemplate, 'numeric');
 
           if (numericFilename) {
             newI18nAssetUrlsToAdd.push(numericFilename);
           }
 
-          const dynamicFilename = constructFullPath(dynamicFilenameTemplate);
+          const dynamicFilename = resolveAssetPath(dynamicFilenameTemplate, 'dynamic');
 
           if (dynamicFilename) {
             newI18nAssetUrlsToAdd.push(dynamicFilename);
@@ -82,17 +97,14 @@ class I18nNumericIndexHtmlInjectorPlugin {
         }
 
         if (newI18nAssetUrlsToAdd.length > 0) {
-          // Add i18n assets to the beginning of JS assets for early loading
           assets.js = [...newI18nAssetUrlsToAdd, ...assets.js];
         }
 
-        cb(null, hookData);
+        return cb(null, hookData);
       });
     });
   }
 
 }
 
-module.exports = {
-  I18nNumericIndexHtmlInjectorPlugin
-};
+exports.I18nNumericIndexHtmlInjectorPlugin = I18nNumericIndexHtmlInjectorPlugin;