"Zero Width Space" hack for wrapping words in HTML

It's not easy to wrap words in non-IE browsers. IE has its proprietary CSS property : word-wrap. But for other browsers, if the word is too long, the text stretches. This is because that the wrapping happens between the words' boundaries, i.e. white spaces.

A small hack for this is to add "Zero Width Space" between all the characters in the word. By doing this, word wrapping can happen between all the characters, but the users can not see them since the width of the spaces is zero. This can be done by the following small function:

function breakWords(str) {
     Array.prototype.slice.apply(str).join("​​");
}

Securing extension updates for Firefox 3

If you have an old extension developed for Firefox 2, you may have encounter problems when porting it to Firefox 3. One major problem is that you need to provide secure updates for the extension, otherwise the auto-update is disabled. After looking at a good article from Mozilla, the problem seems easy to attack. Just provide a HTTPS connection for the updates and it's done. Yes, if you have a valid certificate for HTTPS connection, that should work. But for those use testing certificates, Firefox can not recognize these certificates and still fails to update the extension.

So we have to use the complex approach mentioned in the article, i.e. signing the updates. You need two tools for signing the updates, one is HashTab ,the other is McCoy. HashTab is used to calculate digital signature of the XPI files, while McCoy is used to sign the update manifests. Detailed steps are:

1. Use McCoy to create a new key.
2. Add the key to the install.rdf. ("Install" button in the toolbar)
3. Package the XPI file with the signed install.rdf.
4. Use HashTab to calculate the SHA1 signature of the XPI file.
5. Add to the update.rdf using the signature calculated in the previous step.
6. Use McCoy to add the key to the update.rdf ("Sign" button in the toolbar).
7. Place the signed XPI file and update.rdf to your web server.
8. Done.

Host Firefox extensions on Websphere sMash

If you want to host firefox extensions on a Websphere sMash server, you need to configure the MIME type of the XPI files to allow Firefox to install it automatically.

This can be done by adding following line in the zero.config file:

/config/mimeTypes += { "xpi" : "application/x-xpinstall"}

Fix the "PKIX path building failed" error in handling SSL in Java

When using HttpClient to send requests to servers that employed SSL connections, i.e. the URL starts with "https", it's common to encounter the "PKIX path building failed". This is because that the JRE installed on your machine doesn't have the certificate for the request. You have to add it manually.

To do this, you need to export the certificates first, then import it into the JRE's store. You can use Firefox to access the site first, then you got its certificate stored in Firefox. Take Firefox 3 for example. You can open the "Options" dialog,  then click the "View Certificates" to open up another dialog which lists all the certificates. Find the one you need and export it in format "X.509 certificate (DER)" to a directory, say "c:\temp". (See figure below)  

After that, you can use the JRE's keytool to import the certificate. A sample command is like:

 keytool -keystore "C:\Program Files\Java\jre\lib\security\cacerts" -import -alias mycert -file "c:\temp\my.cer" -trustcacerts. 

The default password is "changeit" if you didn't change it.

That's all.

Avoid time-consuming POST/PUT XMLHttpRequest for Safari 3.1 on Mac

Time-consuming POST/PUT XMLHttpRequest causes a problem on Safari 3.1 on Mac. The request will time-out if it

takes a long time to finish.

A bug was issued in Webkit's bugzilla and the bug was fixed in Safari's latest build (version 528.x). So you can wait for

the new version of Safari.

Distinguishing between JavaScript arrays and objects made easier

In JavaScript, it's not easy to distinguish between objects and arrays. The "typeof" operator returns "object" on both cases.  Using the "constructor" property doesn't work neither because the constructors of arrays from different browser windows or frames are not the same, which causes confusing behavior when an array is passed between browser windows as a argument.

In  Douglas Crockford's book "JavaScript: The Good Parts", he used a complex function as below:

var is_array = function (value) {

    return value &&

        typeof value === 'object' &&

        typeof value.length === 'number' &&

        typeof value.splice === 'function' &&

        !(value.propertyIsEnumerable('length'));

};

In one of his recent blog posts, he mentioned that Mark Miller from Google used a simple approach to do the same thing.

Object.prototype.toString.apply(value) === '[object Array]'

I went through the ECMAScript specification and found out the following:

The value of the [[Class]] property is defined by this specification for every kind of built-in object. The value of the [[Class]] property of a host object may be any value, even a value used by a built-in object for its [[Class]] property. The value of a [[Class]] property is used internally to distinguish different kinds of built-in objects. Note that this specification does not provide any means for a program to access that value except through Object.prototype.toString.

The [[Class]] property of Array.prototype is "Array" and Object.prototype.toString uses this value to generate the output in the format "[object " + [[Class]] + "]" which results "[object Array]".

I think the new approach can help us a lot.