Wer kennt das nicht: man entwickelt mit JSON, will die AJAX Rückgabe kontrollieren und macht, wie gewohnt, im Firefox den Firebug auf und checkt unter Console den AJAX Request und sieht folgendes:

Nicht sehr erhellend! Total unübersichtlich! Nicht gut!

Wird JSON mit dem richtigen Header ausgeliefert, unter PHP geht der so:

header('Content-type: application/json');

Dann kann man ein feines Feature von Firebug nutzen:
den JSON View, dieser versteckt sich unter der Response als JSON Tab.

Ja schon besser! Aber, ich wiederhole, nur mit dem richtigen Header, mit text/html o.ä. ist dieser Tab nicht zu sehen.

Nun gut, trotzdem ein bißchen eng da alles in der FireBug Hülle.
Ich mach ja ganz gerne den Ajax Call in einem neuen Tab auf, um zu sehen ob alles drin ist.
Dann empfiehlt sich ein Firefox AddOn: JSONView

Dies rendered das JSON schön im Firefox, wenn , Ihr habts erraten, der Header stimmt: application/json !

So ist gut!

Google wirft seine Closure Tools in den open source Topf.

Das ist einmal die Closure Library, ein JS Framework. Wenn ich das auf den ersten Blick richtig erkannt habe, geht das in eine ähnliche Richtung wie zb. jQuery UI.

Der Closure Compiler ist ein Javascript Optimizer der Code viel viel viel schneller machen soll.
Um den dann auch weiterhin debuggen zu können gibt es den Closure Inspector in Form einer Firebug Extension direkt dazu.

Desweiteren gehören auch noch die Closure Templates zu dem Release, ein “sprachunabhängiges” Template System.

Mindestens die ersten beiden davon klingen durchaus interessant, vor allem wenn der Compiler mal hält was google verspricht.

The compiler removes dead code, then rewrites and minimizes what’s left so that it will run fast on browsers’ JavaScript engines. The compiler also checks syntax, variable references, and types, and warns about other common JavaScript pitfalls. These checks and optimizations help you write apps that are less buggy and easier to maintain.

eine weitere Supererweiterung für Firebug ist meiner Meinung nach FirePHP.

Das Tool ermöglicht PHP (debug)Ausgaben direkt an die Firebug Konsole zu schicken:

FB::log('Log message');

FB::info('Info message');

FB::warn('Warn message');

FB::error('Error message');

installieren lässt sich das Ding beqeum via pear:

pear channel-discover pear.firephp.org
pear install firephp/FirePHPCore

einbinden dann so:

// object oriented API
require_once('FirePHPCore/FirePHP.class.php');
$firephp = FirePHP::getInstance(true);
$firephp-> *

require_once('FirePHPCore/fb.php');
FB:: *

dann solche Dinge tun:

$firephp->setEnabled(false);  // or FB::

$firephp->log('Plain Message');     // or FB::
$firephp->info('Info Message');     // or FB::
$firephp->warn('Warn Message');     // or FB::
$firephp->error('Error Message');   // or FB::

auch sehr schön. Logging in Tabellenform:

$table   = array();
$table[] = array('Col 1 Heading','Col 2 Heading');
$table[] = array('Row 1 Col 1','Row 1 Col 2');
$table[] = array('Row 2 Col 1','Row 2 Col 2');
$table[] = array('Row 3 Col 1','Row 3 Col 2');

$firephp->table('Table Label', $table);  // or FB::

fb($table, 'Table Label', FirePHP::TABLE);

oder auch Tracing:

Traces
You can send a backtrace showing File, Line, Class, Method and Function information including Arguments to clearly show the execution path up to the point in your code where you triggered the trace.

$firephp->trace('Trace Label');  // or FB::

fb('Trace Label', FirePHP::TRACE);

uswusw.

uuund:
Es gibt auch ein Symfony Plugin dafür.

FireUnit ist eine Extension für eine Extension. Für Firebug nämlich.
Damit lassen sich dann ziemlich komfortabel Javascript Unit Tests machen.

Der Funktionsumfang ist überschaubar, was mir das Ding auf Anhieb sympathisch macht.

true / false Tests und String compare:

if ( typeof fireunit === "object" ) {
// Simple true-like/false-like testing
fireunit.ok( true, "I'm going to pass!" );
fireunit.ok( false, "I'm going to fail!" );

// Compare two strings - shows a diff of the
// results if they're different
fireunit.compare(
"The lazy fox jumped over the log.",
"The lazy brown fox jumped the log.",
"Are these two strings the same?"
);

}

Regex String Compare:

if ( typeof fireunit === "object" ) {

// Compare a string using a regular expression
fireunit.reCompare(
"The .* fox jumped the log.",
"The lazy brown fox jumped the log.",
"Compare a string using a RegExp."
);

}

und die Ergebnisse in der Firebug Konsole anzeigen:

if ( typeof fireunit === "object" ) {

// Display the total results
fireunit.testDone();

}

… was dann so aussieht:

nice.