Minicart component not working after 2.4.5 upgrade

Question

After recently upgrading a magento 2 install from 2.3.3 to 2.4.5 I'm having problems with the minicart UI Component not rendering anything.

After some investigation, it appears that component is having problems loading the KO template - on the current version of the live site it's adding in HTML there, whereas the upgraded version on our staging environment and locally isn't.

After some investigation, I discovered a way to list the registered UI components, which gives this list on the live site (v2.3.3):

reg = requirejs('uiRegistry');
reg.get(function(item) { console.log(item.name); }); 

and this list on the staging site (2.4.5)

So it appears there are a series of UI Components that aren't being loaded into the UI Registry, which I suspect is why the minicart isn't working. But I can't seem to work out why the components wouldn't be loading. I've tried loading the vanilla theme, and disabling a series of custom modules but haven't had much success.

The following errors are listed in the log, but from what I've seen on other Stack Overflow posts, they are unrelated and shouldn't be causing anything to break.

[2022-09-22T12:19:02.722190+00:00] report.INFO: Broken reference: the 'catalog.compare.sidebar' element cannot be added as child to 'sidebar.additional', because the latter doesn't exist [] []
[2022-09-22T12:19:02.724166+00:00] report.INFO: Broken reference: the 'sale.reorder.sidebar' element cannot be added as child to 'sidebar.additional', because the latter doesn't exist [] []
[2022-09-22T12:19:02.724652+00:00] report.INFO: Broken reference: the 'wishlist_sidebar' element cannot be added as child to 'sidebar.additional', because the latter doesn't exist [] []
[2022-09-22T12:19:02.725313+00:00] report.INFO: Broken reference: the 'multiple-wishlist_sidebar' element cannot be added as child to 'sidebar.additional', because the latter doesn't exist [] []
[2022-09-22T12:19:02.725751+00:00] report.INFO: Broken reference: the 'custom_info.order.success' element cannot be added as child to 'order.success.additional.info', because the latter doesn't exist [] []
[2022-09-22T12:19:02.726535+00:00] report.INFO: Broken reference: the 'custom_info.order.success' tries to reorder itself towards '', but their parents are different: 'order.success.additional.info' and '' respectively. [] []

Is there a way to debug this any further? I'm all out of ideas.

Answer 1

This turned out to be an extension (Scommerce AnalyticsSync) trying to require "jquery/jquery.cookie" in it's JavaScript in a file called "tracking.phtml", changing the dependency to "mage/cookie" fixed the issue.

Answer 2

In the last weeks we have been locally migrating our Magento to 2.4.5

I had a similar issue in minicart and other ui component like shipping address on checkout page

In my case the problem was the short closure of the html tag. We changed all tags like

<div class="step-title" translate="'Shipping Address'" data-role="title" />

in

<div class="step-title" translate="'Shipping Address'" data-role="title"></div>

Sometimes even custom knockout tags had to be changend

            <each args="$parent.getRegion($parent.getItemRenderer(item.product_type))"
                  render="{name: getTemplate(), data: item, afterRender: function() {$parents[1].initSidebar()}}"
            />

in

            <each args="$parent.getRegion($parent.getItemRenderer(item.product_type))"
                  render="{name: getTemplate(), data: item, afterRender: function() {$parents[1].initSidebar()}}"
            ></each>

Hope this work!