About

mFabrik Blog is about mobile and web software development, open source and Linux. We tell exciting tales where business, technology, web and mobile convergence.

Creative Commons License
This work is licensed under a Creative Commons Attribution 3.0 Unported License.

Testing mobile websites with Firefox Mobile for PC (Fennec desktop)

Firefox Mobile (Fennec) has also desktop builds. They are very useful for mobile web site testing as the browser is fast, has real keyboard and is only one mouse click away.

Here are instructions how to run Firefox Mobile on Ubuntu Linux (tested on 32-bit Ubuntu 10.10)

wget http://releases.mozilla.org/pub/mozilla.org/mobile/releases/latest/linux-i686/fennec-5.0.en-US.linux-i686.tar.bz2
tar -xjf fennec-5.0.en-US.linux-i686.tar.bz2
cd fennec
./fennec

.. and thats all you need. It works out of the box! 400x times faster than using Android emulator browser.

There are also OSX and Windows builds available.

Get developers  Subscribe mFabrik blog in a reader Follow me on Twitter

Everyone loves and hates console.log()

console.log()  is the best friend of every Javascript junkie. However, the lack of it isn’t. console.log() function is only available in Webkit based browsers and with Firebug in Firefox. It’s the infamous situation that someone leaves console.log() to Javascript code, doesn’t notice its presence, commits the file and suddenly all Javascript on the production server stops working for Internet Explorer users….

To tackle the lack of console.log() problem there are several approaches.

Use dummy placeholder if console is missing

This snippet wraps console.log (need to repeat for console.error etc.):

// Ignore console on platforms where it is not available
if (typeof(window["console"]) == "undefined") { console = {}; console.log = function(a) {}; }

Pros

  • Easy

Cons

  • Need to add to every Javascript file
  • Messes with global namespace

Use module specific log function

This makes your code little bit ugly, more Java like. Each Javascript module declares their own log() function which checks the existence of console.log() and outputs there if it’s present.

mfabrik.log =function(x) {
 if(console.log) {
 console.log(x);
 }
}

mfabrik.log("My log messages")

Pros

  • Easy to hook other logg
  • You can disable all logging output with one if

Cons

  • Not as natural to write as console.log()
  • Need to add to every Javascript module

Preprocess Javascript files

Plone (Kukit / KSS) uses this approach. All debug Javascript is hidden behind conditional comments and it is filtered out when JS files are bundled for the production deployment. (The preprocessing code is here in Python for those who are interested in it).

if (_USE_BASE2) {
 // Base2 legacy version: matchAll has to be used
 // Base2 recent version: querySelectorAll has to be used
 var _USE_BASE2_LEGACY = (typeof(base2.DOM.Document.querySelectorAll) == 'undefined');
 if (! _USE_BASE2_LEGACY) {
 ;;;     kukit.log('Using cssQuery from base2.');

Pros

  • Makes production Javascript files lighter
  • Make production Javascript files more professional – you do not deliver logging statements indented for internal purposes for your site visitors

Cons

  • Complex – preprocessing is required

Commit hooks

You can use Subversion and Git commit hooks to check that committed JS files do not contain console.log. For example, Plone repositories do this for the Python statement  import pdb ; pdb.set_trace() (enforce pdb breakpoint).

Pros

  • Very robust approach – you cannot create code with console.log()

Cons

  • Prevents also legitimate use of console.log()
  • Github, for example, lacks possibility to push client-side commit hooks to the repository cloners. This means that every developer must manually install commit hooks themselves. Everything manual you need to do makes the process error prone.

Other approaches?

Please tell us!

Get developers  Subscribe mFabrik blog in a reader Follow me on Twitter

Setting Google Apps hosted email as your browser’s default email client for mailto protocol

Would it be nice that when you click email link (maito) in your browser you could directly send email from your organizations’s Google Apps hosted service? (Google Apps is GMail + Google Docs for corporate/organizations with own domain name).

Here are instructions how to achieve it.

Firefox

Follow instructions by Steve Novoselac.

Opera

Here are instructions for Opera 10:

  • You have file webmailproviders.ini where web mail backends are lsited
  • This file is located in Applications/Opera (you need to right click and choose Show package contents) and Resources/defaults/webmailproviders.ini (on OSX, for Windows Linux follow the instruction links below)
  • Add the email provider description as below. Note that you need to change Google Apps domain name to your link. After saving the file you need to restart opera. You don’t need icon if you don’t have one.
  • Then restart Opera, choose Preferences -> Advanced -> Programs -> mailto -> your email account.
[DOMAIN_NAME]
ID=8
URL=https://mail.google.com/hosted/DOMAIN_NAME?extsrc=mailto&url=%s
ICON=https://mail.google.com/favicon.ico

Web mailto in OperaWiki

More HTTP links to trigger email send for various email providers

Get developers  Subscribe mFabrik blog in a reader Follow me on Twitter