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
The issue was introduced in earlier patch versions and remains unresolved in subsequent patch releases of the same minor version.
Affected versions include (but are not limited to):
- 2.4.8-p3
- 2.4.8-p4
- 2.4.7-p8
- 2.4.7-p9
- 2.4.6-p13
- 2.4.6-p14
- 2.4.5-p15
- 2.4.5-p16
Versions in the 2.4.4 release line are end of support and are not covered by this article.
Steps to reproduce:
-
Ensure the CSP module is enabled.
-
Switch to Production mode, and enable minification and bundling of JS assets.
-
Deploy static content and flush cache.
-
Navigate to the storefront and attempt to place an order.
-
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.jsis present on the Checkout page. Ifmixins.min.jsis 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.
Note: The patch files listed below have been verified to remain compatible with later patch releases of the same minor version.
- For version 2.4.5-p15 and later 2.4.5 patch releases
- For versions 2.4.6-p13 / 2.4.7-p8 and later 2.4.6 and 2.4.7 patch releases
- For version 2.4.8-p3 and later 2.4.8 patch releases
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.jsonfiles 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.