Checkout fails when JS minification and bundling are enabled

This article provides a patch for the Adobe Commerce issue that prevents checkout from functioning correctly when minification, bundling and (in some cases) merging of JavaScript (JS) assets are enabled.

Description description

Environment

Adobe Commerce, all deployment methods.

Issue/Symptoms

Recent changes to the Content Security Policy (CSP) feature have caused the checkout functionality to fail when minification, bundling, and, in some cases, merging of JS assets are enabled. This issue can completely block order placement on the storefront.

Affected products and versions

Magento Open Source and Adobe Commerce (all deployment methods):

  • 2.4.4-p16
  • 2.4.5-p15
  • 2.4.6-p13
  • 2.4.7-p8
  • 2.4.8-p3

Steps to reproduce:

  1. Ensure the CSP module is enabled.

  2. Switch to Production mode, and enable minification and bundling of JS assets.

  3. Deploy static content and flush cache.

  4. Navigate to the storefront and attempt to place an order.

  5. Check for JS errors in the browser console during each step of the checkout flow.

    • If there are errors or checkout fails explicitly, the store is affected.
    • If there are no errors and order placement is possible, verify if mixins.min.js is present on the Checkout page. If mixins.min.js is missing, but checkout works - the issue exists, but doesn’t visibly impact the store.

Cause

Changes to the CSP feature resulted in incorrect generation of Subresource Integrity (SRI) hashes for minified JS files when bundling is enabled, due to incorrect file paths.

This, in turn, prevented mixins.min.js and static.min.js from rendering properly on the Checkout page, causing various failures during order placement.

Resolution resolution

Stores running on any of the affected versions should apply the corresponding patch to resolve the issue.

These patches reverse the CSP-related changes mentioned above and restore the CSP feature to its state before those changes.

Note: Applying these patches reintroduces some previously known issues related to SRI functionality:

  • On versions 2.4.7-p8 and lower, SRI hashes will again be cached instead of being stored in sri-hashes.json.
  • On versions 2.4.8-p3 and lower, bundled/merged JS assets will not undergo integrity hashes validation.
  • Cloud instances on version 2.4.8-p3 can have incorrectly generated sri-hashes.json files that contain SRI hashes only for a fraction of JS assets.

How to apply the patch

Unzip the file and refer to How to apply a composer patch provided by Adobe for further instructions.

recommendation-more-help
3d58f420-19b5-47a0-a122-5c9dab55ec7f