I'm writing a UserScript (=Greasemonkey) which I am developing in FireFox but works in Opera, FF and Chrome. I changed my entire script in Firefox, replacing all texts with variables as to be able to port the script easily to other languages. Now it no longer runs in Opera and it doesn't show any errors in the console (Dragonfly). The script does nothing at all, so there must be some syntax error that Firefox can handle but Opera not.
I do not use any specific FireFox features (GM_*), as I said: I only replaced strings in the scripts with variables defined in a new "translation" array.
Code to insert my script:
(
function()
{
var script = document.createElement("script");
script.textContent = "(" + myFunctionName + ")()";
document.body.appendChild(script);
}
)();
So...
Is there some JavaScript stuff that Firefox can handle but Opera not?
Or can I get the error console to work for a UserScript?
I did some googling and searched these forums but couldn't find anything that worked...
PS: I posted this on the Opera forums first but figured I have a much better chance getting a way to find a "debugging work-around" on SOF.
PPS: In the meanwhile I also tried locating the problem with JS Lint but that one gives an error when you as much as sneeze.
The message console (Ctrl+Shift+O) should contain errors from UserScripts. Alternatively, you could try packaging your script into an extension and use Dragonfly for debugging: http://dev.opera.com/articles/view/converting-userjs-to-extensions/
Related
I would like to use console.log(message) to write out some information to the browser console. However, I came across this url which seems to recommend against it:
https://developer.mozilla.org/en-US/docs/Web/API/Console/log
Are you currently choosing to use console.log(message) as part of your js code? If not then have you identified an alternative?
I agree with Mike C above-- console is generally available in most browsers, but you should probably remove console logs before a site gets pushed to production.
Additionally, some older browser might not have the console, and if you did accidentally leave in a console log, it would fire an error when it attempted to interact with with something that wasn't defined. As an extra failsafe, you can declare console and console.log in the global namespace if they are not detected, just in case:
if (!console) {
console = {
log: function () { //noop }
};
}
should I use a js function other than console.log(message)?
simple answer is yes, But also the console.log(message) is usaually used for testing purposes and for other relevant intentions like letting other developers interract with your js source code in some sort.
However.
You should not use it to log very important messages as this could be a hole your application presumably.
Hope it helps.
While the console object is not defined in the official Javascript standard, it is specified in:
Google Chrome
Mozilla Firefox
Internet Explorer 9+
Opera
Safari
Node.js
PhantomJS (since it uses V8 like Chrome and Node.js)
and more, I'm sure. As long as you're debugging in any of the environments which supports it, you're fine. You should be removing your logging statements before pushing to production anyway so as long as it works for debugging, it's nothing to worry about.
Just doing some JavaScript stuff in google chrome (don't want to try in other browsers for now, in case this is really doing real damage) and I'm not sure why this seemed to break my console.
>var x = "http://www.foo.bar/q?name=%%this%%";
<undefined
>x
After x (and enter) the console stops working... I restarted chrome and now when I do a simple
console.clear();
It's giving me
Console was cleared
And not clearing the console. Now in my scripts console.log's do not register and I'm wondering what is going on. 99% sure it has to do with the double percent signs (%%).
Anyone know what I did wrong or better yet, how to fix the console?
A bug report for this issue has been filed here.
Edit: Feeling pretty dumb, but I had Preserve log checked... That's why the console wasn't clearing.
As discussed in the comments, there are actually many different ways of constructing a string that causes this issue, and it is not necessary for there to be two percent signs in most cases.
http://example.com/%
http://%%%
http://ab%
http://%ab
http://%zz
However, it's not just the presence of a percent sign that breaks the Chrome console, as when we enter the following well-formed URL, the console continues to work properly and produces a clickable link.
http://ab%20cd
Additionally, the strings http://%, and http://%% will also print properly, since Chrome will not auto-link a URL-link string unless the http:// is followed by at least 3 characters.
From here I hypothesized that the issue must be in the process of linking a URL string in the console, likely in the process of decoding a malformed URL. I remembered that the JavaScript function decodeURI will throw an exception if given a malformed URL, and since Chrome's developer tools are largely written in JavaScript, could this be the issue that is evidently crashing the developer console?
To test this theory, I ran Chrome by the command link, to see if any errors were being logged.
Indeed, the same error you would see if you ran decodeURI on a malformed URL (i.e. decodeURI('http://example.com/%')) was being printed to the console:
[4810:1287:0107/164725:ERROR:CONSOLE(683)] "Uncaught URIError: URI malformed", source: chrome-devtools://devtools/bundled/devtools.js (683)
So, I opened the URL chrome-devtools://devtools/bundled/devtools.js in Chrome, and on line 683, I found the following.
{var parsedURL=new WebInspector.ParsedURL(decodeURI(url));var origin;var folderPath;var name;if(parsedURL.isValid){origin=parsedURL.scheme+"://"+parsedURL.host;if(parsedURL.port)
As we can see, decodeURI(url) is being called on the URL without any error checking, thus throwing the exception and crashing the developer console.
A real fix for this issue will come from adding error handling to the Chrome console code, but in the meantime, one way to avoid the issue would be to wrap the string in a complex data type like an array to prevent parsing when logging.
var x = "http://example.com/%";
console.log([x]);
Thankfully, the broken console issue does not persist once the tab is closed, and will not affect other tabs.
Update:
Apparently, the issue can persist across tabs and restarts if Preserve Log is checked. Uncheck this if you are having this issue.
Update 2:
As of Chrome 40, this issue is fixed.
I tried to run this script in Chrome, but it doesn't work.
Just the error Cannot read property 'length' of null appears.
if($("div.diashow").length>0&&$("div.diashow.list").length==0){
jQuery.ajaxSetup({async:false});
var objContent = $("#objectContent");
$("span.prev").remove();
$("span.next").remove();
$("p.next").remove();
$("div.screen img").unwrap();
var numOfSlides = parseInt($("span.volume").text().substr(11));
for(var i=2;i<=numOfSlides;i++){
$.get("document.URL"+"?_slideNumber="+i, function(data) {
var slidesCanvas = $("div.slidesCanvas",data);
$("span.prev",slidesCanvas).remove();
$("span.next",slidesCanvas).remove();
$("p.next",slidesCanvas).remove();
$("div.screen img",slidesCanvas).unwrap();
objContent.append(slidesCanvas);
});
}
}
I tried to fix it by myself, but with my limited javascript knowledge, I wasn't successful. Why does this script not work in Chrome? It works in Firefox.
Sample target page for the script.
That userscript uses #require to load jQuery, which is a good thing.
However, straight Chrome does not support #require (nor much of Greasemonkey's marvelous features).
So, to use that script as-is in Chrome, the smart thing to do is to install and use Tampermonkey. Tampermonkey has a number of advantages over a straight Chrome userscript, in ease of use, compatibility, and power.
If, you do not want to use Tampermonkey, then rewrite the script to use this cross-browser technique for loading jQuery.
I'm using jQuery for my app and I'm getting this error in IE:
Line: 13
Char: 9
Error: Expected Identifier, string or number
Code: 0
..well, as you can see, the error isn't quite helpful. How do you fix those weird IE errors? Is there any tool or a list of error descriptions that tells you what to fix?
Thanks
I would suggest looking at line 13 of your JS file to find out where the error is.
FWIW, the "Expected Identifier, string or number" error often occurs when you have a trailing comma in a list or object declaration. Firefox doesn't mind this, but IE does.
Here's an article on debugging javascript in IE. IE8 comes with a built-in debugger.
The IE Script debugger is quite OK.
But try Mozilla's error console first. It has sane line numbering. Maybe the errors are identical.
Make sure you have Microsoft Office installed
In IE, go to Tools -> Internet Options -> Advanced tab
From there UNCHECK "Disable script debugging (Internet Explorer)"
Then when a script creates an error, you will be presented with a dialog box:
Click the YES button to sign your life over to microsoft to start the debugger.
This is a really tedious workflow (the default sound that happens when a script bug is encountered is really annoying) so I don't think its a good way to work, recommend firefox error console over it any day.
See also.
When a javascript error occures in IE (or in other browsers) you get a popup saying that javascript error has occurred - usually this comes with a line number and some hint.
Sometimes it comes with line 0 and with no way of knowing what the problem is.
Javscript can come from HTML itself, from a js file or from JSP (and more).
Microsoft has a script debugger that helps a lot in finding where js errors are, however sometimes when a js error occurs the script debugger cannot find the code portion and thus its difficult of finding where is the root cause of the problem.
My question is whether anyone knows any way of making script debugger find the code any way (mostly happen with js code that is in JSP file), or at least include in the IE popup the method or js file where the error has occurred. (it only display the line number, and many times its line 0...).
Thanks,
Tal.
The error object which is created when an error is thrown by JavaScript is very unreliable when it comes to the source line, especially within IE. Browsers like Firefox and Safari are better at line numbers, but they are generally pointless due to minification of the files.
What is obviously of more use is getting the call stack, but due to the anonymous nature of JavaScript functions (well, that they can be anonymous) a call stack can often be hard to work out.
If you're doing a try/ catch you can do arguments.callee which will return you the method which called the current method which failed.
Here's a good example of doing a complete stack in JavaScript - http://eriwen.com/javascript/js-stack-trace/
Also developer tools included with Internet Explorer 8 is something good to trace and debug your javascript code
There is a version of Firebug called Firebug Lite that will work with Internet Explorer. It's performance is going to be based on how complex your pages are; however, for relatively lightweight pages, it should provide some insight.
I recommend this tool rather than simply using Firebug and Firefox because not all errors that occur in Internet Explorer will occur in Firefox, and so performing any debugging in that browser may not yield any results.
Firebug on Firefox is usually considered one of the best debugging tools.
On Firefox, go to
http://getfirebug.com
to get it.
This will print you a stack trace:
function Stack()
{
try
{
throw Error()
}
catch(ex)
{
return ex.stack
}
};
print( Stack() );
If all else fails (and when dealing with IE it sometimes does) you can always walk through your code with alerts. It's crude and tedious, but sometimes it's all you can do:
Simply:
var count = 0;
then sprinkle some:
alert(count++);
at strategic lines along your code and note where it stops alerting.
Lather rinse repeat until you have your line.
If using Firefox you can press Ctrl + Shift + J to bring up the JavaScript error console that is built into Firefox, which will tell you exactly what went wrong.