Skip to content

‘Magento_Customer/js/customer-data’ javascript does not get cart items of customer

I have this code as below in a custom module

define([
    'rjsResolver',
    'Magento_Customer/js/customer-data',
    'jquery'
], function (resolver, customerData, $) {
    'use strict';

    return function (checkoutLoader) {

        var mixin = {

            gtmEventTrigger: function() {

                console.log("Init Checkout Loader");

                console.log(customerData);
                // console.log(customerData.get('cart'));
                // console.log(customerData.get('cart')());

                $(cart_items).each(function(index,productData){

                    product_detail = {};

                    product_name = productData['product_name'];

                    product_detail = {
                        'item_name':product_name,
                    }

                    products.push(product_detail);
                })

                dataLayer.push({
                'event': 'begin_checkout',
                'ecommerce': {
                    'currency': 'MYR',
                    'value': grand_total,                
                    'items': products
                    }
                });

            }

        };

        mixin.gtmEventTrigger();

        return $.extend(checkoutLoader, mixin);
    };
});

I would like to know what is causing the customer cart data unable to be retrieved through the code console.log(customerData.get('cart')); , when I console.log I receive undefined value

Appreciate if someone can advise what is the correct way to write the codes to retrieve this customer cart data through a .js file

The location of the file is as follows

app/code/SR/ModifiedCheckout/view/frontend/web/js/checkout-loader.js

in which the checkout-loader.js is loaded like this

var config = {
    config: {
        mixins: {
            'Magento_Checkout/js/checkout-loader': {
                'SR_ModifiedCheckout/js/checkout-loader': true
            }
        }
    }
};

in the file path app/code/SR/ModifiedCheckout/view/frontend/requirejs-config.js