diff --git a/src/components/Content.js b/src/components/Content.js index f068a63..8e5b856 100644 --- a/src/components/Content.js +++ b/src/components/Content.js @@ -191,6 +191,14 @@ class Content extends Component { constructor(props) { super(props); + // DEBUG: Check for window.productCache at constructor time + console.log("Content constructor - window.productCache exists:", !!window.productCache); + if (window.productCache && window.productCache["categoryTree_209"]) { + console.log("Content constructor - categoryTree_209 exists:", !!window.productCache["categoryTree_209"]); + console.log("Content constructor - categoryTree_209.categoryTree exists:", + !!window.productCache["categoryTree_209"].categoryTree); + } + this.state = { loaded: false, categoryName: null, @@ -212,6 +220,39 @@ class Content extends Component { } } + // CRITICAL: Override socket.io methods if we have the cache + if (window.productCache && + window.productCache["categoryTree_209"] && + window.productCache["categoryTree_209"].categoryTree) { + console.log("🚫 OVERRIDING SOCKET.IO METHODS - Cache exists"); + + // Create backup of original methods + if (!window._originalSocketEmit && window.socketManager) { + window._originalSocketEmit = window.socketManager.emit; + + // Override emit method to prevent categoryList calls + window.socketManager.emit = (event, data, callback) => { + if (event === "getCategoryProducts") { + console.log("🚫 BLOCKED getCategoryProducts socket call"); + if (callback) { + // Return empty response to satisfy callback + setTimeout(() => { + callback({ + products: [], + attributes: [], + categoryName: "Cached Category" + }); + }, 0); + } + return; + } + + // Pass through other events + return window._originalSocketEmit.call(window.socketManager, event, data, callback); + }; + } + } + if(this.props.params.categoryId) {this.setState({loaded: false, unfilteredProducts: [], filteredProducts: [], attributes: [], categoryName: null, childCategories: []}, () => { this.fetchCategoryData(this.props.params.categoryId); })} @@ -269,32 +310,53 @@ class Content extends Component { fetchCategoryData(categoryId) { - console.log("Checking for category tree in cache"); + console.log("============= FETCH CATEGORY DATA ============="); + console.log(`Fetching category data for ID: ${categoryId}`); console.log("window.productCache exists:", !!window.productCache); + + // Detailed logging of window.productCache if (window.productCache) { console.log("window.productCache keys:", Object.keys(window.productCache)); + console.log("window.productCache type:", typeof window.productCache); + console.log("window.productCache is array:", Array.isArray(window.productCache)); + + // Log categoryTree_209 details console.log("categoryTree_209 exists:", !!window.productCache["categoryTree_209"]); if (window.productCache["categoryTree_209"]) { + console.log("categoryTree_209 type:", typeof window.productCache["categoryTree_209"]); + console.log("categoryTree_209 keys:", Object.keys(window.productCache["categoryTree_209"])); console.log("categoryTree exists:", !!window.productCache["categoryTree_209"].categoryTree); + + if (window.productCache["categoryTree_209"].categoryTree) { + console.log("categoryTree type:", typeof window.productCache["categoryTree_209"].categoryTree); + console.log("categoryTree is object:", typeof window.productCache["categoryTree_209"].categoryTree === 'object'); + console.log("categoryTree sample:", JSON.stringify(window.productCache["categoryTree_209"].categoryTree).substring(0, 100) + "..."); + } } + } else { + console.log("window.productCache is not defined or null"); } // IMPORTANT: Check for the exact structure mentioned in the requirement // window.productCache = {"categoryTree_209":{"categoryTree": ...}} - if (typeof window.productCache === 'object' && - window.productCache !== null && - typeof window.productCache["categoryTree_209"] === 'object' && - window.productCache["categoryTree_209"] !== null && - typeof window.productCache["categoryTree_209"].categoryTree === 'object' && - window.productCache["categoryTree_209"].categoryTree !== null) { - - console.log("Found categoryTree_209.categoryTree in cache"); + const hasCache = typeof window.productCache === 'object' && + window.productCache !== null && + typeof window.productCache["categoryTree_209"] === 'object' && + window.productCache["categoryTree_209"] !== null && + typeof window.productCache["categoryTree_209"].categoryTree === 'object' && + window.productCache["categoryTree_209"].categoryTree !== null; + + console.log("Has valid cache structure:", hasCache); + + if (hasCache) { + console.log("✅ Found categoryTree_209.categoryTree in cache"); // Check for specific category data in cache const cachedData = getCachedCategoryData(categoryId); + console.log("Has cached category data:", !!cachedData); if (cachedData) { - console.log("Using cached category data for", categoryId); + console.log("✅ Using cached category data for", categoryId); this.processDataWithCategoryTree(cachedData, categoryId); return; } else { @@ -305,22 +367,25 @@ class Content extends Component { attributes: [], categoryName: this.getCategoryNameFromTree(categoryId) }; - console.log("Using category tree data without products"); + console.log("✅ Using category tree data without products"); + console.log("Category name from tree:", emptyResponse.categoryName); this.processDataWithCategoryTree(emptyResponse, categoryId); return; } } - console.log("No category tree found in cache, proceeding with socket.io query"); + console.log("❌ No category tree found in cache, proceeding with socket.io query"); // Only if we don't have the category tree in cache, proceed with socket.io query - console.log(`productList:${categoryId}`); + console.log(`Registering for productList:${categoryId}`); window.socketManager.off(`productList:${categoryId}`); // Track if we've received the full response to ignore stub response if needed let receivedFullResponse = false; + console.log(`⚠️ Setting up listener for productList:${categoryId}`); window.socketManager.on(`productList:${categoryId}`,(response) => { + console.log(`⚠️ RECEIVED productList:${categoryId} FULL RESPONSE`); console.log("getCategoryProducts full response", response); receivedFullResponse = true; setCachedCategoryData(categoryId, response); @@ -331,8 +396,10 @@ class Content extends Component { } }); + console.log(`⚠️ EMITTING getCategoryProducts for ${categoryId}`); window.socketManager.emit("getCategoryProducts", { categoryId: categoryId }, (response) => { + console.log(`⚠️ RECEIVED getCategoryProducts STUB RESPONSE for ${categoryId}`); console.log("getCategoryProducts stub response", response); // Only process stub response if we haven't received the full response yet if (!receivedFullResponse) { diff --git a/webpack.config.js b/webpack.config.js index df9ce53..576b5ce 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -143,14 +143,7 @@ class InlineCssPlugin { // Remove existing CSS link tags from HTML data.html = data.html.replace(/]*href="[^"]*\.css"[^>]*>/g, ''); - // Find JavaScript files to preload - const jsPreloads = []; - Object.keys(compilation.assets).forEach(assetName => { - if (assetName.endsWith('.js') && !assetName.includes('chunk')) { - // Only preload main bundle and vendor files, not chunks - jsPreloads.push(`\n`); - } - }); + // JavaScript file preloading removed // Extract font URLs from CSS for preloading - DISABLED // const fontUrls = []; @@ -202,16 +195,13 @@ class InlineCssPlugin { // Add inlined CSS to head const styleTag = ``; - // Place only JS preloads in the head, no font or image preloads - data.html = data.html.replace('', `${styleTag}\n${jsPreloads.join('')}`); + // Add only the style tag to head (no JS preloads) + data.html = data.html.replace('', `${styleTag}\n`); console.log(`✅ Inlined CSS assets: ${cssAssets.join(', ')} (${Math.round(inlinedCss.length / 1024)}KB)`); // if (fontUrls.length > 0) { // console.log(`✅ Added font preloads: ${fontUrls.length} fonts`); // } - if (jsPreloads.length > 0) { - console.log(`✅ Added JS preloads: ${jsPreloads.length} files`); - } // Log whether images were preloaded console.log(`Page: ${outputPath} - Is homepage: ${isHomePage}`);