Add jQuery code assist to Eclipse WTP on Mac OS X

I'd recently run across a nifty patch for Eclipse WTP which adds jQuery code assist to WTP's stock JavaScript features. The installation instructions looked simple enough, back up the original WTP JavaScript jar file, download the jQueryWTP patch, run it, and voila, jQuery development gets a little faster in Eclipse. Unfortunately, it wasn't that easy.

During my first attempts, the jQueryWTP patch installer wouldn't run on Mac OS X 10.4.11 at work. The patch wouldn't run on Leopard at home either. Neither the jQueryWTP project nor its SourceForge download page provide Java or WTP version requirements. All screenshots I've seen show installation on Windows. After a lot of flailing, I was eventually able to get the patch installed. Here is an archive of my trials and tribulations.

Requirements

It appears that Java 6/JRE 1.6 are required to run the jQueryWTP jar file. It also appears that a version of WTP prior to 3.0 may be required too. I had recently upgraded Eclipse 3.3 Europa to 3.4 Gannymede and WTP 3.0.3. The 3.0 WTP release does not include the referenced WTP JavaScript jar file. I reverted to my Eclipse 3.3 installation to install this patch.

Install the jQueryWTP Patch on Mac OS X 10.5 Leopard

These steps assume that you've installed all available Java updates to bring Leopard up to Java 6.

  1. Check which version of Java is set as primary. If you see version 1.5 or lower, you'll need to update your Java preferences. If you see version 1.6, skip to step 4.
    % java -version 
    java version "1.5.0_16" 
    Java(TM) 2 Runtime Environment, Standard Edition (build 1.5.0_16-b06-284) 
    Java HotSpot(TM) Client VM (build 1.5.0_16-133, mixed mode, sharing)
  2. Open /Application/Utilities/Java/Java Preferences. Drag and drop Java SE 6.0 to the top of each list.
    OS X Java Preferences
  3. Check the Java version again, you should see 1.6 now.
    % java -version
    java version "1.6.0_07"
    Java(TM) SE Runtime Environment (build 1.6.0_07-b06-153)
    Java HotSpot(TM) 64-Bit Server VM (build 1.6.0_07-b06-57, mixed mode)
  4. Make a backup copy of your eclipse/plugins/org.eclipse.wst.javascript.ui_1.0.102.vNNNNNNNN.jar file somewhere outside of the eclipse folder
  5. Download the jqueryWTP patch from SourceForge.
  6. Double-click jqueryWTP0.2forJQuery1.2.6.jar to run it.
  7. Select your eclipse/plugins/org.eclipse.wst.javascript.ui_1.0.102.vNNNNNNNN.jar and a location to export the patched version of the file. I saved mine to the Desktop.

    jQueryWTP file patch

  8. Click the Generate button. You should see a "generate success" dialog.
  9. Copy the patched version of org.eclipse.wst.javascript.ui_1.0.102.vNNNNNNNN.jar over the original.
  10. Fire up Eclipse and give it a try. Start typing jQuery and hit Ctrl + Spacebar to display completion suggestions.

    jQueryWTP code assist

Install the jQueryWTP Patch on OS X 10.4 Tiger

An additional requirement for installing jQueryWTP for Eclipse on Mac OS X 10.4 is X11. If you don't have X11 installed, you can get it here.

  1. You'll need Java 6 to run the patch file. Use these instructions to install the SoyLatte Java 6 port.
  2. Make a backup copy of your eclipse/plugins/org.eclipse.wst.javascript.ui_1.0.102.vNNNNNNNN.jar file somewhere outside of the eclipse folder
  3. Download and save the jqueryWTP patch from SourceForge to your Desktop.
  4. Fire up X11, source your .profile to load add JRE 1.6 to your PATH, and run the jqueryWTP patch from the terminal.
    % source ~/.profile 
    % java -jar ~/Desktop/jqueryWTP0.2forJQuery1.2.6.jar
  5. Select your eclipse/plugins/org.eclipse.wst.javascript.ui_1.0.102.vNNNNNNNN.jar and a location to export the patched version of the file. I saved mine to the Desktop.

    jQueryWTP file patch in X11

  6. Click the Generate button. You should see a "generate success" dialog.
  7. Copy the patched version of org.eclipse.wst.javascript.ui_1.0.102.vNNNNNNNN.jar over the original.
  8. Fire up Eclipse and give it a try. Start typing jQuery and hit Ctrl + Spacebar to display completion suggestions (see the screenshot above).

I hope this helps other jQuery developers out. There are also patch files for ExtJS, jQuery UI, Prototype, and YUI which you might try too.

Share