Any way to collect beta testers' console logs?

Question

I plan on launching a closed beta of a web app I'm working on, and I'd like a way to easily collect console log data from the testers. By "easily" I mean easy for them, because most of them won't be technical enough to open up the console and copy/paste info and errors. Is there some way I can collect this, including all log/info/warn/error statements, and stack traces?

EDIT: I should clarify that it's mostly the unhandled exceptions I'm worried about, so overriding console.error will do nothing since that function is not being called.

http://stackoverflow.com/questions/11403107/capturing-javascript-console-log — Rick S, Sep 18 '15 at 18:01
@RickS See my edit above. I'm not making calls to `console.log` or `console.error` — ffxsam, Sep 18 '15 at 18:04
What about window.error? https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onerror — Rick S, Sep 18 '15 at 18:06
See the answer with 370 votes: http://stackoverflow.com/questions/951791/javascript-global-error-handling — Rick S, Sep 18 '15 at 18:08

score 3 · Accepted Answer · answered Sep 18 '15 at 18:09

Update

You've edited your question saying that what you want is to log the errors, so, you must use the onerror event, available in the window object.

window.addEventListener('error', function(e) {
  // log whatever you want here
});

You can do something like that in your Javascript:

console.print = console.log;
console.log = function() {
  console.print(arguments);

  // collect your data here, for example, sending a XHR
  var params = "values=" + encodeURIComponent(JSON.stringify(arguments));
  var xhr = new XMLHttpRequest();
  xhr.open('POST', '/log-data');
  xhr.send(params);
}

You override the console.log functionality, and you can do whatever you want there.

Perfect. And `e` has all the details I'd need too, such as line number, error message, URL. — ffxsam, Sep 18 '15 at 18:14

score 0 · Answer 2 · answered Sep 18 '15 at 17:59

0

Look into a logging library that supports logging to a database or make some logging functions that will do an ajax post with the log/info/warn/error as they arise. Make the post contain simple information like a timestamp, user, and console output. On the back end have it log all the information. This will be the easiest way for the users.

answered Sep 18 '15 at 17:59

Joseph Evans

1,360
9
14

Sure, a logging library will work, but not in the case where there's an unhandled exception that I wasn't planning for (or have no control over if it's in a third party library). – ffxsam Sep 18 '15 at 18:00
@ffxsam well you could override `console.log` to write to a db, and you could capture `window.onerror` and log it to a db as well. – dmeglio Sep 18 '15 at 18:01
Overriding `console.log` or `console.error` won't help. An unhandled exception does not use those functions. Try overriding those functions, then doing `throw Error('ouch')` and see what I mean. – ffxsam Sep 18 '15 at 18:02
@ffxsam As I said, also handle `window.onerror` which will capture such things. See https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onerror – dmeglio Sep 18 '15 at 18:05
@dman2306 Like this? `window.onerror = function () { console.log('override worked'); }` – ffxsam Sep 18 '15 at 18:06
@ffxsam exactly. If you do a `throw Error('ouch')` somewhere in your code, you should see a console log of `override worked` – dmeglio Sep 18 '15 at 18:06
I tried this in the Chrome console and it didn't work, unfortunately. – ffxsam Sep 18 '15 at 18:07
If you want to provide an answer with a working solution, feel free! – ffxsam Sep 18 '15 at 18:07
@dman2306 AH! Works in jsfiddle. Just not in the devtools console. Thanks! – ffxsam Sep 18 '15 at 18:10
Though I like Buzinas's solution below, using `addEventListener`. Seems cleaner, plus the event object is nice and clean, and contains all the details I'd need (URL, line, col, etc) – ffxsam Sep 18 '15 at 18:13

score 0 · Answer 3 · edited May 23 '17 at 12:00

I stumbled upon a same issue not long ago for a webapp for students.

Please take a look at my answer at "Get console history": https://stackoverflow.com/a/40126638/1878974

Basically, I wrote a simple library to catch all console[log/info/warn/err/debug] calls and store them in console.history as an array.

The library is available on GitHub, with more examples and documentation: https://git.io/console

So, using console.history, you can - using @Buzinas's answer - easily POST the full console history to your server or storage solution:

window.addEventListener('error', function(e) {

  // POST request to server
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.open("POST", "/log-data");
  xmlhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
  xmlhttp.send(JSON.stringify(console.history));

});

score 0 · Answer 4 · answered Oct 19 '16 at 19:09

0

Someone told me about a really cool error logging service called Rollbar which will actually automatically log unhandled exceptions. I'm using it now and it's been a huge help!

answered Oct 19 '16 at 19:09

ffxsam

26,428
32
94
144

Any way to collect beta testers' console logs?

4 Answers4