Skip to content

Commit 6b5dba9

Browse files
bmeurerDevtools-frontend LUCI CQ
authored and
Devtools-frontend LUCI CQ
committed
[npm] Add initial npm start script.
This adds an initial version of the `npm start` script, which builds the DevTools front-end and launches either CfT or Chrome Canary binary with the custom DevTools front-end, passing appropriate flags to enable or disable certain experimental features. Bug: 404192426 Change-Id: Ia7bcbf8cb5f93bcf455e59964a488480e8ec1fff Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6367034 Commit-Queue: Benedikt Meurer <[email protected]> Reviewed-by: Yang Guo <[email protected]> Auto-Submit: Benedikt Meurer <[email protected]>
1 parent 95ba1d9 commit 6b5dba9

File tree

4 files changed

+195
-1
lines changed

4 files changed

+195
-1
lines changed

docs/get_the_code.md

+39
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,45 @@ You can run a [build](#Build) of DevTools frontend in a pre-built Chrome or Chro
7575
- Use the downloaded Chrome for Testing binary in `third_party/chrome`.
7676
- Use the latest Chrome Canary. This includes any DevTools features that are only available in regular Chrome builds (`is_official_build` + `is_chrome_branded`), such as GenAI-related features.
7777

78+
#### Using `npm start` script (recommended)
79+
80+
With Chromium 136, we added (back) a `start` script that can be used to easily launch DevTools with pre-built [Chrome
81+
for Testing](https://developer.chrome.com/blog/chrome-for-testing) or [Chrome Canary](https://www.google.com/chrome/canary/).
82+
It'll also take care of automatically enabling/disabling experimental features that are actively being worked on. Use
83+
84+
```bash
85+
npm start
86+
```
87+
88+
to build DevTools front-end in `out/Default` (you can change this to `out/foo` by passing `--target=foo` if needed),
89+
and open Chrome for Testing (in `third_party/chrome`) with the custom DevTools front-end. It'll automatically open
90+
DevTools for every new tab, you can use
91+
92+
```bash
93+
npm start -- --no-auto-open-devtools-for-tabs
94+
```
95+
96+
to disable this behavior. You can also use
97+
98+
```bash
99+
npm start -- --canary
100+
```
101+
102+
to run in Chrome Canary instead of Chrome for Testing; this requires you to install Chrome Canary manually first
103+
(Googlers can install `google-chrome-canary` on gLinux). You can use
104+
105+
```bash
106+
npm start -- --enable-feature=MediaRouter --disable-feature=DevToolsWellKnown
107+
```
108+
109+
to enable/disable features as needed; the command line flags take precedence over the defaults. And finally use
110+
111+
```bash
112+
npm start -- http://www.example.com
113+
```
114+
115+
to automatically open `http://www.example.com` in the newly spawned Chrome tab.
116+
78117
#### Running from file system
79118

80119
This works with Chromium 79 or later.

package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@
3030
"lint": "vpython3 third_party/node/node.py --output scripts/test/run_lint_check.mjs",
3131
"prebuild": "gn gen out/Default",
3232
"rdb": "rdb stream -new -realm chrome:public --",
33-
"start": "node -e 'console.log(`This script has been removed in favor of --custom-devtools-frontend. For more information, see https://docs.google.com/document/d/1COgCBWWuTh2o-Zbp6h_z0h0LtlJaimaEDsION4RZPxc/edit?usp=sharing`);'",
33+
"start": "vpython3 scripts/run_start.py",
3434
"webtest": "vpython3 third_party/node/node.py --output scripts/npm_test.js",
3535
"webtest-local": "vpython3 third_party/node/node.py --output scripts/npm_test.js --layout-tests-directory=test/webtests/",
3636
"ts_library-test": "./third_party/typescript/tests/verify_ts_libary.sh",

scripts/devtools_paths.py

+9
Original file line numberDiff line numberDiff line change
@@ -80,6 +80,11 @@ def esbuild_path():
8080
return path.join(devtools_root_path(), 'third_party', 'esbuild', 'esbuild')
8181

8282

83+
def autoninja_path():
84+
return path.join(devtools_root_path(), 'third_party', 'depot_tools',
85+
'autoninja')
86+
87+
8388
def downloaded_chrome_binary_path():
8489
return path.abspath(
8590
path.join(
@@ -121,3 +126,7 @@ def package_json_path():
121126
def browser_protocol_path():
122127
return path.join(third_party_path(), 'blink', 'public',
123128
'devtools_protocol', 'browser_protocol.pdl')
129+
130+
131+
def custom_devtools_frontend_path(target):
132+
return path.join(root_path(), 'out', target, 'gen', 'front_end')

scripts/run_start.py

+146
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,146 @@
1+
#!/usr/bin/env vpython3
2+
# Copyright 2019 The Chromium Authors. All rights reserved.
3+
# Use of this source code is governed by a BSD-style license that can be
4+
# found in the LICENSE file.
5+
"""
6+
Start local DevTools front-end in Chrome.
7+
"""
8+
9+
from os import path
10+
import argparse
11+
import devtools_paths
12+
import logging
13+
import platform
14+
import subprocess
15+
import sys
16+
17+
logger = logging.getLogger(__name__)
18+
19+
# The list of features that are enabled by default.
20+
# These can be overridden with --disable-feature=FOO on the commandline
21+
# if necessary.
22+
ENABLE_FEATURES = [
23+
'DevToolsAutomaticFileSystems',
24+
'DevToolsFreeStyler:patching/true,user_tier/TESTERS',
25+
'DevToolsWellKnown',
26+
]
27+
28+
# The list of features that are disabled by default.
29+
# These can be overridden with --enable-feature=FOO on the commandline
30+
# if necessary.
31+
DISABLE_FEATURES = ['MediaRouter'] if platform.system() == 'Darwin' else []
32+
33+
34+
def parse_options(args):
35+
parser = argparse.ArgumentParser(
36+
description='Run local DevTools front-end')
37+
parser.add_argument(
38+
'--browser',
39+
choices=['cft', 'canary'],
40+
default='cft',
41+
help=
42+
'launch in the specified browser, can be either "cft" (the default) or "canary"'
43+
)
44+
parser.add_argument('--canary',
45+
action='store_const',
46+
const='canary',
47+
dest='browser',
48+
help='launch in Chrome Canary')
49+
parser.add_argument('--enable-features',
50+
action='append',
51+
default=[],
52+
help='enable experimental Chrome features')
53+
parser.add_argument('--disable-features',
54+
action='append',
55+
default=[],
56+
help='disable experimental Chrome features')
57+
parser.add_argument('--no-auto-open-devtools-for-tabs',
58+
action='store_true',
59+
help='don\'t automatically open DevTools for new tabs')
60+
parser.add_argument(
61+
'-t',
62+
'--target',
63+
default='Default',
64+
help=
65+
'specify the target build subdirectory under //out (defaults to "Default")'
66+
)
67+
parser.add_argument('--verbose',
68+
action='store_true',
69+
help='enable verbose logging')
70+
parser.add_argument('URL',
71+
nargs='*',
72+
help='specify URL(s) to open by default')
73+
return parser.parse_args(args)
74+
75+
76+
def build(options):
77+
"""
78+
Build the DevTools front-end in the target identified by the `options`.
79+
"""
80+
cwd = devtools_paths.root_path()
81+
outdir = path.join('out', options.target)
82+
autoninja = devtools_paths.autoninja_path()
83+
subprocess.check_call([autoninja, '-C', outdir], cwd=cwd)
84+
85+
86+
def find_browser_binary(options):
87+
"""
88+
Locate the correct browser binary (per `options`).
89+
"""
90+
if options.browser == 'canary':
91+
binary = path.abspath(
92+
path.join(
93+
*{
94+
'Linux': ('/usr', 'bin', 'google-chrome-canary'),
95+
'Darwin': ('/Applications', 'Google Chrome Canary.app',
96+
'Contents', 'MacOS', 'Google Chrome Canary'),
97+
}[platform.system()]))
98+
logger.debug('Located Chrome Canary binary in %s.', binary)
99+
return binary
100+
else:
101+
binary = devtools_paths.downloaded_chrome_binary_path()
102+
logger.debug('Located Chrome for Testing binary in %s.', binary)
103+
return binary
104+
105+
106+
def start(options):
107+
"""
108+
Launch Chrome with our custom DevTools front-end.
109+
"""
110+
cwd = devtools_paths.root_path()
111+
args = [find_browser_binary(options)]
112+
113+
# Custom flags for CfT.
114+
if options.browser == 'cft':
115+
args += ['--disable-infobars'] # Disable the CfT warning infobar.
116+
args += ['--use-mock-keychain'
117+
] if platform.system() == 'Darwin' else []
118+
119+
# Disable/Enable experimental features, starting with defaults.
120+
args += ['--disable-features=%s' % f for f in DISABLE_FEATURES]
121+
args += ['--enable-features=%s' % f for f in ENABLE_FEATURES]
122+
args += ['--disable-features=%s' % f for f in options.disable_features]
123+
args += ['--enable-features=%s' % f for f in options.enable_features]
124+
125+
# Open with our freshly built DevTools front-end.
126+
args += [
127+
'--custom-devtools-frontend=file://%s' %
128+
devtools_paths.custom_devtools_frontend_path(options.target)
129+
]
130+
131+
# Chrome flags and URLs.
132+
if not options.no_auto_open_devtools_for_tabs:
133+
args += ['--auto-open-devtools-for-tabs']
134+
args += options.URL
135+
136+
# Launch Chrome.
137+
logger.debug('Launch Chrome: %s', ' '.join(args))
138+
subprocess.check_call(args, cwd=cwd)
139+
140+
141+
if __name__ == '__main__':
142+
OPTIONS = parse_options(sys.argv[1:])
143+
logging.basicConfig(
144+
level=logging.DEBUG if OPTIONS.verbose else logging.INFO)
145+
build(OPTIONS)
146+
start(OPTIONS)

0 commit comments

Comments
 (0)