The checkout sidebar cart summary with the price is displayed on at payment step, I want to show them on the shipping step as well. is there any solution to do this?


Here I want to show:
enter image description here

This section:


Below step need to follow:

Step 1: create require config js files under the


var config = {
config: {
    mixins: {
        'Magento_Checkout/js/view/summary/abstract-total': {
            'Vendor_Modulename/js/view/summary/abstract-total-mixin': true
        'Magento_Checkout/js/view/summary/shipping': {
            'Vendor_Modulename/js/view/summary/shipping-mixin': true

Step 2: Create an abstract total js for showing order summary in step 1 as below


function (stepNavigator, quote, totalsDefaultProvider) {
    "use strict";

    var estimateTotalsShipping = function () {

    // this should be added to get correct totals

    return function (abstractTotal) {
        return abstractTotal.extend({
            isFullMode: function() {
                if (!this.getTotals() || stepNavigator.getActiveItemIndex() === 1) {
                    return false;
                return true; //add this line to display forcefully summary in shipping step.

Step 3: Create a file for showing shipping method in order summary total.


], function ($, Component, quote) {
    'use strict';
    return function (shipping) {
        return shipping.extend({
            getValue: function () {
                var price;

                if (!this.isCalculated()) {
                    return this.notCalculatedMessage;
                //var price =  this.totals().shipping_amount; //comment this line

                var shippingMethod = quote.shippingMethod(); //add these both line
                var price =  shippingMethod.amount; // update data on change of the shipping method

                return this.getFormattedPrice(price);
  • i have already done this. i did not used mixin because i am working in custom theme. – sudo55 Apr 23 '19 at 8:03
  • Mixin is used for needed parts to change that function – Kamlesh Solanki Apr 23 '19 at 10:57
  • If you helpfull then approved answer. – Kamlesh Solanki Apr 23 '19 at 10:57
  • 3
    Using this solution, the shipping charge is not added to the order total. The order total is displaying wrong value. – MGento Jun 19 '19 at 4:45
  • I added these js files in custom theme. Order summary is displayed on shipping step. However, its not displayed on payment step. – Sejal Shah Oct 15 '19 at 20:12

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.