Skip to content

Instantly share code, notes, and snippets.

Last active May 17, 2024 00:09
Show Gist options
  • Save paulirish/2d84a6db1b41b4020685 to your computer and use it in GitHub Desktop.
Save paulirish/2d84a6db1b41b4020685 to your computer and use it in GitHub Desktop.
How to build Chromium to hack on DevTools

A Chromium Compiling Setup for DevTools Hackers

Devtools hacking


The dtb and dtcr commmands here are nice.


Please read this doc: Chrome DevTools Contribution Guide

Chromium hacking

  1. Set the as your gn build configuration
    • Probably best to run gn args out/Default and copy/paste what you want to use, then save.
  2. source
  3. git pull && depsbcr

That's it. You can also run the various components of the bash script seperately and together.

  • deps: run gclient sync to synchronize all the "submodule" dependencies
  • hooks run gclient hooks, which is otherwise automaticaly run after deps.
  • gom: initialize goma
  • b: build/compile chrome
  • cr: run the built chrome binary

I often do this sequence: git pull && deps && bcr followed by hacking followed by bcr, bcr, bcr.

Useful setup guides:



# Build arguments for the gn build
# You can set these with `gn args out/Default`
# ( and they're stored in src/out/Default/ )
# See "gn args out/Default --list" for available build arguments
# component build, because people love it
is_component_build = true
# release build, because its faster
is_debug = true
# native client? no thx. (still needed in march 2023.)
# also put this in .gclient:
# "custom_vars": {
# 'checkout_nacl': False,
# },
enable_nacl = false
# no symbols (this is probably redundant for release anyway)
#symbol_level = 0
# This is default for Release builds, but forced regardless
# dcheck_always_on = false
# goma only if you're a googler
use_goma = true
# usage:
# after `git pull`, a full build is now `depsbcr` or `deps && b && cr`
# and after changes.. a `bcr` will recompile and relaunch chrome.
# 2021 update: __dt versions of these functions are added for the chromium-devtools repo.
function deps () {
# --reset drops local changes. often great, but if making changes inside v8, you don't want to use --reset
# also reset seems to reset branch position in the devtools-internal repo??? weird.
gclient sync --delete_unversioned_trees --jobs=70
function hooks () {
gclient runhooks
function b () {
local dir=./$(git rev-parse --show-cdup)/out/Default
# autoninja will automatically determine your -j number based on CPU cores
local cmd="autoninja -C $(realpath $dir) chrome"
echo " > $cmd"
# start the compile
eval $cmd
if [ $? -eq 0 ]; then
osascript -e 'display notification "" with title "✅ Chromium compile done"'
osascript -e 'display notification "" with title "❌ Chromium compile failed"'
function dtb () {
local dir_default=$(realpath $PWD/$(git rev-parse --show-cdup)out/Default/)
local cmd="autoninja -C $dir_default"
echo " > $cmd"
eval $cmd
# # Avoid the blocking startup dialog for 'Chromium wants to use your confidential information stored in "Chromium Safe Storage" in your keychain'
# # Avoid the startup dialog for 'Do you want the application “” to accept incoming network connections?'
clutch_chrome_flags="--use-mock-keychain --disable-features=DialMediaRouteProvider"
# you can also add any extra args: `cr --user-data-dir=/tmp/lol123"
# (disable DialMediaRouteProvider gets rid of that "do you want to accept incoming connections" prompt)
function cr () {
local dir="./$(git rev-parse --show-cdup)/out/Default"
local cmd="./$dir/ $clutch_chrome_flags $argv"
echo " > $cmd"
eval "$cmd"
function dtcr () {
local crpath="./$(git rev-parse --show-cdup)/third_party/chrome/chrome-mac/"
local dtpath=$(realpath out/Default/gen/front_end)
local cmd="$crpath --custom-devtools-frontend=file://$dtpath --user-data-dir=$HOME/chromium-devtools/dt-chrome-profile $clutch_chrome_flags $argv"
echo " > $cmd"
eval "$cmd"
function gom () {
# these probably dont make sense for everyone.
export GOMAMAILTO=/dev/null
goma_ctl ensure_start
function dtbcr () {
if dtb; then
function bcr () {
if b; then
function depsb () {
if deps; then
function depsbcr () {
if deps; then
function hooksbcr () {
if hooks; then
Copy link

Note that having chromium source code locally is not enough to run this script. You need all dependencies, see:

Copy link

@paulirish Could you update this gist to use the new build system (GN) instead? I was able to follow instructions here and use this mapping between GN and GYP flags.

Copy link

@athyuttamre somewhere in the last two years i updated these for GN. just stating it for the record. :)

Copy link

I updated this gist again. Porting over my more minimal functions for compiling chrome.

Copy link

The debug_devtools GN arg should now be removed, as it is replaced by the --custom-devtools-frontend runtime flag.

Copy link

The debug_devtools GN arg should now be removed, as it is replaced by the --custom-devtools-frontend runtime flag.

Hah, just came to say the same thing.

this gist is a critical document

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment