magesuite / magepack

Next generation Magento 2 advanced JavaScript bundler.
Open Software License 3.0
431 stars 93 forks source link

Magento 2.4.5 issues #158

Open marceldekoning opened 1 year ago

marceldekoning commented 1 year ago

Hi everyone,

I recently installed a clean Magento 2.4.5 instance with only Magepack and the patch from https://github.com/magesuite/magepack/issues/140 installed, but I'm encountering some issues that look Magepack related and I can't seem to resolve. I was wondering if anybody has the same issues:

Magento version: 2.4.5 PHP version: 8.1

When I disable magepack js bundling, everything works fine. Does anyone encountering the same problems and maybe has a solution?

Thank you.

Paulsky commented 1 year ago

I have the exact same problems. The minicart is empty (and doesn't update). The checkout keeps showing the loading spinner. Everything else works fine. If I disable Magepack, the checkout and minicart are working. No (console) errors are thrown.

Paulsky commented 1 year ago

@marceldekoning, did you happen to find a solution in the meantime? I haven't had yet the change to test it, but does the new release (2.10.1) fixes the issue?

Garde85 commented 1 year ago

I have the same issue! I have just updated magepack to last version 2.10.1, but issue is still present. If I disable magepack:

bin/magento config:set dev/js/enable_magepack_js_bundling 0

all works well.

krzksz commented 1 year ago

Can you share a link to the site where I can reproduce the issue?

pt., 21 paź 2022, 11:14 użytkownik Garde85 @.***> napisał:

I have the same issue! I have just updated magepack to last version 2.10.1, but issue is still present. If I disable magepack:

bin/magento config:set dev/js/enable_magepack_js_bundling 0

all works well.

— Reply to this email directly, view it on GitHub https://github.com/magesuite/magepack/issues/158#issuecomment-1286686023, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAGKOBI23VLJEZBM42FTTMLWEJNITANCNFSM6AAAAAARATNSBA . You are receiving this because you are subscribed to this thread.Message ID: @.***>

Garde85 commented 1 year ago

@krzksz

this is my staging environment:

XXXXX

where you can reproduce the issue. I enabled magepack right now.

krzksz commented 1 year ago

So far I managed to find out that there's some issue with loading jquery/compat module, but I'm not sure why this is the case. The mitigation would be to refactor any JavaScript that depends on jquery/ui to depend on its separate modules.

marceldekoning commented 1 year ago

@Paulsky,

I haven't had the time to test it yet, but @Garde85 did update the Magepack module and the problem still exist.

@krzksz Thanks for looking into this.

Garde85 commented 1 year ago

@krzksz after your reply I checked every possible dependency on jquery/ui on my code, and I have to say that I found on my theme that there was 2 js that depends of it. I removed these dependencies, recompiled js and bundle it, but issue are still there. You can check it on my stage environment.

I have already updated magepack to last version (2.11.2)

vacla commented 1 year ago

Can it be related to https://github.com/magento/magento2/commit/f6779120db5c70dd9698b78e235f70c1b8e5e2af ?

fredden commented 1 year ago

@Garde85 please can you turn off merged JavaScript temporarily to aid in debugging this problem? This will let me test the website with & without bundling, to try to work out what's going wrong.

Garde85 commented 1 year ago

@fredden I did it. Now staging Environment is running without magepack bundle.

fredden commented 1 year ago

@Garde85 Sorry for any confusion I've caused. Please can you turn magepack back on, and turn off merged JavaScript? The following commands should do this for you:

bin/magento config:set dev/js/enable_magepack_js_bundling 1
bin/magento config:set dev/js/merge_files 0
Garde85 commented 1 year ago

@fredden ok! I did it.

fredden commented 1 year ago

@Garde85 Thanks for this; I can see that merged JavaScript has been turned off, but can't see magepack. Please can you check that magepack is enabled?

Garde85 commented 1 year ago

Sorry @fredden, my fault. Now magepack is enabled. I checked and I see magepack file downloaded where I browse the pages.

fredden commented 1 year ago

Great, thanks for making those changes @Garde85. I'll have a look and let you know if I find an answer.

fredden commented 1 year ago

@Garde85 I've had a look at your website. From what I can tell, there's a problem with this file: https://stage.shop-lorenzonetto.it/static/version1666767869/frontend/Geppa/cantina/it_IT/jquery/ui-modules/effects/effect-blind.min.js The file seems to have been modified from what Magento supply: https://github.com/magento/magento2/blob/2.4.5-p1/lib/web/jquery/ui-modules/effects/effect-blind.js Specifically, line 22 (of the original version) seems to have been changed from define( [ to define('jquery-ui-effect-blind', [. I believe this is what's causing your problem. Please restore this file to its original and try again. Consider also if any other files have been similarly modified as they may be causing you issues also.

The reason this behaves differently with magepack enabled is to do with the name that the module has been given and that the module lists some of its dependencies relatively (eg, ../version).

More details which aren't strictly required to answer the question, but might be helpful for others in future. I was able to determine that the problem exists within the 'common' bundle by blocking both 'common' and 'checkout' then each of these to determine when the checkout worked and when it didn't. With the 'common' bundle blocked, I could see that there were additional entries in `require.s.contexts._.defined`, specifically these were present when the website worked, but not when it didn't: - in common bundle - `text!Magento_Ui/template/messages.html` - `Magento_Ui/js/view/messages` - `jquery/ui-modules/effects/effect-blind` - in checkout bundle - `Magento_Checkout/js/view/authentication-messages` - `Magento_SalesRule/js/view/payment/discount-messages` - not bundled - `mixins!Magento_Ui/js/view/messages` Drawing a quick dependency map, I could see that the `jquery/ui-modules/effects/effect-blind` was at the root / blocking all others. Working out why it was broken was trickier. I set lots of breakpoints within RequireJS to inspect its internals at different stages.
musabatas commented 1 year ago

I would like to give a feedback to this issue. I have installed magepack on 2.4.3-p2 with lots of extensions and it is working well, but in 2.4.5-p1 with same extensions it is not working.

So, the issue may be related on Magento 2.4.5 itself or a dependency of this version.

I will try to investigate the issue by comparing these two versions.

Garde85 commented 1 year ago

@musabatas for me is the same! My previous Magento version was 2.4.2-p1, now I have upgraded to 2.4.5-p1 and issue came after upgrade. I don't change third party and custom modules installed, just upgraded.

@fredden Yes, I modify all files that are located in this forder:

lib/web/jquery/ui-modules/effects

I did it after I found this reply to another problem that I found after I upgraded to magento 2.4.5-p1:

https://github.com/magesuite/magepack/issues/140#issuecomment-1142291071

Without this customizzation of "jquery effects" files I had many error in javascript console using bundle files generation by magepack.

Uncaught Error: Mismatched anonymous define() module: function($){"use strict";return $.effects.define("fade","toggle",(function(e,t){var n="show"===e.mode;$(this).css("opacity",n?0:1).animate({opacity:n?1:0},{queue:!1,duration:e.duration,easing:e.easing,complete:t})}))}

Applying this patch problems seems to be disappeared.

@fredden I don't know if restoring these files actual problems could be resolved, but I'm sure (beacuse already happens), that If remove define( [ to define('jquery-ui-effect-blind', [create another issue.

fredden commented 1 year ago

140 was fixed in 3ecd854697b2c29f717293416ee6b2e2c45641a1. Any temporary workarounds are no longer necessary. Please check you are using an up to date version of magepack.

If you don't want to restore the file to it's original state, please give it it's full name not an alias.

Garde85 commented 1 year ago

Good news! Now magepack bundles works for me. @fredden I restored original version of lib/web/jquery/ui-modules/effects, then I recreated bundles by magepack and all seems to work well.

@musabatas only think that I can suggest you is to update magepack to last version.

Paulsky commented 1 year ago

@Garde85 that sounds great! So to be clear, the solution was provided in version 2.11.2? Are there any specific settings needed for your environment like disabling merge JS files?

Sort of offtopic: I'm not sure but are you using Porto theme? You were talking about a couple of jquery/ui dependencies in your theme. I have found one in an extension used in Porto, and they have fixed it: https://github.com/mageplaza/module-core/pull/44

Garde85 commented 1 year ago

So to be clear, the solution was provided in version 2.11.2? Are there any specific settings needed for your environment like disabling merge JS files?

I would say yes, because all customizzation that I did on my javascript, I had done it beacuse something didn't work during the proccess of dunble creation with magepack, but for sure at the fisrt time that I generated bundle after upgraded magento to version 2.4.5-p1 my megepack version wasn't 2.11.2. Today, after the adevice of @fredden, I've rolled back my customization, and with magepack 2.11.2 all works at first time.

'Sort of offtopic: I'm not sure but are you using Porto theme? You were talking about a couple of jquery/ui dependencies in your theme. I have found one in an extension used in Porto, and they have fixed it: https://github.com/mageplaza/module-core/pull/44'

Yes, my theme is based on porto, but I don't use that specific magepalza functionality. When I talked about some dependecies, I was reffering to custom modules developed my myself.

marceldekoning commented 1 year ago

I can confirm that the magepack bundling is working with version 2.11.2 and without patch #140 applied. Thank you for investigating and providing the solution for this issue.

drabikowy commented 1 year ago

Confirmed it works with 2.11.2 . Thx a lot @krzksz ❤️

MagePsycho commented 8 months ago

So far I managed to find out that there's some issue with loading jquery/compat module, but I'm not sure why this is the case. The mitigation would be to refactor any JavaScript that depends on jquery/ui to depend on its separate modules.

Can you elaborate more on this please?

fredden commented 8 months ago

refactor any JavaScript that depends on jquery/ui to depend on its separate modules. Can you elaborate more on this please?

@MagePsycho the first part of this page has an explanation of how / why replacing a dependency on jquery/ui is useful: https://promagento.org/2022/12/magento-2-js-loading-what-can-we-do-for-optimization/

nabeelfocus commented 2 months ago

We just updated to 2.4.6-p2 from 2.4.5-p1 and are now experiencing these errors on checkout minicart not update.i using latest magepack version 2.11.2.but the minicart has no content and doesn't update. When I refresh the page, the minicart still doesn't show it's content and it's count. When I proceed to the product page, everything is showing just fine.