Preconditions and environment
Magento version : 2.4.7-p4
Javascript configuration :
- Minification enabled
- Every other javascript optimization disabled
Error might be linked to this Plugin (I did not dig enough but if I remove it, the links are not reordered) :
https://github.com/magento/magento2/blob/2.4-develop/app/code/Magento/Csp/Plugin/AddDefaultPropertiesToGroupPlugin.php
Steps to reproduce
I'll base my step to reproduce on the module I installed, other area might be affected or not.
Create a custom module with the following files :
app/code/Custom
└── Module
├── etc
│ └── module.xml
├── registration.php
└── view
├── adminhtml
│ └── layout
│ └── adminhtml_system_config_edit.xml
└── base
└── web
└── js
├── test.dependency.js
└── test.min.jsContent of test.min.js
function testMyFunction() { console.log('the test function is called');}Content of test.dependency.js
Content of adminhtml_system_config_edit.xml
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
<link src="Custom_Module::js/test.min.js"/>
<link src="Custom_Module::js/test.dependency.js"/>
</head>
</page>As you can see, there is an implicit dependency in the test.dependency.js which requires the previous script to be loaded first.
I know it's not a good practice but in some cases, in the module I detected the issue on, they include angular framework minified and angular components which cause them to crash.
Expected result
The loading order of the javascript dependencies must stay the same as we have an implicit dependency.
In the DOM, we should have something like this (Order matters):
[...]
<script type="text/javascript" integrity="sha256-XXXXXXXXXX=" crossorigin="anonymous" src="https://www.XXXXX/static/version1742912394/adminhtml/Magento/backend/en_US/Custom_Module/js/test.min.js"></script>
<script type="text/javascript" src="https://www.XXXXXX/static/version1742912394/adminhtml/Magento/backend/en_US/Custom_Module/js/test.dependency.min.js"></script>
[...]
Actual result
In the DOM, we have something like this (Order matters):
[...]
<script type="text/javascript" src="https://www.XXXXXX/static/version1742912394/adminhtml/Magento/backend/en_US/Custom_Module/js/test.dependency.min.js"></script>
[...]
<script type="text/javascript" integrity="sha256-XXXXXXXXXX=" crossorigin="anonymous" src="https://www.XXXXX/static/version1742912394/adminhtml/Magento/backend/en_US/Custom_Module/js/test.min.js"></script>
[...]
This is causing the test.dependency.js to crash the javascript.
Additional information
I don't know if this is an important issue or not because requirejs should be used to avoid javascript dependency on script loading order, but still, this is illogical for developers to see the links reordered without information about it.
Release note
No response
Triage and priority
Preconditions and environment
Magento version : 2.4.7-p4
Javascript configuration :
Error might be linked to this Plugin (I did not dig enough but if I remove it, the links are not reordered) :
https://github.com/magento/magento2/blob/2.4-develop/app/code/Magento/Csp/Plugin/AddDefaultPropertiesToGroupPlugin.php
Steps to reproduce
I'll base my step to reproduce on the module I installed, other area might be affected or not.
Create a custom module with the following files :
app/code/Custom └── Module ├── etc │ └── module.xml ├── registration.php └── view ├── adminhtml │ └── layout │ └── adminhtml_system_config_edit.xml └── base └── web └── js ├── test.dependency.js └── test.min.jsContent of test.min.js
Content of test.dependency.js
Content of adminhtml_system_config_edit.xml
As you can see, there is an implicit dependency in the test.dependency.js which requires the previous script to be loaded first.
I know it's not a good practice but in some cases, in the module I detected the issue on, they include angular framework minified and angular components which cause them to crash.
Expected result
The loading order of the javascript dependencies must stay the same as we have an implicit dependency.
In the DOM, we should have something like this (Order matters):
Actual result
In the DOM, we have something like this (Order matters):
This is causing the test.dependency.js to crash the javascript.
Additional information
I don't know if this is an important issue or not because requirejs should be used to avoid javascript dependency on script loading order, but still, this is illogical for developers to see the links reordered without information about it.
Release note
No response
Triage and priority