Shopify Checkout Requires 2 Clicks: Button, Payment, and Script Fixes (2026)

Quick Fix with Thunder

Reproduce the Two-Click Checkout Path

Start by making the bug boring and repeatable. Use an incognito window, one normal product, no discount code, no gift card, no subscription item, and a normal cart page instead of only a drawer. If the issue disappears, add each layer back until the first click stops working.

Checkout click test:
1. Open an incognito browser.
2. Add one in-stock physical product.
3. Go to /cart, not only the drawer.
4. Click checkout once and watch the Network tab.
5. Repeat with the drawer, discount, terms checkbox, wallet button, and apps enabled.
6. Test the same flow in a duplicate theme with app embeds disabled.

If the normal cart page works but the drawer needs two clicks, focus on drawer JavaScript. If both paths need two clicks, test payment settings, wallet scripts, customer-account state, and browser extensions. Related symptoms include a Shopify checkout button not working, checkout stuck loading, or cart updates that require refresh.

Find the First Click Handler That Stops Checkout

Most two-click checkout bugs come from one of three patterns. First, the button starts disabled and is enabled only after a cart update finishes. Second, a custom listener calls preventDefault() but does not redirect after the async work completes. Third, more than one app attaches a handler to the same button, so the first click updates state and the second click redirects.

document.querySelectorAll('button[name="checkout"], [data-checkout-button]').forEach((button) => {
  button.addEventListener('click', (event) => {
    console.log('Checkout click fired', {
      disabled: button.disabled,
      ariaDisabled: button.getAttribute('aria-disabled'),
      time: Date.now(),
    });
  }, { capture: true });
});

Open DevTools Console, paste the snippet, and click once. If you see no log, the visible button is probably not the real checkout control. If you see a log but no navigation request, a handler or async cart update is blocking the redirect. If you see a request that fails, inspect the response and compare it with order total changed checkout errors.

Fix Cart Updates Before Redirecting to Checkout

Drawers often save notes, attributes, discounts, delivery dates, or upsell quantities immediately before checkout. That is fine, but the button must wait for the save to finish. Shopify's Ajax Cart API supports cart updates during the customer session. Use it deliberately instead of racing it against checkout.

const checkoutButton = document.querySelector('[data-checkout-button]');

checkoutButton?.addEventListener('click', async (event) => {
  event.preventDefault();
  checkoutButton.disabled = true;

  try {
    await fetch('/cart/update.js', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json', Accept: 'application/json' },
      body: JSON.stringify({ attributes: { source: 'cart drawer' } }),
    });

    window.location.href = '/checkout';
  } catch (error) {
    console.error('Cart save failed before checkout', error);
    checkoutButton.disabled = false;
  }
});

This pattern avoids the classic first-click state update, second-click checkout behavior. If the data you save is a delivery date or instruction, also read cart attributes not showing on orders and order notes not showing.

Check Wallet Buttons, Terms Checkboxes, and Apps

Shopify's accelerated checkout buttons let customers skip parts of the normal cart path, but they also depend on theme compatibility, payment eligibility, browser support, and product context. Shopify notes that accelerated checkout buttons can be added to product pages and other areas with add-to-cart buttons, and that compatibility matters for certain products and apps.

Test standard checkout separately from Shop Pay, Apple Pay, PayPal, and Google Pay. Disable terms-and-conditions validators, delivery-date apps, bundles, subscription widgets, cart upsells, and pixels in a duplicate theme. If the two-click behavior disappears, the issue is not "Shopify checkout" as a platform. It is the stack around the button.

For wallet-specific issues, use Shop Pay checkout troubleshooting, PayPal not showing at checkout, and dynamic checkout buttons not showing.

Manual Fix vs Thunder Fix

If the store has several cart bugs at once, compare Thunder pricing with professional Shopify speed optimization.

FAQ