Debugging html5 games

Debugging games can be VERY annoying.
Especially if you have to debug android 2.2 for instance.
You are on a mobile device, without debug messages.
Android provides remote debugging, but not for really old browsers or all phones.

What to do?

Well the easiest way I could come up with was create my own debug-console in javascript.

Here is a jsFiddle:
http://jsfiddle.net/GfmxT/3/

In Chrome it works fine, but I checked on Android this morning and found there was no scrolling (even though scroll is on auto), and on IE and firefox it doesn't scroll down automatically! But you can use the scrollbars. I've been fiddling on the iPad and saw I needed a function to stop the autoscroll so you can swipe-scroll through the debug statements.

So there IS more than meets the eye to this simple concept.
I allready had some great experiences with clients testing and copying information from the debug console to communicate an error. That's a lot better than a bug report saying: "It doesn't work on...".
Now I often don't even have to reproduce the error to be able to fix it.

It's only too bad that the real error messages don't come through like they do on the desktop console. But I think there is a jQuery function to do (part) of that as well. So I'll be updating this soon.