Hikashop Characteristics not changing image, content or price in browsers

Question

I have characteristics for volume/size setup for my product and have them displayed as radio buttons on the product page:

https://cotsperfumery.under-development.info/shop-online/ladies-fragrances/product/english-rose-eau-de-parfum

Each Variant in the backend has its own settings for image, price, description, title, etc.

When I view the page in Firefox all is working fine -- selecting different volumes changes all the on-page details, image, price, etc. However changing the characteristics using Safari, Chrome or Explorer on Mac and PC does not change anything on the page.

I reverted the template overrides before posting to ensure it was not a mistake in my override and got the same result in all browsers.

Looking at the page code across the browsers, in all the browsers apart from Firefox, it appears the <form> code is somehow removed. If I manually add in the form element via dev tools it then works!

Answer 1

On Linux + Chrome the site seems to work ok: selecting another size changes the price/image/description. However, on Linux in Firefox I can reproduce your issue: the price/image/description don't change. Even in incognito/privacy mode (to make sure the issue is not browser plugin related).

I noticed a lot of errors in the Console (Chrome: F12 to inspect the page, check the "Console" tab).

Could you disable Joomla's System - HTTP Headers plugin to test if your issue is related to the Content Security Policy (CSP). I have a feeling that your CSP might be too strict and that it does not allow the visitor's browser to load some of Hikashop's JavaScript files which it needs to change the price/image/description.