Why a component works on chrome but not firefox

Hello, I appreciate if someone can give me a few pointers for the following situation. Site has an accordion for the FAQ section, the accordion works as intended in Chrome but not Firefox, any ideas why? or pointers on how would you approach this problem?
All input is welcome, thank you.

hi, I couldn’t find anything wrong with the site on firefox but maybe I’m not understanding the issue. I am able to open and close the different FAQ sections. I’m on windows.

It could be the OS then, I am on Linux. You understood well, I am not able to open and close the different FAQ sections while using Firefox, but it works perfectly in Chrome. Thank you for your input :smile:

1 Like

It’s more likely that something in your Firefox settings is interfering, such as a privacy setting or browser extension. Usually when a browser issue is linked to an OS it’s just because the default settings might be different. So far, I’ve only seen this with MacOS, but it’s possible.

I installed a fresh copy of Firefox Developer, but the accordion still isn’t working. I tried it on the Tor browser, and it works as intended. I will keep researching. Thank you for your reply

The developer edition of Firefox may not behave the same way as the consumer version.

1 Like

Firefox blocks the jQuery link in a private window, and so does Firefox Developer Edition in a normal window. It causes a reference error when jQuery is then used.

Referrer Policy: Ignoring the less restricted referrer policy “no-referrer-when-downgrade” for the cross-site request: https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js

I assume it is an upcoming security restriction that will land in the normal version as well at some point.

Try replacing it with the link the CDN actually gives you (adjust the version if needed)

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js" integrity="sha512-v2CJ7UaYy4JwqLDIrZUI/4hqeoQieOmAZNXBeQyjo21dadnwR+8ZaIJVT8EE2iyI61OV8e6M8PP2/4hpQINQ/g==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

Actually, the theme has a version of jQuery in libs.min.js which is the one throwing the reference error. It does it in Chrome as well.

I assume Chrome and standard Firefox both uses the CDN version instead, but in a private window and in the dev version that link is skipped.

I proceeded to test on a fresh installation of standard Firefox, and it functioned as intended. Now, thanks to you, I’m aware that various versions of the same browser may behave slightly differently. May I ask, what approach did you take to tackle the problem and arrive at this solution?

I just tested it in the different browsers and looked in the browser console for any errors. The browser dev tools should always be the first place you check when something isn’t working.

Looking at the CDN it adds the referrerpolicy="no-referrer" attribute to the script element which with the console Referrer Policy information log seemed relevant.

You can read about the attributes on MDN: Script element

I can’t really test it but replacing the script with the one from the CDN seems like it might fix it.