Flutter Dev Tools — Network Debugging for iOS

Rathish Kannan
3 min readMar 10, 2023

Overview

This page will help developers to debug network requests from flutter app using chrome wen browser.

Below are my configurations

  • IDE — VSCode
  • Platform — iOS
  • Web Browser — Google Chrome

Attach

First, let’s attach the flutter app to a simulator

Step 1

  • Attach to flutter process, by pressing
CMD + Shift + P

Step 2

  • Just press enter here

Step 3

  • Wait for the connection to be established

Step 4

  • Launch your app in simulator (if you want to debug native iOS then launch by starting Cmd+R in Xcode)
  • Simply open the app in simulator

Step 5

  • Flutter will sync files 😍

In your debug console you will see a server address, have it copied ✅

Step 5

  • That’s it now once you have seen the dialog, you are now ready to debug.
  • Just click on the Hot-restart to initiate a debug session

Network Debugging

Two ways to do debug network calls from your flutter application

  1. Using built in Dev tools network page in your IDE (VSCode)
  2. Using Google chrome network page

1. Using built in Dev tools network page in your IDE (VSCode)

Press

CMD + Shift + P

Choose

That’s it

2. Using Google chrome network page

  • Running below command will will start dev tools in Chrome web browser
pub global run devtools
  • Open chrome and paste the address that you copied in Step 4 on to the Connect to a running app text field and press connect

That’s it you can now debug your flutter application - network, performance, widgets and so many other aspects of your flutter app 🚀

Free

Distraction-free reading. No ads.

Organize your knowledge with lists and highlights.

Tell your story. Find your audience.

Membership

Read member-only stories

Support writers you read most

Earn money for your writing

Listen to audio narrations

Read offline with the Medium app

Responses (2)

Write a response

Great article @Rathish

Nice work.
One suggestion, after step 3 I realized that we need to re-run the app in order for the flutter process to be attached.
Adding this step might save some time :)