May 17, 2012 13

Installing Weinre on Mac OS X

By

Weinre

If you haven’t checked out Weinre, you really ought to!

Weinre is a debugger for web pages, like FireBug (for FireFox) and Web Inspector (for WebKit-based browsers), except it’s designed to work remotely, and in particular, to allow you debug web pages on a mobile device such as a phone.

While not as good as a full remote web inspector (like the one found on the PlayBook), its a great tool to help debug with mobile development. Weinre is part of the PhoneGap project and there is a publicly hosted version run as a service that can be found at debug.phonegap.com. Unfortunately the hosted service appears to be having a few problems & I’ve struggled to get local clients to connect, the good news is that Weinre can be installed and run locally.

Weinre was originally written in Java but has recently been ported to Node.js, these instructions will be for installing the Node version.

Install Homebrew

Homebrew is a package manager for the Mac and is what we’ll use to install Node. Full installation instructions can be found here (including the contents of the following script) but to jump right in run the following in Terminal:

/usr/bin/ruby -e "$(/usr/bin/curl -fsSL https://raw.github.com/mxcl/homebrew/master/Library/Contributions/install_homebrew.rb)"

Note: You’ll need XCode installed to be able to get Homebrew working

Install Node.js

Now Homebrew is installed you should be able to get Node by running:

brew install node

Install NPM

NPM is a package manager for Node.js and makes it easier to install/update/remove discrete Node modules. To install run:

git clone http://github.com/isaacs/npm.git
cd npm
sudo make install

Install Weinre

You should now have everything ready to be able to install Weinre, to do so run:

sudo npm -g install weinre

Running Weinre

Now Weinre is installed you can make a start using it locally. First you need to run the server:

weinre

You should now be able to connect to http://localhost:8080 from your desktop web browser. The page displayed will give instructions on usage.

Working with Real Devices

I recently wrote about my setup for testing web apps/sites on real mobile devices. If you’re also using this kind of a setup then you likely want to be able to run Weinre on something other than localhost. This is easily done by providing an additional startup flag. To use the fictional mywebapp.mobiledev.com domain used in aforementioned blog post, you’d simply run:

weinre --boundHost=mywebapp.mobiledev.com

You would then need to point your browser to http://mywebapp.mobiledev.com:8080.

  • Bastiaan Grisel

    Thanks man! This really helped to set things up and get me started!

  • Guest

    What do I do if lets say I have it with mamp in port 8888? 

  • http://www.joelambert.co.uk Joe Lambert

    I don’t use MAMP but it shouldn’t really make a difference which port your web server is running on.

    Weinre is running its own server daemon (by default on port 8080) so any of your websites running on MAMP on 8888 should still be able to access it even though its on a different port.

  • http://twitter.com/felipesabino Felipe Sabino

    Have you ever tried running weinre on heroku? I am having some 404 issues after loading the JS file at my target app.

    Good article, congrats :)

    Tks

  • http://www.joelambert.co.uk Joe Lambert

    I’ve not, I specifically wanted to run it locally so that it was more responsive.

    Perhaps ask @weinre:twitter on Twitter?

  • http://twitter.com/felipesabino Felipe Sabino

    Hi Joe,

    Thanks for the reply!

    I was finally able to run it on heroku with some stackoverflow help

    http://stackoverflow.com/questions/10842446/weinre-on-heroku

    And yes, it is not responsive at all running on the cloud, but it was good for learning though

    Cheers,

  • Jeff Lunt

    Do you know the minimum version of iOS required for weinre? I’ve been looking through the docs and can’t seem to find it anywhere. All of the other remote debugging tools require at least iOS 5 (or newer).

  • http://www.joelambert.co.uk Joe Lambert

    I’m not sure either, I know it works fine on iOS5 but haven’t personally tested it on anything lower.

  • Pingback: Phonegap IOS Project « My Logs

  • Mohamed Hussain

    Anybody helping me in installing Winre in my windows7 machine?

  • http://twitter.com/steinermatt Matthias Steiner

    Nice guide! Got me up and running in minutes – KUDOS!

  • Pingback: Debugging PhoneGap Applications with weinre – inscope-net - a developers diary

  • http://twitter.com/sshakeel Salman Shakeel

    Hi,

    Homebrew installation command needs to be updated as follows:

    /usr/bin/ruby -e “$(curl -fsSL https://raw.github.com/mxcl/homebrew/go)”

    Otherwise you will get a 404.

    Thanks.