Search code examples
jquerydrupal-7

JQuery error causes drupal website pages to display incorrectly in Chrome

I have a drupal website www.visionate.co.nz, which yesterday lost the ability in Chrome (and Firefox) to display properly. It worked in IE. A workaround has been applied but elements are still not functioning. for example the dropdown navigation on a small screen (e.g. phone) is not working.

I am trying to get to the bottom of it but I am a drupal user, not a php coder.

The error I am receiving is a fairly common one on the net.

  • Uncaught SyntaxError: Invalid or unexpected token
  • Uncaught ReferenceError: jQuery is not defined

My hosting company removed a line from .htaccess that got rid of the primary manifestation of the issue, but I think it is just masking it, because the errors are still there when using CTRl-SHIFT-C and selecting console.

I thought it might have been to do with Chrome getting tougher about mixed content, because I get an insecure content warning on IE (but not on chrome), so i tried to identify any hardcoded http links that I could see.

I am starting to think the problem might have been there for a while.

looking for advice on how I could make the JQuery get recognized, and hoping that would fix it. I get the same errors on every page.

The code is really long so I have truncated it, but it is visible from Chrome Dev Tools :

"<!--//--><![CDATA[//><!--
jQuery.extend(Drupal.settings, {"basePath":"\/","pathPrefix":"","ajaxPageState":{"theme":"united_zymphonies_theme","theme_token":"QVcySLkk... thousands of characters truncated"

There are still some features missing from the site when viewed in Chrome and the dropdown menu does nto work when screen size is reduced to phone size.

Update: I have checked the network table and getting status 200 for all the loads. My googling tells me that JQuery has potentially been referenced before it has been loaded. I'm not sure how to address that.

Solution

  • I followed the advice provided by EricLavault and did the following in Drupal 7.67

    1. Went to /admin/config/development/performance
    2. Scrolled down to the "bandwidth optimization' section
    3. Unchecked values for the following
      • Aggregate and compress CSS files
      • Aggregate JavaScript files.

    Then I cleared the caches. Went to www.visionate.co.nz Hit shift-ctrl-c, and check console tab Problem has gone away Resized screen to phone size - navigation is working again now.

    Thank you Taplar and EricLavault for your comments which enabled me to find this solution.

    kind regards