Debugging with the YUI console

Debugging is one area where JavaScript has suffered in the past — there are a range of browser plugins available which help to some extent, but if we wish to debug an issue that occurs in a browser that doesn't have these usual features, we have a problem!

YUI's answer to this problem is the YUI Console, as shown in the following image:

This is a widget that displays a log of all messages that have been written to the console log. These include messages from existing YUI widgets and plugins, but may also include customized messages logged from our own JavaScript code.

In this recipe, we will display the YIU console and log some example messages to it.

Getting ready

First, we create a PHP page yui_console.php to house the console, with the following content:

<?php
require_once(dirname(__FILE__) . '/../config.php');
$PAGE->set_context(get_context_instance(CONTEXT_SYSTEM));
$PAGE->set_url('/cook/yui_console.php');
$PAGE->requires->js('/cook/yui_console...