Google Virtual Keyboard Doesn't Work With PrototypeJS

Google recently stepped up their multiple languages game by adding support for additional languages in their Languages API. This includes nine new typing layouts for their drop-in virtual keyboard typer for form field controls. This will ultimately help your website to be more internationally usable and more comfortable to users who might speak or write in a language different than your site's default.

Figure 1. Input Hebrew characters from an English keyboard or by clicking the buttons with the mouse. Click to go to a test page.

But there's a problem. Wanting to test the newly added Hebrew JavaScript keyboard, I went to test it out on an internal project that uses some Hebrew fields but started seeing javascript errors. After some debugging and chatting with a Google engineer, I realized that the problems occur because, 1., we are using the Prototype JS Library and 2., Prototype "takes over" and "invades" the Javascript namespace to provide convenience functions like .capitalize() and .each() to native objects like String and Array. These "latched-on" Prototype methods collide with some of the functions of Google's code.

This brings up an interesting discussion which I hadn't thought about before. Are these problems the fault of Google's or Prototype's programming techniques? The Googler argued that Prototype's convenience functions (such as Array.each) can cause problems with other (and future) libraries that aren't specifically written with Prototype in mind. I realize this now and have to agree -- I might be more inclined to use the jQuery library from now on because of this; I tested the Virtual Keyboard API with jQuery loaded and didn't see any errors. So although Prototype adds methods to javascript that make programming faster and easier, those very methods and techniques could reduce compatibility with other third party libraries.

For example, whereas Prototype adds an .each() method to the native Array type so you can do things like

new Array(1,2,3,4).each(alert);

with jQuery you use a function of the jQuery namespace to do the same thing:

jQuery.each(new Array(1,2,3,4),function(){ alert(this); } );

Still, due to the widespread use of the Prototype library I believe Google should be able to make their code work gracefully with or without Prototype, which is why I posted a defect in their issue tracker.

Bookmark and Share    
blog comments powered by Disqus