Problem/Motivation

When using a custom multistep checkout flow in commerce you can set custom step IDs for each step. The review step uses this ID to populate the data-drupal-selector on the submit/pay button EG: 'edit-custom-step-actions-next'.

Because of this within commerce_stripe.payment_element.js on line 22/23 the selector cannot find the submit button as it is searching for 'edit-actions-next' rather than our custom selector meaning users cannot pay and continue their journey.

Steps to reproduce

1) Setup a Drupal 10 site with commerce and commerce stripe installed
2) Setup a custom checkout flow with a custom ID for the review step
3) Setup a test commerce store with items
4) Add an item to your basket and proceed through the checkout
5) Once the user has added a card and is on the review step observe the console and see that it cannot set the 'disabled' property to false as it cannot find the primary button.

Proposed resolution

I suggest we add a buttonId into the drupal settings within the StripeReview.php pane. This ID will be pulled from the config set by the custom checkout flow.

Then we can call this ID within our Javascript to select the right button.

Remaining tasks

Confirm the patch effectiveness and proceed.

CommentFileSizeAuthor
stripe_submit_button_selector.patch1.38 KBrowanadev

Comments

rowanadev created an issue. See original summary.

  • jsacksick committed 28b43d56 on 2.x
    Issue #3538718 by rowanadev: Updates to the primaryButton selector has...
jsacksick’s picture

Version: 2.0.1 » 2.x-dev
Status: Active » Fixed

Change looks legit, committed to 2.x, thanks!

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.