Extra jQuery loading in Script Tag API breaking functions

New Member
2 0 0

 

This extra version of jQuery is being loaded with the other Script Tag API scripts from apps: 

<script type="text/javascript" async="" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js?shop=better-essentials.myshopify.c...>

 

I think jQuery loading twice is the culprit for a number of different problems with our site. Including lazy loading images not working and the product image not updating when the user selects a variant from the dropdown. 

 

In my theme I have this, which if I remove, functions from app.js no longer work:

<!-- jQuery and jQuery fallback -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script>window.jQuery || document.write("<script src='{{ "jquery.min.js" | asset_url }}'>\x3C/script>")</script>

 

 

Is there any way to identify what is causing the extra jQuery script to load with the other Script Tag API scripts? I've removed several apps and contacted several other app developers and they all say it is not coming from their app. I cannot figure out how to remove this duplicate jQuery or what to do instead. 

 

Example: https://www.betteressentials.com/products/free-essential-oil-sample (the product image doesn't update with the variant dropdown and throws a console error when you try)

 

Any help is greatly appreciated. Thanks.

0 Likes
Shopify Partner
1304 13 166

Indeed,

the 3.2.1 version of jQuery version injected by the ScriptTag is messing your flexslider.

If you block that resource in DevTools, all is good.

 

Had similar jQuery compatibility issues with various APPs that injected lower or higher versions.

I wish APP developers would care more about the code they are injecting...

Any idea what APP is injecting that?

 

Regarding flexslider, here is something . that may help you: https://stackoverflow.com/questions/45262897/flexslider-2-is-not-working-with-latest-jquery-3-2-1

Not sure if the solution given will work for you but you can give it a try.

 

https://sections.design tips, tricks & Shopify sections
0 Likes
New Member
2 0 0

Thanks for your reply. 

 

I have no idea what app is injecting this script. I have removed several apps and contacted the developers of several more, with no luck finding it.

 

I've emailed Shopify support to see if they can help. 

0 Likes
Shopify Partner
1304 13 166

Unfortunately this is the case with APPs that use ScriptTag to inject their assets. It's an open door to your store and can mess your code.

Bonus points, you also may get performance issues, an asset added through ScriptTag will execute on all pages even if its utility may only be on a particular page.

I wish we would have a form of control (some APPs do allow manual installation) and code quality, size, performance be an APP Store listing factor...

 

https://sections.design tips, tricks & Shopify sections
0 Likes