mirror of
https://github.com/react/react-native-devtools-frontend.git
synced 2026-10-01 01:38:07 +08:00
Jack Franklin
30c4a71de5
The ColorSwatch.ts component uses the `Common.Color.Color` interface. The bridges generator does not support deeply nested interfaces. So this CL adds special casing for interfaces that we know we might have to deal with from "legacy land" and makes sure they still get outputted correctly. Currently we only allow nested interfaces that start with `Common.`, because I'd like to avoid their use in the new world if possible, but we can easily expand this if required. Once I got the type being compiled correctly, I then realised that we also needed to add the imports into the outputted file, so the code now checks for usage of Common, finds the matching import, and pulls it over. Finally, I had to update ColorSwatch.ts. It used public properties, which the bridge generator doesn't support, so I swapped it to private properties with getters. I don't love this change, but I think that's better rather than invest more time in the (temporary) bridge generator code. Note: this bug made it in because there's a bug in the bridges PRESUBMIT that means if it errors it doesn't fail the PRESUBMIT. I have another CL incoming to fix that, but I need to fix the actual component first so that when I fix the PRESUBMIT I don't just block CQ for everyone! Change-Id: I7376b0b7bee78bfe9d106fad6e2233a2b04fcf42 Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2502042 Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org> Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
DevTools Scripts
Development workflow scripts
These are scripts that can be useful to run independently as you're working on Chrome DevTools front-end.
The newer scripts such as for testing and hosted mode are written in Node.js, which has become the standard toolchain for web apps. The older scripts such as building (e.g. bundling and minifying) are written in Python, which has first-class support in Chromium's infrastructure.
Overview
Folders
- build - Python package for generating DevTools debug and release mode
- chrome_debug_launcher - automagically finds Chrome Canary and launches it with debugging flags (e.g. remote debugging port)
- closure - see section on Closure Compiler below
- gulp - experimental build process written in node.js & gulp to remove the dependency on Chromium-specific build tools (i.e. gn and ninja)
- hosted_mode - run DevTools on a localhost development server
- jsdoc_validator - enforces the use of Closure type annotations
Python Scripts
- compile_frontend.py - runs closure compiler to do static type analysis
- Note: the compiled outputs are not actually used to run DevTools
- lint_javascript.py - run eslint
- optimize_svg_images.py - manually run when changing svg images
Node.js scripts
The easiest way to run the node.js scripts is to use npm run which displays all the commands. For more information on the specific npm run commands, take a look at the primary devtools front-end readme (../readme.md).
Closure
DevTools manually rolls the closure compiler to ./closure. If you manually roll closure compiler, you will need to re-generate the closure_runner (in ./closure) and jsdoc_validator custom jars using the python scripts in their respective directory.