From f9cb80980b6e12a6d7e18ee380f6d9f66811442b Mon Sep 17 00:00:00 2001 From: Bandana Laishram Date: Mon, 24 Feb 2025 13:14:19 +0530 Subject: [PATCH 1/3] Adding onReady and onError callback for standalone footer --- libs/blocks/global-footer/global-footer.js | 14 ++++++- libs/navigation/bootstrapper.js | 1 + libs/navigation/navigation.js | 49 ++++++++++++++-------- 3 files changed, 44 insertions(+), 20 deletions(-) diff --git a/libs/blocks/global-footer/global-footer.js b/libs/blocks/global-footer/global-footer.js index 3bf311d5d1..77ffe83100 100644 --- a/libs/blocks/global-footer/global-footer.js +++ b/libs/blocks/global-footer/global-footer.js @@ -76,7 +76,16 @@ class Footer { shouldDecorateLinks: false, }); - if (!this.body) return; + if (!this.body) { + const error = new Error('Could not create global footer. Content not found!'); + error.tags = 'global-footer'; + error.url = url; + error.errorType = 'error'; + lanaLog({ message: error.message, ...error }); + const { onFooterError } = getConfig(); + onFooterError?.(error); + return; + } const [region, social] = ['.region-selector', '.social'].map((selector) => this.body.querySelector(selector)); const [regionParent, socialParent] = [region?.parentElement, social?.parentElement]; @@ -112,8 +121,9 @@ class Footer { const mepMartech = mep?.martech || ''; this.block.setAttribute('daa-lh', `gnav|${getExperienceName()}|footer${mepMartech}`); - this.block.append(this.elements.footer); + const { onFooterReady } = getConfig(); + onFooterReady?.(); }, 'Failed to decorate footer content', 'global-footer', 'error'); loadMenuLogic = async () => { diff --git a/libs/navigation/bootstrapper.js b/libs/navigation/bootstrapper.js index 423132413d..4e91d982da 100644 --- a/libs/navigation/bootstrapper.js +++ b/libs/navigation/bootstrapper.js @@ -25,6 +25,7 @@ export default async function bootstrapBlock(initBlock, blockConfig) { { key: 'unavComponents', name: 'universal-nav' }, { key: 'redirect', name: 'adobe-home-redirect' }, { key: 'mobileGnavV2', name: 'mobile-gnav-v2' }, + { key: 'footerSource', name: 'footer-source' }, ]; metaTags.forEach((tag) => { const { key } = tag; diff --git a/libs/navigation/navigation.js b/libs/navigation/navigation.js index 33e86a2d3e..5b68851b53 100644 --- a/libs/navigation/navigation.js +++ b/libs/navigation/navigation.js @@ -124,6 +124,8 @@ export default async function loadBlock(configs, customLib) { stageDomainsMap: getStageDomainsMap(stageDomainsMap), origin: `https://main--federal--adobecom.aem.${env === 'prod' ? 'live' : 'page'}`, allowedOrigins: [...allowedOrigins, `https://main--federal--adobecom.aem.${env === 'prod' ? 'live' : 'page'}`], + onFooterReady: footer?.onReady, + onFooterError: footer?.onError, ...paramConfigs, }; setConfig(clientConfig); @@ -131,9 +133,11 @@ export default async function loadBlock(configs, customLib) { const configBlock = configs[block.key]; const config = getConfig(); const gnavSource = `${config?.locale?.contentRoot}/gnav`; - try { - if (configBlock) { - if (block.key === 'header') { + const footerSource = `${config?.locale?.contentRoot}/footer`; + + if (configBlock) { + if (block.key === 'header') { + try { const { default: init } = await import('../blocks/global-navigation/global-navigation.js'); await bootstrapBlock(init, { ...block, @@ -146,24 +150,33 @@ export default async function loadBlock(configs, customLib) { isLocalNav: configBlock.isLocalNav, mobileGnavV2: configBlock.mobileGnavV2 || 'off', }); - } else if (block.key === 'footer') { - try { - await import('./footer.css'); - } catch (e) { - loadStyle(`${miloLibs}/libs/navigation/footer.css`); - } + configBlock.onReady?.(); + } catch (e) { + configBlock.onError?.(e); + window.lana.log(`${e.message} | gnav-source: ${gnavSource} | href: ${window.location.href}`, { + clientId: 'feds-milo', + tags: 'standalone-gnav', + errorType: e.errorType, + }); + } + } else if (block.key === 'footer') { + try { + await import('./footer.css'); + } catch (e) { + loadStyle(`${miloLibs}/libs/navigation/footer.css`); + } + try { const { default: init } = await import('../blocks/global-footer/global-footer.js'); - await bootstrapBlock(init, { ...block }); + await bootstrapBlock(init, { ...block, footerSource }); + } catch (e) { + configBlock.onError?.(e); + window.lana.log(`${e.message} | footer-source: ${footerSource} | href: ${window.location.href}`, { + clientId: 'feds-milo', + tags: 'standalone-footer', + errorType: e.errorType, + }); } - configBlock.onReady?.(); } - } catch (e) { - configBlock.onError?.(e); - window.lana.log(`${e.message} | gnav-source: ${gnavSource} | href: ${window.location.href}`, { - clientId: 'feds-milo', - tags: 'standalone-gnav', - errorType: e.errorType, - }); } } } From 52e176e2ca22d714896d78ed69b12382cdedb044 Mon Sep 17 00:00:00 2001 From: Bandana Laishram Date: Thu, 27 Feb 2025 13:39:25 +0530 Subject: [PATCH 2/3] Code fix --- libs/navigation/navigation.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/libs/navigation/navigation.js b/libs/navigation/navigation.js index 5b68851b53..9fbb6db37b 100644 --- a/libs/navigation/navigation.js +++ b/libs/navigation/navigation.js @@ -159,7 +159,8 @@ export default async function loadBlock(configs, customLib) { errorType: e.errorType, }); } - } else if (block.key === 'footer') { + } + if (block.key === 'footer') { try { await import('./footer.css'); } catch (e) { From 369e48ed5da21f8a4b38b5338ae946c27b17b352 Mon Sep 17 00:00:00 2001 From: Bandana Laishram Date: Thu, 6 Mar 2025 14:33:39 +0530 Subject: [PATCH 3/3] Changing footer css import to non blocking --- libs/navigation/navigation.js | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/libs/navigation/navigation.js b/libs/navigation/navigation.js index 9fbb6db37b..3d9eb80016 100644 --- a/libs/navigation/navigation.js +++ b/libs/navigation/navigation.js @@ -131,11 +131,11 @@ export default async function loadBlock(configs, customLib) { setConfig(clientConfig); for await (const block of blockConfig) { const configBlock = configs[block.key]; - const config = getConfig(); - const gnavSource = `${config?.locale?.contentRoot}/gnav`; - const footerSource = `${config?.locale?.contentRoot}/footer`; if (configBlock) { + const config = getConfig(); + const gnavSource = `${config?.locale?.contentRoot}/gnav`; + const footerSource = `${config?.locale?.contentRoot}/footer`; if (block.key === 'header') { try { const { default: init } = await import('../blocks/global-navigation/global-navigation.js'); @@ -161,11 +161,9 @@ export default async function loadBlock(configs, customLib) { } } if (block.key === 'footer') { - try { - await import('./footer.css'); - } catch (e) { + import('./footer.css').catch(() => { loadStyle(`${miloLibs}/libs/navigation/footer.css`); - } + }); try { const { default: init } = await import('../blocks/global-footer/global-footer.js'); await bootstrapBlock(init, { ...block, footerSource });