Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Log JavaScript console into a log file with Firefox

We have a web application which runs in a kiosk mode Firefox, using the RKiosk extension to achieve this. We suspect that we have a very rare error in the system which yields in a JavaScript error. However because we can't access the JavaScript console we can't examine the log.

I'm searching for an option to make Firefox log all JavaScript console messages into a file regardless of the tab and page opened. I can't seem to find any extension for this. I'm already using log4javascript which sends errors back to the server, but it seems that our application crashes in a way that it skips the logging altogether.

like image 718
NagyI Avatar asked Oct 10 '13 14:10

NagyI


1 Answers

Writing to a file sounds like a tedious task to me. It requires privileges that browser code doesn't normally have and you'd have to negotiate with an add-on you'd have to write in order to access file I/O.

From what I understand your issue is

I'd like to make Firefox log all errors

There are several approaches we can do to tackle this

First approach - log everything to localStorage too:

Now, rather than writing to an actual file, you can write to localStorage or IndexedDB instead.

localStorage["myApplog"] = localStorage["myApplog"] || "";
var oldLog = console.log;
console.log = function(){
    oldLog.apply(console,arguments); // use the old console log
    var message =  "\n "+(new Date).toISOString() + " :: "+
                   Array.prototype.join.call(arguments," , "); // the arguments
    localStorage["myApplog"] += message; 
}

This is rather dirty and rather slow, but it should get the job done and you can access the log later in local storage. LocalStorage has a ~5MB limit if I recall correctly which I think is enough if you don't go crazy with logging. You can also run it selectively.

Second approach - log only errors

This is similar to what Pumbaa80 suggested. You can simply override window.onerror and only log errors.

// put an empty string in loggedWinErrors first
var oldError = window.onerror || function(){};
window.onerror = function(err,url,lineNumber){
   oldError.call(this,err,url,lineNumber);
   var err ="\n Error: (file: " + url+", error: "+err+", lineNumber: "+lineNumber+")"); 
   localStorage["loggedWinErrors"] += err;
}

Third and drastic approach - use a VM.

This is the most powerful version, but it provides the most problematic user experience. You run the kiosk in a virtual machine, you detect an uncaught exception - when you do you freeze the machine and save its state, and run a backup VM instead. I've only had to do this when tackling the most fearsome errors and it's not pretty. Unless you really want the whole captured state - don't do this.

Really, do the extension before this - this is tedious but it gets very solid results.


In conclusion, I think the first approach or even just the second one are more than enough for what you need. localStorage is an abstracted storage that web pages get for saving state without security issues. If that's not big enough we can talk about an IndexedDB solution.

It all really depends on the use case you have.

like image 101
Benjamin Gruenbaum Avatar answered Oct 03 '22 19:10

Benjamin Gruenbaum