@zohodesk/client_build_tool 0.0.11-exp.25.0 → 0.0.11-exp.27.0

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

@@ -18,30 +18,26 @@ class I18nGroupRuntimeModule extends _webpack.RuntimeModule {
   generate() {
     const {
       customGroups,
+      chunkIdToGroupMapping,
       localeVarName,
-      jsonpFunc,
-      i18nPublicPathVar
-    } = this.options; // Build chunk-to-group mapping from config
-
-    const chunkToGroup = {};
-    Object.entries(customGroups || {}).forEach(([groupName, config]) => {
-      const chunkNames = config.chunks || [];
-      chunkNames.forEach(chunkName => {
-        chunkToGroup[chunkName] = groupName;
-      });
-    });
+      i18nPublicPathVar,
+      groupAssetUrls,
+      includeContentHash
+    } = this.options;
+    const chunkIdToGroup = chunkIdToGroupMapping || {};
+    const hasGroupAssetOverrides = !!groupAssetUrls && Object.values(groupAssetUrls).some(localeMap => localeMap && Object.keys(localeMap).length > 0);
+    const hashAware = includeContentHash || hasGroupAssetOverrides;
     return `
     // I18n Group Loading Runtime
     (function() {
       var loadedGroups = {};
-      var chunkNameToGroup = ${JSON.stringify(chunkToGroup)};
+      var chunkIdToGroup = ${JSON.stringify(chunkIdToGroup)};
+      var groupAssetUrls = ${JSON.stringify(groupAssetUrls || {})};
+      var hashAware = ${hashAware ? 'true' : 'false'};
       var cachedI18nBase;
-      var loadReasonKey = '__i18nGroupLoadReason';
 
       function ensureTrailingSlash(path) {
-        if (!path) {
-          return '';
-        }
+        if (!path) return '';
         return path.charAt(path.length - 1) === '/' ? path : path + '/';
       }
 
@@ -52,39 +48,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;
@@ -112,24 +80,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();
@@ -148,167 +110,139 @@ 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;
-          
+
           script.onload = function() {
             loadedGroups[groupName] = true;
-            if (typeof console !== 'undefined' && console.log) {
-              console.log('[i18n-group:loaded]', groupName, loadReason || 'require', i18nUrl);
-            }
+            console.log('[i18n-group:loaded]', groupName, i18nUrl);
             resolve();
           };
 
           script.onerror = function() {
-            if (typeof console !== 'undefined' && console.error) {
-              console.error('[i18n-group:error]', groupName, i18nUrl);
-            }
+            console.error('[i18n-group:error]', groupName, i18nUrl);
             reject(new Error('Failed to load i18n group: ' + groupName));
           };
-          
+
           document.head.appendChild(script);
         });
       }
 
       function findGroupByChunkId(chunkId) {
-        var directGroup = chunkNameToGroup[chunkId];
-        if (directGroup) {
-          return directGroup;
-        }
-
-        var stringId = '' + chunkId;
-        if (chunkNameToGroup[stringId]) {
-          return chunkNameToGroup[stringId];
-        }
-
-        return undefined;
+        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) {
-          var promise = originalEnsureChunk.apply(this, arguments);
-          
-          // Check if this chunk needs an i18n group
+          var args = arguments;
+          var self = this;
           var groupName = findGroupByChunkId(chunkId);
+
           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 before the chunk
-            var loadReason = __webpack_require__[loadReasonKey] || 'require';
-            var i18nPromise = loadI18nGroup(groupName, loadReason);
-            // Chain the promises so i18n loads first
-            promise = Promise.all([promise, i18nPromise]).then(function(results) {
-              return results[0]; // Return the original chunk promise result
+            var i18nPromise = loadI18nGroup(groupName, 'require');
+
+            return i18nPromise.then(function() {
+              return originalEnsureChunk.apply(self, args);
+            }).catch(function(err) {
+              console.error('[i18n-group:critical] i18n failed, blocking chunk loading:', err);
+              return Promise.reject(new Error('Cannot load setup without i18n: ' + err.message));
             });
+          } else {
+            return originalEnsureChunk.apply(this, arguments);
           }
-          
-          return promise;
         };
       }
-      
-      // 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.indexOf(pattern) !== -1) {
+                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() {
+        var detectedGroup = detectGroupFromUrl();
+        if (detectedGroup && !loadedGroups[detectedGroup]) {
+          console.log('[i18n-group:url-detect]', detectedGroup, 'loading for current URL');
+          loadI18nGroup(detectedGroup, 'url-detection').catch(function(err) {
+            console.error('[i18n-group:url-detect] Failed to load', detectedGroup, ':', err);
           });
-          return;
         }
-
-        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]) {
+            console.log('[i18n-group:preload]', groupName, 'loading immediately');
+            loadI18nGroup(groupName, 'preload').catch(function(err) {
+              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) {
+              console.log('[i18n-group:prefetch]', groupName, 'scheduling background load');
+              loadI18nGroup(groupName, 'prefetch').catch(function(err) {
+                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

@@ -5,19 +5,20 @@ const HtmlWebpackPlugin = require('html-webpack-plugin');
 const path = require('path');
 
 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
+        // Skip HTML injection if disabled
         if (!this.options.injectI18nUrlInIndex) {
           return cb(null, hookData);
         }
@@ -26,7 +27,7 @@ class I18nNumericIndexHtmlInjectorPlugin {
           assets
         } = hookData;
         const {
-          outputFolder,
+          outputFolder = 'i18n-chunk',
           numericFilenameTemplate,
           dynamicFilenameTemplate,
           singleFileTemplate,
@@ -34,47 +35,61 @@ class I18nNumericIndexHtmlInjectorPlugin {
           singleFile,
           i18nAssetsPublicPathPrefix = ''
         } = this.options;
-        const newI18nAssetUrlsToAdd = []; // Construct full paths using outputFolder
+        const newI18nAssetUrlsToAdd = [];
+        const emittedAssetNames = compilation.getAssets().map(asset => asset.name);
+        const recordedAssets = compilation[assetStoreKey] || []; // Simple asset resolution using recorded assets first, then fallback to template
+
+        const resolveAssetPath = (template, fileType) => {
+          if (!template) return null; // Try to find from recorded assets first
+
+          const recorded = recordedAssets.find(asset => {
+            if (fileType === 'single') return !asset.fileType;
+            return asset.fileType === fileType;
+          });
+
+          if (recorded) {
+            // Use recorded asset with correct locale
+            const assetPath = recorded.outputPath.replace(recorded.locale, htmlTemplateLabel);
+            return i18nAssetsPublicPathPrefix + assetPath;
+          } // Fallback to template-based construction
 
-        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
+          const filePath = template.replace(/\[locale\]/g, htmlTemplateLabel);
+          const fullPath = filePath.includes(outputFolder) || filePath.startsWith('/') ? filePath : path.join(outputFolder, filePath); // Check if the exact asset exists
 
-          filePath = filePath.replace(/\.\[contenthash\]/g, ''); // If template already contains outputFolder or starts with a path separator, use as-is
+          if (emittedAssetNames.includes(fullPath)) {
+            return i18nAssetsPublicPathPrefix + fullPath;
+          } // For content hash templates, find matching asset
 
-          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
 
+          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 (isSingleFile && !filePath.includes('/')) {
-            return path.join(outputFolder || 'i18n-chunk', filePath).replace(/\\/g, '/');
-          } // For other cases, preserve subdirectories
+            if (matchingAsset) {
+              return i18nAssetsPublicPathPrefix + matchingAsset;
+            }
+          } // Return as-is for basic cases
 
 
-          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(singleTemplate, '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);
@@ -86,7 +101,7 @@ class I18nNumericIndexHtmlInjectorPlugin {
           assets.js = [...newI18nAssetUrlsToAdd, ...assets.js];
         }
 
-        cb(null, hookData);
+        return cb(null, hookData);
       });
     });
   }