I'm having trouble identifying a javascript error that is happening in production only. The error is:
Uncaught TypeError: (intermediate value)(...) is not a function
With a link to line 22182 in file: https://d2wvl99qs6f2ce.cloudfront.net/js/358ee32eac3992e61f9fa13a0c55203d.js
Clicking on the link, Chrome debugger shows an error at the following line:
(function(jQuery){
Here are some excepts around the line above:
/*
* jQuery SelectBox Styler v1.0.1
* http://dimox.name/styling-select-boxes-using-jquery-css/
*
* Copyright 2012 Dimox (http://dimox.name/)
* Released under the MIT license.
*
* Date: 2012.10.07
*
*/
(function($) {
$.fn.selectbox = function(options) {
...
}
})(jQuery)
/* jquery.nicescroll
-- version 3.5.0 BETA5
-- copyright 2011-12-13 InuYaksa*2013
-- licensed under the MIT
--
-- http://areaaperta.com/nicescroll
-- https://github.com/inuyaksa/jquery.nicescroll
--
*/
(function(jQuery){
...
})( jQuery );
Looking at the code and the error, it seems like I should change line:
})(jQuery)
to
})(jQuery);
This change would be consistent with my research that this error is commonly caused by a missing semi-colon. But, when examining the code used in my development environment, the same code (without the semi-colon) is not producing any error. I've tried setting breakpoints before the error so I can pause execution, add the semi-colon, and then continue execution but that hasn't been very informative (maybe I'm using the debug tools incorrectly...)
I'm struggling because:
The code in my development and production environment are the same (checked via github comparison).
I can't replicate the error in my development environment which limits my ability to debug.
The file, https://d2wvl99qs6f2ce.cloudfront.net/js/358ee32eac3992e61f9fa13a0c55203d.js, is a compilation of the js files from the head of my application. But, why is Chrome serving it from cloudfront?
What are some ways I can begin to identify the source of the problem? Is there a way I can modify code in Chrome Developer Tools or Firefox's Firebug to add the semi-colon and the continue execution? I've even tried pasting the javascript into JSfiddle but that broke fiddle (file is too long to paste). If it makes any difference, I'm building a Magento 1.9 application...
Turns out the answer is related to Magento. In the admin backend of Magento, there is an option to merge all javascript errors (Admin -> System -> Configuration -> Under Advanced tab go to click Developer -> Javascript Settings -> Merge Javascript files). When Javascript files are merged, all javascript errors that are normally ignored (such as a missing semi-colon in certain places) prior to the merge trigger errors. In my case, javascript files were being merged in production (for performance reasons) but not in the development environment.
In my case, the production environment was merging the javascript files while the development environment was not. Since there was a missing semi-colon I had noticed in the file above (see the question), the code in production was failing while the code in development worked.
Related
I have the following configuration setup in WebStorm:
When I click debug, it launches Chrome fine and navigates to the page, but my breakpoints never get hit. It's connected somehow though because I see all of the console.log() output in WebStorm.
I'm trying to navigate to the URL specified in the screenshot and have breakpoints in main.js get hit, but it doesn't work as expected (see: at all). I'm not exactly sure what I'm missing. I've tried setting a remote URL for the specific main.js file in the Remote URLs section, but that didn't help either.
For reference I run the application via bra run and npm run watch.
Quick Update
So I've been able to actually get a breakpoint to hit, but it's in a different file (in a different path):
../public/app/core/routes/dashboard_loaders.ts allows me to stop at breakpoints, but ../public/dashboards doesn't.
When I navigate to http://localhost:3000/dashboard/script/main.js?orgId=1, it hits the route:
.when('/dashboard/:type/:slug', {
templateUrl: 'public/app/partials/dashboard.html',
controller : 'LoadDashboardCtrl',
reloadOnSearch: false,
pageClass: 'page-dashboard',
})
Which ultimately does load the file ../public/dashboards/multi.js -- but no breakpoints are hit.
Further Updates
It looks like the script is served via the following command (in ../public/app/features/dashboard/dashboardLoaderSrv.js):
/*jshint -W054 */
var script_func = new Function('ARGS','kbn','dateMath','_','moment','window','document','$','jQuery', 'services', result.data);
var script_result = script_func($routeParams, kbn, dateMath, _ , moment, window, document, $, $, services);
Where $routeParams are type:script and slug:main.js - If I step into this function, I get an anonymous(?) file that's identical to my actual main.js file, but the name is like 43550 instead of main.js -- I think this is boiling down to a fundamental lack of knowledge in how JavaScript handles something on my part. :)
Edit: I found this issue for using webstorm with grafana (second edit) looks like this is you.
I think what he linked solves it with declaring a sourceUrl then your file isn't "anonymous" or rather dynamic.
//# sourceURL=filename.js
I.E
//# sourceURL=main.js
Reference How to debug dynamically loaded JavaScript (with jQuery) in the browser's debugger itself?
Here is the documentation and video on debugging in webstorm to make sure everything is setup properly. (I.E My default setting were to debug my index file instead of my project). Make sure you have their Chrome extension or Firefox Extension
General JS Debugging in Webstorm
Debugging for Chrome in Webstorm
Debugging for Firefox in Webstorm
Debugging Node.JS in Webstorm
Liferay 6.2. tries to use best practices and JS minification is one of them.
But what do you do when your unminified JavaScript works and minification produces errors like this (in Tomcat console):
12:23:48,794 ERROR [http-bio-8080-exec-10][MinifierUtil:111] 607: 21: identifier is a reserved word
12:23:48,797 ERROR [http-bio-8080-exec-10][MinifierUtil:111] 608: 45: identifier is a reserved word
12:23:48,802 ERROR [http-bio-8080-exec-10][MinifierUtil:111] 1: 0: Compilation produced 2 syntax errors.
12:23:48,805 ERROR [http-bio-8080-exec-10][MinifierUtil:88] JavaScript Minifier failed for_________ AUI().use('node', 'aui-base', 'aui-io-request', 'aui
[MinifierUtil:111] 607: 21: and [MinifierUtil:111] 608: 45: are not line numbers in your code (jsp/ftl/...) as man expects from console log and googling "identifier is a reserved word" or "JavaScript Minifier failed for_________" helped me almost nothing (ok, I knew about https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Lexical_grammar#Keywords normally).
Pasting code between <script> and </script> to JS lint or hint or any other JS tool is not an option as it contains many JAVA and spring/freemarker/liferay tags etc...
So - my question is - as I wasn't able to find best practices / methodologies for debugging this - what is your opinion (or even better - experience :)) ?
Well, you solved the problem in another way - just some pointers should you (or someone else) run into this issue again:
Minifier reports Line number and Offset in these error messages, but they're related to the content that the minifier sees - e.g. not in your JSP, FTL or other file, but in whatever gets passed to the minifier.
The way to read the minifier log is:
Line 607, column 21 as well as Line 608, column 45 have a problem
In the following line, you see JavaScript Minifier failed for_________ AUI().use('node', 'aui-base', 'aui-io-request', 'aui which is the first part of the content that the minifier sees - locating this code, you might be able to identify which content gets passed to the minifier and count down the lines (well, jump down 607 lines from there)
Side issues: Agreeing with #Origineil that the startup time rather points to another issue that you have - it shouldn't be that much unless you deliberately have processes running at startup. E.g. if you're running a cluster and each machine keeps its own lucene index, you must reindex at startup. If you want to work around that, two indexes might not be what you're after. But it's only an example, and you didn't ask for this. I just wanted to add some pointers. I assume that you have tuned your JVM memory settings already and are not running with the default bundle's settings?
I finally managed to solve the problem by:
copying the rendered (and unminified(!)) code between <script> and </script> and
paste it to JShint/lint/online minifier and re-check it there,
but I still wonder if there is some better way... (changing server properties from developer to production and back means restarting server few times at least and that takes about 300 seconds (only for restart) on my new(!) i7 vPro 64GB, SSD HDD workstation, so I try to avoid it as much as I can :)).
BTW: unminified code had some "deprecated" but simple ECMA methods that worked normally in JSFiddle and all latest browsers on my Win8.1...
I am doing an experimental HTML template wich comes with jquery.min.js file - one of the most popular javascript libraries.
When I load the template from my local hard drive it works fine.
When I upload it and load it from server (GWAN) I get error (I think is not the only one) in Chrome looks like this:
Uncaught SyntaxError: Unexpected token { jquery.min.js:3
I inspected a bit and realized there is a
function $
which was turned into
function$
by GWan. The space removed is causing an error in Chrome, Firefox and Safari. I haven't tested other browsers but my IDE also reports a syntax error in the downloaded from GWAN version of the JS file.
I have also tried uploading the files to another server (Apache) and no problem there. The js file was not modified...
Any clues on how to get over this? I suppose there is a bug in javascript on-the-fly optimization of GWan?
Thanks.
It's a known issue and it will be fixed in next release (soon)
You'll be able to disable minifying directly from a init.c script in G-WAN v4.10+, this way:
u8 *www_mini = (u8*)get_env(argv, USE_MINIFYING);
if(www_mini)
{
*www_mini = 0;
puts("> disable minifying");
}
You just have to wait for few days for the new v5 release.
If I enter the follow JavaScript code in Aptana Studio 3 then I expect some errors but it show nothing.
/**
* #type {string}
*/
var abc = 23;
abc.doesNotExists();
How can I enable the support for closure type annotation?
Currently Aptana supports only the annotations but not also the actual type checking. In order to type check you have to compile that code using the google closure compiler. If you set the compiler to the full optimized mode it will yell the warning that abc is a string ( as you placed it in the annotation comment ), but you have set a number value instead. In order to be able to take this from the command line of the closure compiler and integrate it into aptana you would need a plugin, but as far as i know, the closure plugin for eclipse/aptana has not been updated for the last 1 or 2 years, and also this feature that you would like to have was not implemented in the latest release of that plugin.
In other words, either you run the closure compiler separately and check the for warnings or errors in certain files, OR you fork the repo of the eclipse closure plugin and implement this feature yourself.
I had the same issue as you, but having too much work to do pushed me into opting for the first solution ( running the closure compiler separately in a console ). I had even placed a hook so each time i would save a file in that project it would run the compiler in the console view of aptana so i could check if i had introduced new errors or warnings.
Right off the bat, this is not your standard "I can't get javascript IntelliSense to work in Visual Studio." For the record:
I'm using Visual Studio 2008
I have installed SP 1
I have installed the hotfix for -vsdoc.js documentation files KB958502
I am developing a suite of interrelated jQuery plugins to be packaged as resources in a class library. So within a directory, I have (as an example):
jquery-vsdoc.js
core.js
plug1.js
plug2.js
In core.js, I have the following at the top of the file:
/// <reference path="jquery-vsdoc.js" />
Then in each of the plug#.js, I have:
/// <reference path="jquery-vsdoc.js" />
/// <reference path="core.js" />
The IntelliSense works initially, even including the additions from core.js when working in the plugins. However, sometimes the slightest change, even adding and removing a space from the reference XML tags, or pressing Ctrl-Shift-J, results in the dreaded "Error updating JScript IntelliSense: Client-side script IntelliSense information was not generated due to an error in an external script reference." Except it was working with that external script reference just a second ago!
For the jquery-vsdoc.js, I am using Comment Version 1.3.2b (that's what it says in the file) from http://jqueryjs.googlecode.com/files/jquery-1.3.2-vsdoc2.js. I am omitting the version number from the file so that I don't have to change a bunch of references when it's inevitably updated.
So what could be the problem? Restarting Visual Studio is proving to be a horribly inelegant (and time-consuming) workaround.
Have you tried increasing the IntelliSense timeout?
By default, every IntelliSense request
is only allowed 15s to execute. This
is to prevent IntelliSense from
scripts with infinite loops. If you
have a large script or slower machine,
it may make sense to increase the
timeout limit. The timeout value
store within following registry keys
(depending on if your are using
Express or the full product). The
value is in milliseconds so choose
something greater than 15000.
HKEY_CURRENT_USER\Software\Microsoft\VisualStudio\9.0\HTML
Editor\JsFailsafeTimeout
HKEY_CURRENT_USER\Software\Microsoft\VWDExpress\9.0\HTML
Editor\JsFailsafeTimeout
Does closing and opening the file reset the state?
Open the task manager and watch the processes. Do you see a process called "typelibbuilder.exe" get started when you press Ctrl-Shift-J?
I'm trying to image what sort of problems might require a restart of VS. The processing of references (to which that message pertains) is done in a new and separate process every time you press Ctrl-Shift-J (unless processing has been disabled in which case you would see a different message). It almost sounds like the communication between VS and typelibbuilder or some other necessary component is failing.
In SP1, you shouldn't need to reference the "-vsdoc" files directly. If you reference "foo.js" and there is a "foo-vsdoc.js" file next to it, then VS will use the vsdoc version to generate intellisense. I doubt that is related to your problem though.
I know this isn't much consolation, but we've drastically improved performance and reliability of Javascript Intellisense in Visual Studio 2010. Beta1 is currently available to MSDN subscribers (although it is beta and there are still some bugs in it).
If you can get reliable repro steps, you could also file a bug report at http://connect.microsoft.com/.
I dont know if this will help you, but I've encountered the following bug in VS 2008 JS intellisense:
When adding jQuery as a reference in an external file, and then I update JS I get:
'XmlHttpRequest is undefined' on the line:
return window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
It seems like the JS intellisense engine is actually executing some of the jQuery code (more than likely to inspect it so it can provide some more information about it). However it looks like window.ActiveXObject is null to the engine, and so it falls into the 'new XMLHttpRequest()' block - which also fails.
I hacked a workaround that breaks all browsers except IE - so not a good solution. My fix changes the following:
xhr: function()
{
// hack to fix VS 2008 intellisense... note this breaks any browser
// except IE
var objXhr = { open: function() { },
setRequestHeader: function() { }
};
return window.ActiveXObject ? new ActiveXObject("Microsoft.XMLHTTP") : objXhr;
},
Now my intellisense works.
You may want to disable JavaScript intellisense in Visual Studio.
When SP1 is installed you can disable JavaScript intellisense.
Go to Tools, Options...
The Options dialog will show up.
Navigate to the following node in the left hand sided panel:
Text Editor :: JScript :: General
Disable the following options (in the group Statement Completion):
* Auto list members
* Parameter information