We're developing a FreshDesk app, and for that we need to load one of our JS components, which has jQuery included in noConflict mode. It should and on other sites it is working fine alongside other jQuery versions, but with Freshdesk SDK, our JS code throws the following error:
Error in event handler for runtime.onMessage: SyntaxError: missing ) after argument list
at chrome-extension://dhiijfebjgnbjcncjcdhmgehmhhojffe/js/frameworks/jquery-1.8.3.js:564:26
at Function.globalEval (chrome-extension://dhiijfebjgnbjcncjcdhmgehmhhojffe/js/frameworks/jquery-1.8.3.js:565:10)
at HTMLScriptElement.<anonymous> (chrome-extension://dhiijfebjgnbjcncjcdhmgehmhhojffe/js/frameworks/jquery-1.8.3.js:6019:20)
at Function.each (chrome-extension://dhiijfebjgnbjcncjcdhmgehmhhojffe/js/frameworks/jquery-1.8.3.js:611:25)
at init.domManip (chrome-extension://dhiijfebjgnbjcncjcdhmgehmhhojffe/js/frameworks/jquery-1.8.3.js:6004:16)
at init.append (chrome-extension://dhiijfebjgnbjcncjcdhmgehmhhojffe/js/frameworks/jquery-1.8.3.js:5777:17)
at init.<anonymous> (chrome-extension://dhiijfebjgnbjcncjcdhmgehmhhojffe/js/frameworks/jquery-1.8.3.js:5904:22)
at Function.access (chrome-extension://dhiijfebjgnbjcncjcdhmgehmhhojffe/js/frameworks/jquery-1.8.3.js:814:14)
at init.html (chrome-extension://dhiijfebjgnbjcncjcdhmgehmhhojffe/js/frameworks/jquery-1.8.3.js:5868:19)
Our library uses jQuery 3.1.1, the error comes from jquery-1.8.3 and by the path (chrome-extension:// ) it seems, that freshdesk's JS throws the error.
Particularly the SDK's extension's loading function, which looks like this:
// Evaluates a script in a global context
// Workarounds based on findings by Jim Driscoll
// http://weblogs.java.net/blog/driscoll/archive/2009/09/08/eval-javascript-global-context
globalEval: function( data ) {
if ( data && core_rnotwhite.test( data ) ) {
// We use execScript on Internet Explorer
// We use an anonymous function so that context is window
// rather than jQuery in Firefox
( window.execScript || function( data ) {
windowl "eval" ].call( window, data );
} )( data );
}
},
I guess our code is being eval-ed in the global scope. This practice would break with any JS code that's even somewhat complex (and honestly, seems to me like a very bad practice).
- When we don't include our JS component's sourcecode in our app.js, it runs fine.
- When we include our component in our template.html withing <script> tags, it runs fine
- When we include it in our app.js, it breaks the SDK loader.