Customer not Directed to the Payment Review Page after Checkout using the Checkout Flow

In the following implementations, customers are not directed to the payment review page after checking out even when Windcave is the only configured payment method:

• SiteBuilder Extensions Kilimanjaro

• SiteBuilder Extensions Premium Kilimanjaro

• SuiteCommerce Advanced (SCA) Kilimanjaro

• SCA 2018.2

• SCA 2020.1

• SCA 2020.1.12

• SCA 2021.2

• SCA 2021.2.3

These patch instructions describe the steps to fix this problem so that customers are directed to the correct payment review page.

To implement this patch, create a custom module to override the OrderWizard.Module.PaymentMethod.Selector.js JavaScript file which is part of the OrderWizard.Module.PaymentMethod module.

If you are not familiar with implementing patches for SuiteCommerce Advanced, refer to the following:

• Before you get started, familiarize yourself with Best Practices for Customizing SCA.

• For step by step instructions, refer to Patch Using Override Mode.

Step 1: Create the Override File

1. Following the instructions in the Patch Using Override Mode procedure, create a new directory and file: /Modules/extensions/OrderWizard.Module.PaymentMethod@1.0.0/JavaScript/OrderWizard.Module.PaymentMethod.Selector.js

2. In the OrderWizard.Module.PaymentMethod.Selector.js file, in the setModuleByType() method, find the following code:

                   if (!this.selectedModule)
   {
   this.selectedModule = _.first(this.modules);
   } 
   
                 

   And replace it with the following code:

                   if (!this.selectedModule)
   {
   this.selectedModule = _.findWhere(this.modules, { isActive: true });
   } 
   
                 

3. In the render() method of the same file, find the following line of code:

                   var selected_payment = this.model.get('paymentmethods').findWhere({primary: true}) 
   
                 

   And replace it with the following code:

                   var selected_payment = this.wizard.options.profile.get('creditcards').length > 0 &&
   this.model.get('paymentmethods').findWhere({primary: true}) 
   
                 

4. From the render() method, move the following code to the end of the initialize() method:

                     
   _.each(this.modules, function (module)
   {
   module.isActive = module.instance.isActive();
   }) 
   
                 

5. Finally, in the getContext() method, find the following code:

                   module.isSelected = (self.selectedModule.type === module.type); 
   
                 

   And replace it with the following code:

                   module.isSelected = (self.selectedModule && self.selectedModule.type === module.type); 
   
                 

6. Save the file.

Step 2: Prepare the Developer Tools For Your Patch

When preparing the Developer Tools for your patch as described in the Patch Using Override Mode procedure, you should:

1. Paste the following sample code into the new ns.package.json file that you create in the Modules directory: Modules/extensions/OrderWizard@1.0.0/ns.package.json

                    {
      "gulp": {
         "javascript": [
            "JavaScript/*.js"
         ]
      },
      "overrides": {
         "suitecommerce/OrderWizard@X.Y.Z/JavaScript/PaymentMethod.Selector.js" : "JavaScript/PaymentMethod.Selector.js"
      }
   } 
   
                 

   Important:

   You must replace the string X.Y.Z with the version of the module in your implementation of SuiteCommerce Advanced.

2. Open the distro.json file in the root SuiteCommerce Advanced development directory and then add your custom module to the modules object as described in the Patch Using Override Mode procedure. The following sample shows the value to add to the list of existing values that follow the “modules” key.

                   "modules": {
       ""extensions/OrderWizard.Module.PaymentMethod": "1.0.0",
       . . . 
   
                 

Step 3: Test and Deploy Your Patch

Follow the instructions provided in the Patch Using Override Mode procedure to test and deploy your patch.

Related Topics

SCA Patches

General Notices