Handling of Stripe JS with GDPR & minifier plugins

[frosso]

Describe the bug

The checkout button is missing in mobile view on the WooCommerce site when using WooPayments with the Cookiebot plugin enabled. The issue appears to stem from the Cookiebot plugin altering the loading behavior of the Stripe JavaScript. Specifically, Cookiebot changes the <script> type of Stripe’s script from text/javascript to text/plain due to cookie consent settings, which prevents Stripe from loading correctly, thereby causing WooPayments elements not to display on checkout.

To Reproduce

1. Enable the Cookiebot plugin (for example)
2. Go to the WooCommerce checkout page
3. Check if the WooPayments checkout button and Stripe elements are visible.
4. Open the browser console to observe errors.

Actual behavior

In mobile view, the checkout button is missing on the WooCommerce checkout page. The console displays the following error:

blocks-checkout.js?ver=8.2.2:2 Uncaught (in promise) Error: Invalid prop `stripe` supplied to `Elements`. We recommend using the `loadStripe` utility from `@stripe/stripe-js`.

Additionally, attempting to manually initialize Stripe in the console returns:

ReferenceError: Stripe is not defined

Inspecting the page source reveals that the Stripe script is enqueued with type="text/plain" instead of type="text/javascript", likely due to Cookiebot’s handling of cookie consent.
https://plugins.trac.wordpress.org/browser/cookiebot/trunk/src/lib/helper.php#L151

Expected behavior

The WooPayments checkout button and Stripe payment fields should load and be fully functional on the checkout page in mobile view, without requiring additional manual actions. The Stripe JavaScript should load without interference from Cookiebot

Additional context

Potential solution ideas include leveraging JavaScript Proxies to detect when Stripe is added to the window object and then triggering the initialization of WooPayments.

p1727770367173279-slack-CGGCLBN58
p1722007079535099-slack-CU6SYV31A