Skip to content

WooPay Direct Checkout does not work in iAPI mini-cart (WC 10.4+) #11431

@pierorocca

Description

@pierorocca

Describe the bug

The WooPay Direct Checkout flow does not intercept the "Go to checkout" button click in the mini-cart block after WooCommerce migrated it from React to the WordPress Interactivity API (iAPI). This means users are sent to the normal checkout page instead of being redirected to WooPay.

The iAPI mini-cart became the default in WooCommerce 10.4 (Dec 10, 2025), so this affects all stores on WC 10.4+.

Related: WOOPMNT-4079

Root Cause

Two compounding issues in client/checkout/woopay/direct-checkout/index.js:

  1. Widget detection selector is missing: maybeObserveMiniCart() checks for [data-block-name="woocommerce/mini-cart"], but the iAPI version uses data-wp-interactive="woocommerce/mini-cart" instead. The function exits early.
  2. MutationObserver is incompatible with iAPI: The observer watches for .wc-block-components-drawer__screen-overlay being added to the DOM. In iAPI, the overlay is server-side rendered and always in the DOM — visibility toggles via CSS classes, not DOM insertion. The observer never fires.

To Reproduce

  1. Use WooCommerce 10.4+ (iAPI mini-cart is default).
  2. Enable WooPay Direct Checkout.
  3. Add an item to the cart.
  4. Open the mini-cart drawer.
  5. Click "Go to checkout".
  6. Expected: Redirect to WooPay checkout.
  7. Actual: Navigates to the normal WooCommerce checkout page.

Environment

  • WooCommerce 10.4+ (iAPI mini-cart enabled by default)
  • Any WooPayments version with Direct Checkout support

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions