The form I’m talking about is the one that should appear when the checkbox My billing and shipping address are the same is unchecked, however it can’t be unchecked. During debug in chrome console I can see the checkbox disappearing, Edit button appearing and the checkbox being forcefully re-checked by something. Even if I manage to make the form appear by overriding the billing address mixin adding manual check flag there, another issue arises: billing form is closing/updating on every keystroke in inputs.
Any help is appreciated.
Main culprits are the two scripts:
Codazon/SalesPro/view/frontend/web/js/checkout/view/billing-address-mixin.js
/**
* Copyright © Codazon, Inc. All rights reserved.
* See COPYING.txt for license details.
*/
define([
'ko',
'underscore',
'Magento_Ui/js/form/form',
'Magento_Customer/js/model/customer',
'Magento_Customer/js/model/address-list',
'Magento_Checkout/js/model/quote',
'Magento_Checkout/js/action/create-billing-address',
'Magento_Checkout/js/action/select-billing-address',
'Magento_Checkout/js/checkout-data',
'Magento_Checkout/js/model/checkout-data-resolver',
'Magento_Customer/js/customer-data',
'Magento_Checkout/js/action/set-billing-address',
'Magento_Ui/js/model/messageList',
'mage/translate',
'Magento_Checkout/js/model/billing-address-postcode-validator',
'uiRegistry'
],
function (
ko,
_,
Component,
customer,
addressList,
quote,
createBillingAddress,
selectBillingAddress,
checkoutData,
checkoutDataResolver,
customerData,
setBillingAddressAction,
globalMessageList,
$t,
billingAddressPostcodeValidator,
registry
) {
var lastSelectedBillingAddress = {},
addressUpadated = false,
addressEdited = false,
countryData = customerData.get('directory-data'),
addressOptions = addressList().filter(function (address) {
return address.getType() === 'customer-address';
});
return function (Component) {
return Component.extend({
defaults: {
detailsTemplate: 'Codazon_SalesPro/checkout/billing-address/details',
},
initObservable: function () {
this.observe({
elems: [],
selectedAddress: null,
isAddressDetailsVisible: quote.billingAddress() != null,
isAddressFormVisible: !customer.isLoggedIn() || !addressOptions.length,
isAddressSameAsShipping: false,
saveInAddressBook: 1
});
quote.billingAddress.subscribe(function (newAddress) {
if (quote.isVirtual() || !quote.shippingAddress()) {
this.isAddressSameAsShipping(false);
} else {
this.isAddressSameAsShipping(
newAddress != null &&
newAddress.getCacheKey() == quote.shippingAddress().getCacheKey() //eslint-disable-line eqeqeq
);
}
if (newAddress != null && newAddress.saveInAddressBook !== undefined) {
this.saveInAddressBook(newAddress.saveInAddressBook);
} else {
this.saveInAddressBook(1);
}
this.isAddressDetailsVisible(true);
}, this);
return this;
}
});
}
});
Codazon/SalesPro/view/frontend/web/js/checkout/view/shipping-mixin.js
/**
* @copyright Codazon. All rights reserved.
* @author Nicolas
*/
define([
'jquery',
'Magento_Checkout/js/model/quote',
'uiRegistry',
'Magento_Checkout/js/model/step-navigator',
'mage/translate',
'ko',
'Magento_Checkout/js/model/checkout-data-resolver',
'Magento_Checkout/js/model/address-converter',
'Magento_Checkout/js/action/get-payment-information',
'Magento_Checkout/js/checkout-data',
'Magento_Customer/js/model/address-list',
'Magento_Ui/js/lib/view/utils/async'
], function ($, quote, registry, stepNavigator, $t, ko, checkoutDataResolver, addressConverter, getPaymentInformation, checkoutData, addressList) {
'use strict';
var widget;
return function (Component) {
return Component.extend({
defaults: {
template: 'Codazon_SalesPro/checkout/shipping'
},
initialize: function () {
var self = this;
this.ingoreValidationMessage = true;
this._adjustFunctions();
this._super();
widget = this;
this._prepareData();
return this;
},
_prepareData: function() {
var self = this;
$(window).on('refreshShippingInfomation', function () {
widget.setShippingInformation();
});
this.prepareFormEvents();
},
_adjustFunctions: function () {
stepNavigator.setHash = function (hash) {
window.location.hash = '';
};
stepNavigator.oldIsProcessed = stepNavigator.isProcessed;
stepNavigator.isProcessed = function (code) {
if (code == 'shipping') {
return true;
} else {
stepNavigator.oldIsProcessed(code);
}
}
},
/* visible: function() {
return (!quote.isVirtual());
}, */
canDisplayed: function() {
return (!quote.isVirtual());
},
selectShippingMethod: function (shippingMethod) {
this._super(shippingMethod);
widget.setShippingInformation();
return true;
},
hasShippingMethod: function () {
return window.checkoutConfig.selectedShippingMethod !== null;
},
saveNewAddress: function() {
this._super();
widget.setShippingInformation();
},
prepareFormEvents: function() {
var self = this;
registry.async('checkoutProvider')(function (checkoutProvider) {
if (self.visible()) {
var addressData = self.source.get('shippingAddress');
var it = setInterval(function() {
var field, $shippingForm = $('#co-shipping-form');
if ($shippingForm.length) {
clearInterval(it);
$('form[data-role=email-with-possible-login] input[name=username]').on('change', function() {
$(window).trigger('refreshShippingInfomation');
});
$shippingForm.on('change', 'input,select', function () {
$(window).trigger('refreshShippingInfomation');
});
}
}, 100);
}
});
},
validateShippingInformation: function() {
if (window.noValidateShippingAddress) {
return true;
} else {
return this._super();
}
}
});
};
});