Expand my Community achievements bar.

Enhance your AEM Assets & Boost Your Development: [AEM Gems | June 19, 2024] Improving the Developer Experience with New APIs and Events

Unable to click on /expand from left side menu navigation post service pack upgrade AEM6.5.20 - Publisher

Avatar

Level 2

Hi All,

We installed Service Pack AEM 6.5.20 in Publisher instance , due to Javscript error we are unable to click anything from left side content tree navigation from Sites.html

 

4503/etc.clientlibs/clientlibs/granite/moment.min.1.0.js' because its MIME type ('') is not executable, and strict MIME type checking is enabled.

 

4503/etc.clientlibs/clientlibs/granite/dompurify.min.1.0.js' because its MIME type ('') is not executable, and strict MIME type checking is enabled.

 

Please let us know if any one come across with above JS error , Attached screenshot for reference.

 

Thanks

RajuJS-error.png

3 Replies

Avatar

Level 9

Hi @raju-komari ,

The issue you're experiencing with the left-side menu navigation in AEM after the Service Pack upgrade is likely due to JavaScript files being served with incorrect MIME types or missing MIME type headers. This can happen due to various reasons, including changes in the service pack affecting the dispatcher configuration or how static assets are served.

Steps to Resolve the Issue

  1. Verify Dispatcher Configuration: Ensure that your dispatcher configuration is correctly set to serve the client libraries with the appropriate MIME types. Sometimes, the dispatcher configuration might block or alter the headers of the JavaScript files.

  2. Clear Dispatcher Cache: After an upgrade, the dispatcher cache might hold outdated files. Clear the dispatcher cache to ensure that all files are reloaded correctly from the publisher.

  3. Check MIME Type Configuration on the Web Server: Make sure that the web server (e.g., Apache, Nginx) is configured to serve .js files with the correct MIME type (application/javascript). Here is an example for Apache:

 

AddType application/javascript .js

 

  1. Verify Client Libraries: Ensure that all client libraries are correctly compiled and available in AEM. Rebuild the client libraries to make sure they are up-to-date:

    • Navigate to Tools -> General -> Client Libraries in AEM.
    • Click on Rebuild Client Libraries.
  2. Inspect HTTP Response Headers: Use browser developer tools (F12) to inspect the HTTP response headers of the JavaScript files. Ensure that they include the Content-Type: application/javascript header.

  3. Check for Errors in the JavaScript Console: Open the browser's developer console to see if there are any additional JavaScript errors or warnings that might provide more context.

Detailed Steps

1. Verify Dispatcher Configuration

Ensure your dispatcher configuration allows JavaScript files and does not alter their headers:

  • In your dispatcher.any configuration file, make sure you have the following lines in the /filter section:

 

/filter
{
    /0000 { /type "allow" /url "/etc.clientlibs/*" }
}

 

2. Clear Dispatcher Cache

Clear the dispatcher cache manually or using the script provided by Adobe. This can be done by deleting the cached files in the dispatcher cache directory.

3. Check Web Server MIME Type Configuration

For Apache, ensure that the MIME types are correctly set:

  • Open your Apache configuration file (e.g., httpd.conf or mime.types).

  • Add or ensure the following line exists:

 

AddType application/javascript .js

 

For Nginx, ensure similar configuration:

  • Open your Nginx configuration file (e.g., nginx.conf).

  • Add or ensure the following line exists:

 

types {
    application/javascript js;
}

 

4. Rebuild Client Libraries in AEM

  • Go to http://<your-aem-instance>:4502/libs/granite/ui/content/dumplibs.rebuild.html
  • Click on Rebuild All.

5. Inspect HTTP Response Headers

  • Open the developer tools in your browser (usually F12).
  • Go to the Network tab.
  • Refresh the page and click on one of the JavaScript files (e.g., moment.min.1.0.js).
  • Check the Response Headers section for the Content-Type.

6. Check for Additional JavaScript Errors

  • Open the developer tools in your browser.
  • Go to the Console tab.
  • Look for any additional errors or warnings that might provide more information about what is going wrong.

By following these steps, you should be able to identify and resolve the issue with JavaScript files being served with incorrect MIME types or missing headers, which is causing the left-side menu navigation to malfunction post the service pack upgrade.

Avatar

Level 2

Hi Hrishi,

Thank you so much for the update.

This issue is specific to Publisher, we will validate on rebuilding of client libraries in publisher and get back to you.

 

Note: Hope no need to validate above rules/configurations on dispatcher level due to this issue is limited to Publisher only.

Avatar

Level 2

Hi Hrishi,

After rebuilding , we see error's with those 2 js files which are not minifying and see below error from logs while doing minification.

  • /libs/clientlibs/granite/dompurify
  • /libs/clientlibs/granite/moment

Later we see js processor updated with yui instead of gcc, after updating with gcc, issue has been fixed.

Caused by: org.mozilla.javascript.EvaluatorException: Compilation produced 7 syntax errors.

at com.adobe.granite.ui.clientlibs.impl.YUIScriptProcessor$1.runtimeError(YUIScriptProcessor.java:146)

at org.mozilla.javascript.Parser.parse(Parser.java:396)

at org.mozilla.javascript.Parser.parse(Parser.java:340)

at com.yahoo.platform.yui.compressor.JavaScriptCompressor.parse(JavaScriptCompressor.java:315)

at com.yahoo.platform.yui.compressor.JavaScriptCompressor.<init>(JavaScriptCompressor.java:536)

at com.adobe.granite.ui.clientlibs.impl.YUIScriptProcessor.minifyJS(YUIScriptProcessor.java:122)

at com.adobe.granite.ui.clientlibs.impl.YUIScriptProcessor.process(YUIScriptProcessor.java:117)