This post originated from an RSS feed registered with PHP Buzz
by Alan Knowles.
Original Post: Using WebKit Inspector with seed
Feed Title: Smoking toooo much PHP
Feed URL: http://www.akbkhome.com/blog.php/RSS.xml
Feed Description: More than just a blog :)
Article originally from AK BK Consulting blog
One of the key reasons to create the app.Builder, was so I could speed up the development of Web applications using the Roo library. The web based version saved considerable time, and led to quite an improvement in delivery times for projects.
It's key drawback was the very limited editing enviroment offered by web based textarea, the slight latency and klunky file writing method. However the ability to use Firebug or Webkit inspector was very usefull in debugging in-development applications.
As I eat my own dogfood by developing with the desktop version, most of the previous issues with the development platform had been solved, however debugging was very difficult - I effectively had to run the application in a browser to get debugging information. So after a day of fustration with that, I decided to investigate the Webkit API a bit further, and to my delight discovered that the Inspector you see in Chromium / Chrome is just a few lines of code away.
As you can see above, I can fully debug the application as it's being modified.
The basic code to do this was quite simple. It needs a couple of fixes to the WebKit Gir file, (which has been submitted as a bug report to Webkit), but this simple bit of code should illustrate how to use it in seed.
//<Script type="text/javascript">
/**
* Test of web kit inspector.
* create a window + 2 webviews. inside scrolled window.
* load google in first, then hook in the inspector..
*
* needs the transfer ownship fixing on return value in WebKit-1.0.gir
*
* <method name="get_inspector"
* c:identifier="webkit_web_view_get_inspector">
* <return-value transfer-ownership="none">
* <type name="WebInspector" c:type="WebKitWebInspector*"/>
* </return-value>
* </method>
*
* then compile it..
* g-ir-compiler /usr/share/gir-1.0/WebKit-1.0.gir -o /usr/lib/girepository-1.0/WebKit-1.0.typelib
*
*/
Gtk = imports.gi.Gtk;
WebKit = imports.gi.WebKit;
Gtk.init(null,null);
// build the UI..
w = new Gtk.Window.c_new( Gtk.WindowType.TOPLEVEL);
v = new Gtk.VBox();
s1 = new Gtk.ScrolledWindow();
s2 = new Gtk.ScrolledWindow();
w1 = new WebKit.WebView();
w2 = new WebKit.WebView();
s1.add(w1);
s2.add(w2);
v.add(s1);
v.add(s2);
w.add(v);
// enable inspector..
w1.get_settings().enable_developer_extras = true;
// load google on show..
w1.signal.show.connect(function() {
w1.load_uri("http://www.google.com");
});
// load the inspector when loading has finished!
w1.signal.load_finished.connect(function(wv) {
w1.get_inspector().show();
});
// return the bottom window as the inspector..
w1.get_inspector().signal.inspect_web_view.connect(function() {
return w2;
})
// show and go..
w.show_all();
Gtk.main();
Previous Topic
