Tuesday 15 January 2013

google chrome - Firefox Javascript console and network tab not showing important errors? -



google chrome - Firefox Javascript console and network tab not showing important errors? -

while casually debugging javascript on web page, noticed firefox (33.0 - windows 7) javascript console not tell me if .js files failed load, decided give closer look.

what found if have html script tag pointing wrong local url, page loads console shows no errors @ all. instead shows total path , file name wrong .js script if there nil wrong it.

i tried button element issuing xmlhttprequest non existing remote url, , same thing, no errors @ in console when clicking.

$("#button").click(function(){ console.log("clicked me") $.getjson("demo_ajax_json.js",function(result){ $.each(result, function(i, field){ $("div").append(field + " "); }); }); });

while "clicked me" show expected.

also verified every possible log setting in developer tools checked.

after reading had luck finish settings reset went through using menu > help > troubleshooting > reset firefox settings. but... no. errors still don't show up.

so, end of story, given decided this, , can't remember how long i've not been seeing errors exactly, questioning myself whether kind of errors not shown @ in firefox design , if it's prerogative of chrome... which, goes itself, shows errors (like illustration "net::err_file_not_found").

anyone quick test on console?

update, attaching screenshots of both firefox , chrome. as can see situation totally different.

code:

firefox console tab:

also no errors on missing files, name printed out in console if nil wrong them.

firefox network tab:

as opposed to

chrome console tab:

chrome network tab:

after looking @ screenshots added, noticed references resources on local file system, decided tests. found firefox indeed not study network errors files on local filesystem, reporting nil on console or network tab, study them network resources. unfortunately not reproduce errors in chrome exactly, local filesystem locked downwards rather tightly (i'm on enterprise-owned system) , chrome reports doesn't have permission access local filesystem, regardless of whether file exists or not (firefox says nothing). meanwhile, imagine if pointed script/link tags network address such cdn, or if testing on local test server like:

http://localhost/[script-address]

it should study error in both consoles.

here's test code:

and firefox net panel

and chrome console

preserving original reply below point, jquery api notes may helpful others find here

as mentioned in ian's comment, , jquery api document @ http://api.jquery.com/jquery.getjson/ jquery's getjson method fail silently if have syntax error, url doesn't exist, or if doesn't homecoming response. can forcefulness adding .fail() method phone call end so:

$("#button").click(function(){ console.log("clicked me") $.getjson("demo_ajax_json.js",function(result){ $.each(result, function(i, field){ $("div").append(field + " "); }); }).fail(function() { console.log("ajax request failed"); }); });

you can bind function error event using .ajaxerror method documented here: http://api.jquery.com/ajaxerror/

$.ajaxerror(function() { console.log("ajax request failed."); });

note when way, jquery pass function several useful parameters if create variables hold them, including error event itself, ajax object triggered it, settings used, , error string, can utilize output whatever info need console in order debug causing error. luck!

javascript google-chrome debugging firefox console.log

No comments:

Post a Comment