Uncaught TypeError: Cannot read property 'remove' of undefined in customer-data.js
After upgrading from Magento 2.3.7-p2 to Magento 2.4.3-p1, customer-data.js started erroring out in the checkout success page. Here's how to easily fix it in Magento 2.4.3-p1.
Uncaught TypeError: Cannot read property 'remove' of undefined
at customer-data.js:178
at Function._.each._.forEach (underscore.js:145)
at Object.remove (customer-data.js:177)
You can apply the following patch file via composer or by using: patch -p1 < customer-js.patch.
For Magento Commerce Cloud, add the .patch file to the /m2-hotfixes folder. It will apply automatically during deployment.
customer-js.patch
--- a/vendor/magento/module-customer/view/frontend/web/js/customer-data.js +++ b/vendor/magento/module-customer/view/frontend/web/js/customer-data.js @@ -17,7 +17,9 @@ ], function ($, _, ko, sectionConfig, url) { 'use strict'; - var options = {}, + var options = { + cookieLifeTime: 86400 //1 day by default + }, storage, storageInvalidation, invalidateCacheBySessionTimeOut, @@ -31,6 +33,22 @@ options.sectionLoadUrl = url.build('customer/section/load'); /** + * Storage initialization + */ + function initStorage() { + $.cookieStorage.setConf({ + path: '/', + expires: new Date(Date.now() + parseInt(options.cookieLifeTime, 10) * 1000), + samesite: 'lax' + }); + storage = $.initNamespaceStorage('mage-cache-storage').localStorage; + storageInvalidation = $.initNamespaceStorage('mage-cache-storage-section-invalidation').localStorage; + } + + // Initialize storage with default parameters to prevent JS errors while component still not initialized + initStorage(); + + /** * @param {Object} invalidateOptions */ invalidateCacheBySessionTimeOut = function (invalidateOptions) { @@ -216,15 +234,7 @@ /** * Storage init */ - initStorage: function () { - $.cookieStorage.setConf({ - path: '/', - expires: new Date(Date.now() + parseInt(options.cookieLifeTime, 10) * 1000), - samesite: 'lax' - }); - storage = $.initNamespaceStorage('mage-cache-storage').localStorage; - storageInvalidation = $.initNamespaceStorage('mage-cache-storage-section-invalidation').localStorage; - }, + initStorage: initStorage, /** * Retrieve the list of sections that has expired since last page reload. @@ -364,7 +374,10 @@ */ 'Magento_Customer/js/customer-data': function (settings) { options = settings; + + // re-init storage with a new settings customerData.initStorage(); + invalidateCacheBySessionTimeOut(settings); invalidateCacheByCloseCookieSession(); customerData.init();