@@ -33,18 +33,6 @@ You can do this online, and it only takes a minute.
3333
34342 . Review the [ DevTools style guide] ( STYLE.md ) , which uses a combination of Dart and Flutter best practices.
3535
36- ## Table of contents
37- 1 . [ Developing for DevTools] ( #developing-for-devtools )
38- - [Set up your DevTools environment](#set-up-your-devtools-environment)
39- - [Workflow for making changes](#workflow-for-making-changes)
40- - [Keeping your fork in sync](#keeping-your-fork-in-sync)
41- 2 . [ Running and debugging DevTools] ( #running-and-debugging-devtools )
42- - [ Frontend only (most common)] ( #frontend-only-most-common )
43- - [ Frontend + DevTools server] ( #frontend--devtools-server )
44- - [ DevTools + VS Code integration] ( #devtools--vs-code-integration-ide-embedded-devtools-experience )
45- 3 . [ Testing for DevTools] ( #testing-for-devtools )
46- 4 . [ Appendix] ( #appendix )
47-
4836## Developing for DevTools
4937
5038### Set up your DevTools environment
@@ -100,9 +88,9 @@ of launch configurations for running and debugging DevTools:
10088
10189### Workflow for making changes
10290
103- 1 . Change your local Flutter SDK to the latest flutter candidate branch :
91+ 1 . Ensure your local Flutter SDK, DevTools dependencies, and generated code are up-to-date :
10492 ```sh
105- dt update-flutter-sdk --update-on-path
93+ dt sync --update-on-path
10694 ```
10795 > Warning: this will delete any local changes in your Flutter SDK you checked out from git.
10896
@@ -111,23 +99,18 @@ of launch configurations for running and debugging DevTools:
11199 git checkout -b myBranch
112100 ```
113101
114- 3 . Ensure your branch, dependencies, and generated code are up-to-date:
115- ```sh
116- dt sync
117- ```
118-
119- 4 . Implement your changes, and commit to your branch:
102+ 3 . Implement your changes, and commit to your branch:
120103 ```sh
121104 git commit -m “description”
122105 ```
123106 If your improvement is user-facing, [document it](packages/devtools_app/release_notes/README.md) in the same PR.
124107
125- 5 . Push to your branch to GitHub:
108+ 4 . Push to your branch to GitHub:
126109 ```sh
127110 git push origin myBranch
128111 ```
129112
130- 6 . Navigate to the [ Pull Requests] ( https://github.com/flutter/devtools/pulls ) tab in the main
113+ 5 . Navigate to the [ Pull Requests] ( https://github.com/flutter/devtools/pulls ) tab in the main
131114[ DevTools repo] ( https://github.com/flutter/devtools ) . You should see a popup to create a pull
132115request from the branch in your cloned repo to the DevTools ` master ` branch. Create a pull request.
133116
@@ -137,9 +120,18 @@ request from the branch in your cloned repo to the DevTools `master` branch. Cre
137120 ```
138121 dt sync
139122 ```
140- This will pull the latest code from the upstream DevTools, upgrade dependencies, and perform code generation.
141-
142- - If you want to upgrade dependencies and re-generate code (like mocks), but do not want to merge ` upstream/master ` , instead run
123+ This command will:
124+ - pull the latest code from the upstream DevTools master branch
125+ - update `tool/flutter-sdk` to the Flutter version DevTools is built and tested
126+ with on the CI
127+ - upgrade dependencies
128+ - perform code generation
129+
130+ Optionally, pass the `--update-on-path` flag to also update your local Flutter SDK
131+ git checkout along with the `tool/flutter-sdk`.
132+
133+ - If you want to upgrade dependencies and re-generate code (like mocks), but do
134+ not want to merge ` upstream/master ` or update your Flutter SDK version, instead run
143135 ```
144136 dt generate-code --upgrade
145137 ```
@@ -160,133 +152,14 @@ request from the branch in your cloned repo to the DevTools `master` branch. Cre
160152
161153## Running and debugging DevTools
162154
163- There are a few different environments that you may need to run DevTools in. After running DevTools
164- in one of the environments below, connect to a test application to debug DevTools runtime tooling
165- (the majority of DevTools tools). See the
166- [ Connect DevTools to a test application] ( #connect-devtools-to-a-test-application ) section below.
167-
168- ### Frontend only (most common)
169-
170- Most of the time, you will not need to run DevTools with the DevTools server to test your changes.
171- You can run DevTools in debug mode as either a Flutter web or Flutter desktop app.
172-
173- > Note: though DevTools is shipped as a Flutter Web app, we recommend developing as a Flutter
174- Desktop app whenever possible for a more efficient development workflow. Please see the
175- [ running on Flutter desktop] ( #running-devtools-on-flutter-desktop ) section below for instructions.
176-
177- - To run DevTools as a Flutter web app ** from VS Code** , run with the ** devtools** configuration and the "Chrome" device
178- - To run with experiments enabled, run from VS Code with the **devtools + experiments** configuration
179- - To run DevTools as a Flutter web app ** from the command line** , run ` flutter run -d chrome `
180- - To run with experiments enabled, add the flag `--dart-define=enable_experiments=true`
181-
182- ### Frontend + DevTools server
183-
184- To develop with a workflow that exercises the DevTools server <==> DevTools client connection,
185- you will need to perform the following set up steps (first time only).
186-
187- 1 . Clone the [ Dart SDK] ( https://github.com/dart-lang/sdk ) fron GitHub.
188- 2 . The ` LOCAL_DART_SDK ` environment variable needs to point to this path: ` export LOCAL_DART_SDK=/path/to/dart/sdk `
189-
190- If you are also developing server side code (e.g. the ` devtools_shared ` package), you will need to add a
191- dependency override to ` sdk/pkg/dds/pubspec.yaml ` .
192-
193- ``` yaml
194- dependency_overrides :
195- devtools_shared :
196- path : relative/path/to/devtools/packages/devtools_shared
197- ` ` `
198-
199- Then you can run DevTools with the server by running the following from anywhere under the ` devtools/` directory:
200- 1. To run the DevTools web app in release mode, served with the DevTools server (this emulates the production environment) :
201- ` ` `
202- dt serve
203- ` ` `
204- 2. To run the DevTools web app in debug mode, with full debugging support, and with a connection to a live DevTools server :
205- ` ` ` sh
206- dt run
207- ` ` `
208-
209- Option 2 is useful for a quicker development cycle. The DevTools build time will be faster, and you will be
210- able to connect the DevTools web app to an IDE or another DevTools instance for debugging purposes.
211-
212- To see the full list of arguments available for either command, please pass the `-h` flag.
213-
214- # ## IDE-embedded DevTools experience
215-
216- # ### DevTools + VS Code integration
217-
218- To test the integration with VS Code, you can set up the Dart VS Code extension to run DevTools
219- and the server from your local source code. Follow the
220- [Frontend + DevTools server](#frontend--devtools-server) setup instructions above, and make sure
221- you have version v3.47 or newer of the Dart extension for VS Code.
222-
223- Open your VS Code settings (Run the **Preferences : Open User Settings (JSON)** command from the
224- command palette (`F1`)) and add the following to your settings :
225-
226- ` ` ` js
227- "dart.customDevTools": {
228- "path": "/absolute/path/to/devtools",
229- "env": {
230- "LOCAL_DART_SDK": "/absolute/path/to/sdk"
231- // Path to the Flutter SDK that will be used to build DevTools. This may
232- // be the path to the included Flutter SDK under the tool/ directory or
233- // the path to your local Flutter SDK git checkout.
234- "FLUTTER_ROOT": "/absolute/path/to/devtools/tool/flutter-sdk"
235- },
236- "args": [
237- // Arguments that will be passed along to the ` dt serve` command.
238- ],
239- },
240- ```
241-
242- This instructs VS Code to run the ` dt serve ` command instead of running ` dart devtools ` .
243- You must set the ` LOCAL_DART_SDK ` and ` FLUTTER_ROOT ` env variables correctly for the script to work.
244-
245- Next, restart VS Code (or run the ** Developer: Reload Window** command from the command palette (` F1 ` ))
246- and DevTools will be run from your local source code. After making any code changes to DevTools or the
247- server, you will need to re-run the ** Developer: Reload Window** command to rebuild and restart the server.
248-
249- #### DevTools + IntelliJ integration
250-
251- Follow instructions in the Flutter-IntelliJ repo's ` CONTRIBUTING ` guide: [ #developing-with-local-devtools] ( https://github.com/flutter/flutter-intellij/blob/master/CONTRIBUTING.md#developing-with-local-devtools )
155+ Please see [ DEBUGGING.md] ( ) for guidance on running and debugging DevTools.
252156
253157## Testing for DevTools
254158
255- Please see [ TESTING.md] ( TESTING.md ) for guidance on running and writing tests.
159+ Please see [ TESTING.md] ( ) for guidance on running and writing tests.
256160
257161## Appendix
258162
259- ### Connect DevTools to a test application
260-
261- For working on most DevTools tools, a connection to a running Dart or Flutter app is required. Run any Dart or Flutter app of your choice to
262- connect it to DevTools. Consider running [ veggieseasons] ( https://github.com/flutter/samples/tree/main/veggieseasons ) or another Flutter sample since those apps have plenty of interesting
263- code to debug.
264- 1 . Run your Dart or Flutter app.
265- > Note: some DevTools features may be unavailable depending on the test app platform (Flutter native, Flutter web, Dart CLI, etc.) or run mode
266- (debug, profile) you choose.
267- 2 . Copy the URI printed to the command line (you will use this URI to connect to DevTools).
268-
269- ```
270- "A Dart VM Service on iPhone 14 Pro Max is available at: <copy-this-uri>"
271- ```
272- 3 . Paste this URI into the connect dialog in DevTools and click "Connect".
273-
274- 
275-
276- ### Running DevTools on Flutter Desktop
277-
278- For a faster development cycle with hot reload, you can run DevTools on Flutter desktop. Some DevTools
279- features only work on the web, like the embedded Perfetto trace viewer, DevTools extensions, or WASM support,
280- but the limitations on the desktop app are few.
281-
282- To run DevTools with the desktop embedder, you can run ` flutter run -d macos ` from ` devtools/packages/devtools_app ` ,
283- or you can run DevTools from your IDE with the ` macOS ` device selected.
284-
285- If this fails, you may need to run ` flutter create . ` from ` devtools/packages/devtools_app ` to generate
286- the updated files for your platform. If you want to run DevTools on Flutter desktop for Windows or Linux,
287- you will need to generate the files for this platform using the ` flutter create . ` command, and then run using
288- ` flutter run -d <windows or linux> ` .
289-
290163### Enable and activate DCM (Dart Code Metrics)
291164
292165Enabling and activating DCM is optional. When you open a PR, the CI bots will show you any DCM warnings introduced
0 commit comments