From 72959b02220dc30b1b1cc33ef6fbada4c47d1e2e Mon Sep 17 00:00:00 2001 From: dylandepass Date: Wed, 1 Oct 2025 14:49:51 -0400 Subject: [PATCH 1/6] fix: explore bfcache issues --- blocks/pdp/add-to-cart.js | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) diff --git a/blocks/pdp/add-to-cart.js b/blocks/pdp/add-to-cart.js index d3afa4fa..df6ca72d 100644 --- a/blocks/pdp/add-to-cart.js +++ b/blocks/pdp/add-to-cart.js @@ -167,6 +167,16 @@ export default function renderAddToCart(block, parent) { const addToCartButton = document.createElement('button'); addToCartButton.textContent = 'Add to Cart'; + // reset button state when page is restored from bfcache + window.addEventListener('pageshow', (event) => { + console.log('pageshow event', event); + if (event.persisted) { + // Page was restored from bfcache, reset button state + addToCartButton.textContent = 'Add to Cart'; + addToCartButton.removeAttribute('aria-disabled'); + } + }); + // add click event handler for add to cart functionality addToCartButton.addEventListener('click', async () => { // update button state to show loading @@ -214,10 +224,10 @@ export default function renderAddToCart(block, parent) { } catch (error) { // eslint-disable-next-line no-console console.error('Failed to add item to cart', error); - } finally { + window.location.href = '/us/en_us/checkout/cart/'; // update button state to show ATC - addToCartButton.textContent = 'Add to Cart'; - addToCartButton.removeAttribute('aria-disabled'); + // addToCartButton.textContent = 'Add to Cart'; + // addToCartButton.removeAttribute('aria-disabled'); } }); From 836b2af1e095c309aac41c885a386f6b94407aaa Mon Sep 17 00:00:00 2001 From: dylandepass Date: Wed, 1 Oct 2025 14:53:13 -0400 Subject: [PATCH 2/6] fix: move outside of finally --- blocks/pdp/add-to-cart.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/blocks/pdp/add-to-cart.js b/blocks/pdp/add-to-cart.js index df6ca72d..969ef313 100644 --- a/blocks/pdp/add-to-cart.js +++ b/blocks/pdp/add-to-cart.js @@ -224,11 +224,11 @@ export default function renderAddToCart(block, parent) { } catch (error) { // eslint-disable-next-line no-console console.error('Failed to add item to cart', error); - window.location.href = '/us/en_us/checkout/cart/'; - // update button state to show ATC - // addToCartButton.textContent = 'Add to Cart'; - // addToCartButton.removeAttribute('aria-disabled'); } + + // update button state to show ATC + addToCartButton.textContent = 'Add to Cart'; + addToCartButton.removeAttribute('aria-disabled'); }); // assemble the quantity container with select and button From ff38180f6ebc0d193307bad06389a9995b6d8c54 Mon Sep 17 00:00:00 2001 From: dylandepass Date: Wed, 1 Oct 2025 14:57:20 -0400 Subject: [PATCH 3/6] fix: remove window event --- blocks/pdp/add-to-cart.js | 10 ---------- 1 file changed, 10 deletions(-) diff --git a/blocks/pdp/add-to-cart.js b/blocks/pdp/add-to-cart.js index 969ef313..dfd1fadb 100644 --- a/blocks/pdp/add-to-cart.js +++ b/blocks/pdp/add-to-cart.js @@ -167,16 +167,6 @@ export default function renderAddToCart(block, parent) { const addToCartButton = document.createElement('button'); addToCartButton.textContent = 'Add to Cart'; - // reset button state when page is restored from bfcache - window.addEventListener('pageshow', (event) => { - console.log('pageshow event', event); - if (event.persisted) { - // Page was restored from bfcache, reset button state - addToCartButton.textContent = 'Add to Cart'; - addToCartButton.removeAttribute('aria-disabled'); - } - }); - // add click event handler for add to cart functionality addToCartButton.addEventListener('click', async () => { // update button state to show loading From 49738a4e7c0285c04512ee1dfaf5a3d1dcb90cd2 Mon Sep 17 00:00:00 2001 From: dylandepass Date: Wed, 1 Oct 2025 15:09:19 -0400 Subject: [PATCH 4/6] fix: add bfcache listener --- blocks/pdp/add-to-cart.js | 17 +++++++++++++++-- 1 file changed, 15 insertions(+), 2 deletions(-) diff --git a/blocks/pdp/add-to-cart.js b/blocks/pdp/add-to-cart.js index dfd1fadb..9fcdbc2f 100644 --- a/blocks/pdp/add-to-cart.js +++ b/blocks/pdp/add-to-cart.js @@ -1,5 +1,5 @@ import { getMetadata } from '../../scripts/aem.js'; -import { checkOutOfStock } from '../../scripts/scripts.js'; +import { checkOutOfStock, getLocaleAndLanguage } from '../../scripts/scripts.js'; /** * Renders "Find Locally" button container. @@ -209,8 +209,9 @@ export default function renderAddToCart(block, parent) { // add product to cart with selected options and quantity await cartApi.addToCart(sku, selectedOptions, quantity); + const { locale, language } = await getLocaleAndLanguage(); // redirect to cart page after successful addition - window.location.href = '/us/en_us/checkout/cart/'; + window.location.href = `/${locale}/${language}/checkout/cart/`; } catch (error) { // eslint-disable-next-line no-console console.error('Failed to add item to cart', error); @@ -229,3 +230,15 @@ export default function renderAddToCart(block, parent) { return addToCartContainer; } + +window.addEventListener('pageshow', (event) => { + console.log('pageshow event', event); + if (event.persisted) { + // Page was restored from bfcache, reset any button states + const addToCartButton = document.querySelector('.add-to-cart button'); + if (addToCartButton) { + addToCartButton.textContent = 'Add to Cart'; + addToCartButton.removeAttribute('aria-disabled'); + } + } +}); From 87f559251c61c54fba6b9b6c183565ea4452bfa4 Mon Sep 17 00:00:00 2001 From: dylandepass Date: Wed, 1 Oct 2025 15:13:16 -0400 Subject: [PATCH 5/6] fix: cleanup --- blocks/pdp/add-to-cart.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/blocks/pdp/add-to-cart.js b/blocks/pdp/add-to-cart.js index 9fcdbc2f..9ce3705c 100644 --- a/blocks/pdp/add-to-cart.js +++ b/blocks/pdp/add-to-cart.js @@ -215,11 +215,11 @@ export default function renderAddToCart(block, parent) { } catch (error) { // eslint-disable-next-line no-console console.error('Failed to add item to cart', error); - } - // update button state to show ATC - addToCartButton.textContent = 'Add to Cart'; - addToCartButton.removeAttribute('aria-disabled'); + // update button state to re-enable atc + addToCartButton.textContent = 'Add to Cart'; + addToCartButton.removeAttribute('aria-disabled'); + } }); // assemble the quantity container with select and button @@ -231,10 +231,10 @@ export default function renderAddToCart(block, parent) { return addToCartContainer; } +// reset button state when page is restored from bfcache window.addEventListener('pageshow', (event) => { - console.log('pageshow event', event); if (event.persisted) { - // Page was restored from bfcache, reset any button states + // Page was restored from bfcache const addToCartButton = document.querySelector('.add-to-cart button'); if (addToCartButton) { addToCartButton.textContent = 'Add to Cart'; From 6fc2c0728cbd342a6c581146712234076c7b90e8 Mon Sep 17 00:00:00 2001 From: dylandepass Date: Wed, 1 Oct 2025 15:26:29 -0400 Subject: [PATCH 6/6] fix: address changing uenc string in tests --- tests/pdp/integration.spec.js | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/tests/pdp/integration.spec.js b/tests/pdp/integration.spec.js index 777f9c66..9defc1ea 100644 --- a/tests/pdp/integration.spec.js +++ b/tests/pdp/integration.spec.js @@ -190,7 +190,8 @@ test.describe('PDP Integration Tests', () => { await page.route('**/us/en_us/checkout/cart/add/**', async (route) => { // check that the correct uenc path segment exists const url = new URL(route.request().url()); - expect(url.pathname).toContain('/us/en_us/checkout/cart/add/uenc/aHR0cHM6Ly9hdGMtZXJyb3JzLS12aXRhbWl4LS1hZW1zaXRlcy5hZW0ubmV0d29yay91cy9lbl91cy9wcm9kdWN0cy9hc2NlbnQteDM=_Q09VUE9OPXRlc3QmbWFydGVjaD1vZmY=/product/3641/'); + expect(url.pathname).toContain('/us/en_us/checkout/cart/add/uenc/'); + expect(url.pathname).toContain('/product/3641/'); const requestBody = route.request().postData(); // requestBody is a multipart form data string @@ -368,7 +369,9 @@ test.describe('PDP Integration Tests', () => { await page.route('**/us/en_us/checkout/cart/add/**', async (route) => { // check that the correct uenc path segment exists const url = new URL(route.request().url()); - expect(url.pathname).toEqual('/us/en_us/checkout/cart/add/uenc/aHR0cHM6Ly9hdGMtZXJyb3JzLS12aXRhbWl4LS1hZW1zaXRlcy5hZW0ubmV0d29yay91cy9lbl91cy9wcm9kdWN0cy81MjAwLWxlZ2FjeS1idW5kbGU=_bWFydGVjaD1vZmY=/product/3701/'); + + expect(url.pathname).toContain('/us/en_us/checkout/cart/add/uenc/'); + expect(url.pathname).toContain('/product/3701/'); const requestBody = route.request().postData(); // requestBody is a multipart form data string