Remote debugging with Dart

Question

The Motivation for this question is, that it took me about two hours to find out what I was doing wrong. How can I remotely debug my Dart-Webapp (may work for other kind of local websites as well) on my Android phone or emulator?

Answer 1

On the smartphone:

1. Enable USB-Debugging on the phone. You can find it in the "Developer Settings" which are hidden on android 5.0. If you have android 5, go to the Device Information and tap the build number until something happens. If those instructions are too unclear, this link should help.

2. Make sure your server is running :P

3. Connect the phone per USB with your PC and wait until the drivers are installed - aka Windowsexplorer shows you a popup asking what to do with the phone. You can dismiss that.

4. Open chrome on your Android phone

5. Open chrome on your Computer and navigate to chrome://inspect

6. There, you should see your phone listed. Now select the Button "port forwarding" and a popup will ... well ... pop up. There you enter in the left field named 'Port' some Port - 8080 works fine for me. This is a listening port that will be on the phone. That means after you set the port forwarding up, you can open the Url localhost://8080 on your phone (in chrome) to navigate to your website. Your website can you specify in the right field named 'ip and Port'. For the Chrome Extension "Chrome Dev Editor" I enter http://192.168.0.6:51792/which is the ip, port and path on my server. Chrome Dev Editor tells you what you can Enter there when you right-click your main.dart and select deploy to phone.

7. select "Done" and navigate to the URI with your phone - that would be localhost:8080/MyNewDartTry/web/index.htmlif you followed my example. But I believe you could also enter in the port-forwarding popup the whole address and then only open localhost:8080 on your phone. The localhost:8080 is mapped to the link you entered.

8. As soon as you close Chrome on either your Desktop or your phone, the port-forward will be stopped.

With the emulator

1. Start your emulator

2. find your server's port. e.g. 54321

3. Open the browser in your emulator and enter 10.0.2.2:54321/MyNewDartTry/web/index.html(or whatever follows after your slashes, but make sure the IP is 10.0.2.2 - that refers to your computer on which the emulator runs

Hope this helps anybody

EDIT: If chrome does not find your device even though the phone has also opened chrome and you followed all the steps, consider Emmanuel Malacarne's answer.

C:\Users\YOUR_USERNAME\AppData\Local\Android\sdk\platform-tools && C: & adb.exe kill-server & adb.exe start-server" The directory depends on your installation of your ADT.