The low down: Download FireFox 5 + FireBug 1.8.4 and BAM! Instant CSJS debugger!
Yup! It’s basically that simple (for once). Read on for the gory details…
In one of my client projects I had the opportunity to work with XPages in the Notes Client, or XPiNC for short. Being a developer with almost 20 years experience I take “limited pleasure” in developing for the Notes client. My opinion is that you’re too restricted in what you can achieve front-end and graphical layout is unmistakably Notes – in a bad way. IBM Notes has it’s benefits – like you only have to worry about the shortcomings of one client, where as web clients have a legion of different vendors and versions. Sometimes even the same vendor is incompatible with it’s own versions! Yes – I’m looking at you Internet Explorer! But still, the benefits of web based development outweighs the negatives, at least for me.
But, hey! We have a new kid in town: XPages! Who’s supposed to run in the Notes client, more or less without modification…
“Wow! What a totally amazing, excellent discovery!”-Wayne Campbell
Excellent! Or – It could have been
XPiNC uses a browser to render your XPage inside the Notes client. We have been able to do parts of this for years, by utilising an embedded browser control in the Notes client:
Domino Designer – Form – Create / Object / Control – “Microsoft Web Browser”
You can see in action here, from an application I did a while back. We’re jumping straight into the action at 3:04 showcasing the embedded “Microsoft Web Browser”-control in an ordinary Notes form, no XPages as far as the eye can see!
Video demo of how an embedded web browser control can interact with a Notes client, without using XPages
Speaking of old browsers
Getting FireBug Lite
When I first started dealing with XPiNC I found that you can set some params in the XSP.properties file to enable some version of FireBug Lite:
That’s one way of doing it. But you’re stuck with a really old (and ugly!) version (surprise! NOT!) A much better way is to inject the FireBug addOn thru an Eclipse plugin. This way, no other developers will be bugged (pun intended) by the debugger and you can always enjoy the latest version of FireBug, regardless of what IBM seems fit.
So, without further ado, I present the excellent work by Mr Karsten Lehman: XPiNC app development tool
XPiNC front-end performance
Once that is over and done with, you can run my earlier JS snippet: window.navigator.appVersion – In my case that would return “5.0 (Windows; sv)”.
– Ok, great! We now know that you’re running R5.0 of something called a “XULRunner”. That’s neat and all! But why should I care?
Well, because XULRunner 5.0 is in all useful purposes equivalent to FireFox 5.0!
– Wohoo! Sweet! But.. But? Isn’t that like reallllly old?
Yes, yes it is. It was released back in the day: 21 of June 2011. 14 releases, or almost two years ago (That’s like 20 “web years”). The latest version, at the time of this writing, is R19.0!
(Earlier version of IBM Notes uses the XULRunner equivalent of Firefox 3.6.x)
Below is a comparison between the HTML5 capabilities between the different versions of Firefox currently used in IBM Notes vs the latest release of Firefox available:
[Click the image for the full comparison.]Comparing the HTML5 capabilities of the different versions of Firefox
As you can see the capabilities aren’t great, but whether it’s a real problem is entirely up to the application being developed. Put simply, if you’re not taking advantage of the capabilities in HTML5 (you should!) then this won’t be a problem.
To get some ideas, regarding the benefits of using HTML5, I recommend the site HTML5Rocks.
But the limitations doesn’t end there I’m afraid. I’ve included a comparison for CSS3 support below. Showing R3.6, R5.0 and R19 in that order. (Click the image for the full comparison! But be warned, it’s BIG!)
This is not an exhaustive comparison, but should give a good indication.
If you click the image, you will be painfully aware of small nuances that will plague your road to the pixel perfect heavens of stardom!
Running the browsers thru the ECMAScript testing page (click here to test it yourself) will make you even more depressed. Firefox 3.6 fails in 4247 tests, Firefox 5.0 fails 282 and Firefox 19 in 170. Granted that Firefox 5 scores pretty good, but for instance it doesn’t support the very common DOM operation parentElement. Makes you wonder what else it has in store for you programming endeavours doesn’t it?
Basically, what all this boils down to, is that to keep your XPages compatible with XPiNC you have to limit your webpages to the old standard that particular version of Firefox supports (dragging newer browsers down), or support two different versions of your XPages. Not a very appealing proposition either way.
I expected IBM Domino 9 to update the XULRunner, but no luck there. At least the public Beta 1 is still running R5.0 of XULRunner. I’m not expecting this to change for the released version, which is too bad.
Still some good news
If you’re a “Copy / Paste”-developer – who sticks with the default widgets provided with XPages, then the above probably won’t cause you much headache and I’m afraid you’ve read most of this in vain. Because XPages in combination with Dojo will make most of the differences go away and the ones that are left might be tolerable to you.
But if you like to not only push the envelope, but to kick the crap out of it! Then the above will be the cause of some major grief and sleepless nights.
Hopefully you can limit some of the pain, revelling in the fact that you can do your front-end debugging using all the glory of FireFox 5 instead of mocking about with the embedded XULRunner client in the Notes client. This includes installing a big fat and juicy version of FireBug 1.8.4 in FireFox 5, no more debuggers on a diet for you!
You can download FireFox 5 here and FireBug 1.8.4 here.
Yet to come
I plan a follow up post where I share my experience developing for XPiNC, like potential pitfalls and how to circumvent those.
Keep watching this space!
In the meanwhile you can follow me @JBoive &| Google+