How to debug JavaScript in DukeScript - firebug-lite

Question

Is it possible to debug JavaScript when using DukeScript?
I've tried adding FirebugLite
<script type='text/javascript' src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>
It loads and that's awesome but it has no visibility of the $root model.
Also I don't know if it's possible to add breakpoints.

Answer 1

Partly, one can include FirebugLite. See for example here.
One problem I've found is that Firebug loads but has no visibility of the model, $root returns undefined.
I've tried to work around this problem by creating a Javascript resource MyResource.js under main/resouces
MyResource = {
loadFirebug: function(){
if (!document.getElementById('FirebugLite')){
E = document['createElement' + 'NS'] && document.documentElement.namespaceURI;
E = E ? document['createElement' + 'NS'](E, 'script') : document['createElement']('script');
E['setAttribute']('id', 'FirebugLite');
E['setAttribute']('src', 'https://getfirebug.com/' + 'firebug-lite.js' + '#startOpened');
E['setAttribute']('FirebugLite', '4');(document['getElementsByTagName']('head')[0] || document['getElementsByTagName']('body')[0]).appendChild(E);
E = new Image;E['setAttribute']('src', 'https://getfirebug.com/' + '#startOpened');
}
},
someProperty: "someProperty"
};
Then we create a correpsponding Java class in order to load the resource
#JavaScriptResource("MyResource.js")
public class MyResource {
#net.java.html.js.JavaScriptBody(
args = {}, body =
"MyResource.loadFirebug();"
)
public static native void loadFireBug();
}
Now in the onPageLoad() Java method we can invoke the JavaScript method that loads FirebugLite
/**
* Called when the page is ready.
*/
public static void onPageLoad() throws Exception {
d = new Data();
d.setMessage("Hello World from HTML and Java!");
d.applyBindings();
MyResource.loadFireBug();
}
Now when Firebug starts, it has at least a scope of its enclosing resource.
We still can't add breakpoints because the resource doesn't appear under the files. Perhaps DukeScript experts can suggest a better way of handling this.
Note 1: you can use load Bootstrap simply by including it into the the page with the script tag. See here
Note 2: Unfortunately FireBug Lite seems to have some problems with Bootstrap, beyond version 1.2. See here
Note 3: Here are a couple of ways on how to access a DukeScript model from the javascript context