Weinre is a great remote web debugging tool. It allows to you to quickly setup a ‘chrome dev tools’-like interface for any of your app. It comes in really handy when debugging an app on a device that does not have advanced debugging tools, think mobile, smart TVs, wearables and so on ..
Weinre is free, open source and runs on Node.
- You need to have access to the DOM on a remote device and do some CSS tweaks
- You want to access the JS log output
- You want to check the network connections and what is going through the network
- You want all of that in a tool that runs on Node.
- You want to debug a device that is not in the same local network as yours. Check out JSConsole.
- You can’t modify your app’s code
Here is a straight to the point guide on how to get started.
Easy with npm
$ npm -g install weinre
weinre is enough to start the server but here are 2 useful options that you might as well pick up straight away:
$ weinre --boundHost 192.168.123.1 --httpPort 8888
--boundHostdefaults to localhost -> use your own IP instead. Localhost won’t mean [your machine] anymore when you are on your remote device.
--httpPortdefaults to 8080 which is also commonly used so save yourself some issues down the line and change it to something else.
<head> of your code, add the weinre script tag:
(Replace the IP with your machine’s IP and the port with whatever port you are using)
Reload or launch your app on the device under test (or simply in your browser).
- Open a browser (Chrome or Safari are supported) and go to:
http://192.168.123.1:8888or the equivalent for your IP and Port.
- Click on the first link: Access points > debug client user interface. (Something like http://192.168.123.1:8888/client/#anonymous)
- Your device should appear under Targets. Click on the corresponding link and you are ready to go.
The debugging tools are quite similar to browser’s dev tools so I am sure you can take it from there :)
Give it a try and see if it fits your needs. Weinre is an excellent tool, I have used it a lot, keep it in mind and you will soon find tons of real life situations where this is useful.
Check out the docs for more info.