How to Create mixin for Checkout Shipping information js and for summary Shipping js and change getShippingMethodTitle method

How to Create mixin  for Checkout Shipping   information js and for   summary Shipping js and  change  getShippingMethodTitle  method

Create a basic module, see the post

 

Create

 

app/code/Armmage/Custom/view/frontend/requirejs-config.js

 

var config = {
    config: {
        mixins: {
            'Magento_Checkout/js/view/summary/shipping': {
                'Armmage_Custom/js/view/summary/shipping-mixin': true
            },
            'Magento_Checkout/js/view/shipping-information': {
                'Armmage_Custom/js/view/summary/shipping-information-mixin': true
            },
        }
    }
};

 

 

 

create The files

 

app/code/Armmage/Custom/view/frontend/web/js/view/summary/shipping-information-mixin.js

 

/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */

 define([
    'jquery',
    'uiComponent',
    'Magento_Checkout/js/model/quote',
    'Magento_Checkout/js/model/step-navigator',
    'Magento_Checkout/js/model/sidebar'
], function ($, Component, quote, stepNavigator, sidebarModel) {
    'use strict';

    var mixin = {
      
         /**
         * @return {String}
         */
          getShippingMethodTitle: function () {
            var shippingMethod = quote.shippingMethod();
        
            return shippingMethod ? shippingMethod['carrier_title'] + ' - ' + shippingMethod['method_title'] + ' some title' : '';
        },
    };

    /**
     * Override default getShippingMethodTitle
     */
    return function (OriginShipping) {
        return OriginShipping.extend(mixin);
    };
});

 

app/code/Armmage/Custom/view/frontend/web/js/view/summary/shipping-mixin.js

 

/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */

 define([
    'mage/utils/wrapper',
    'Magento_Checkout/js/model/quote',
], function (wrapper, quote) {
    'use strict';

    var mixin = {
      
        /**
         * @return {*}
         */
         getShippingMethodTitle: function () {
            var shippingMethod = '',
                shippingMethodTitle = '';

            if (!this.isCalculated()) {
                return '';
            }
            shippingMethod = quote.shippingMethod();

            if (typeof shippingMethod['method_title'] !== 'undefined') {
                shippingMethodTitle = ' - ' + shippingMethod['method_title'];
            }
         
          return shippingMethod ?
          shippingMethod['carrier_title'] + shippingMethodTitle + 'some other title' :
          shippingMethod['carrier_title'];
        },
    };

    /**
     * Override default getShippingMethodTitle
     */
    return function (OriginShipping) {
        return OriginShipping.extend(mixin);
    };
});


If this solution isn't working for you, seek answers from ChatGPT


Please note that to ensure accurate and relevant responses, your questions should be related to Magento 2.

Ready to elevate your e-commerce business?

Let's talk about your business goals. Contact us now to see how we can help achieve them.

 
Copyright © 2021-present ArmMage Inc. All rights reserved.