WooCommerce Cart Content Overridden When Refreshing Before Add-to-Cart Completes? Fix Async Processing Conflict

WooCommerce Cart Content Overridden When Refreshing Before Add-to-Cart Completes? Fix Async Processing Conflict

You click 'Add to Cart' on a product page (or from a shop page) and immediately navigate to the cart page or refresh it before the AJAX add-to-cart process finishes. Instead of seeing your newly added item, the cart either shows stale data, a different product, or appears empty. This happens because WooCommerce handles add-to-cart requests asynchronously when AJAX is enabled. If the cart page loads while the add-to-cart request is still in progress, the server processes both requests concurrently. The cart session may be overwritten by the older data (or by a previous request), resulting in incorrect cart contents. This race condition is especially common on slow networks or when using aggressive caching. The fix involves either preventing users from leaving or refreshing the page until the AJAX request completes, or adding a server-side mechanism to queue cart updates. Below is a practical JavaScript solution that disables the cart link and prevents page navigation during the add-to-cart process.

Step-by-Step Solution

• 1Identify if your store uses AJAX add-to-cart (default in WooCommerce settings).
• 2Add the provided PHP code to your theme's functions.php or a custom plugin.
• 3Test the fix on a staging site: add a product to cart, then immediately refresh the cart page before the AJAX finishes. The overlay should appear and cart link should be disabled.
• 4If the overlay doesn't appear, enqueue the default WooCommerce cart script by checking that 'wc-add-to-cart' is registered.
• 5Clear any caching plugin or CDN cache after adding the code.
• 6Verify that the cart page loads correctly after the AJAX completes.

/**
 * Add a loading overlay and disable cart link while add-to-cart AJAX is pending.
 * Place this code in your theme's functions.php or a custom plugin.
 */
add_action( 'wp_enqueue_scripts', 'wc_prevent_cart_refresh_on_add_to_cart' );
function wc_prevent_cart_refresh_on_add_to_cart() {
    if ( is_cart() || is_checkout() ) {
        return;
    }
    wp_add_inline_script(
        'wc-add-to-cart',
        '
        jQuery( function( $ ) {
            let isAddingToCart = false;
            // Intercept add-to-cart button clicks
            $( document ).on( 'click', '.ajax_add_to_cart', function() {
                isAddingToCart = true;
                // Add a temporary overlay to block navigation
                $( 'body' ).append( '<div id="wc-adding-overlay" style="position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(255,255,255,0.7);z-index:9999;"><p style="text-align:center;margin-top:20%;font-size:1.2em;">Adding to cart...</p></div>' );
                // Disable all cart links
                $( 'a[href*="cart"]' ).css('pointer-events','none').css('opacity','0.5');
            });
            // Redeem when AJAX completes (success or error)
            $( document ).on( 'added_to_cart ajax_error', function() {
                isAddingToCart = false;
                $( '#wc-adding-overlay' ).remove();
                $( 'a[href*="cart"]' ).css('pointer-events','auto').css('opacity','1');
            });
        });
        '
    );
}

Final Recommendation