Chromium DevTools docs

goo.gle/chromium-devtools

This directory contains Chrome DevTools project documentation in Gitiles-flavored Markdown. It is automatically rendered by Gitiles.

If you add new documents, please also add a link to them in the Document Index below.

[TOC]

Work With Us

• See the playbook for step-by-step instructions on how to work with Chromium DevTools to implement your idea.
• See the Ecosystem Guide if you are working on Web development tools and services, and would like to learn more about integration and extension points with Chromium DevTools.

Document Index

Design Documents

• See the shared Design Documents folder in the Chromium drive.

General Development

• Get the Code
• Contribution Guide
• UX Style Guide
• Testing Guide
• Cookbook
• Visual logging in DevTools
• Style Guides

Architectural Documentation

• Architecture of DevTools
• Chrome DevTools Protocol (CDP)
• Resource management in DevTools
• UI Engineering

Chromium

• Chromium Docs
• V8 Documention

Checklists

• DevTools UI feature checklist
• DevTools support checklist for Blink Intents
• DevTools support checklist for JavaScript features
• DevTools support checklist for WebAssembly features

Policies

• Chromium DevTools Slow-Close Policy
• DevTools Page Zoom Accessibility Policy

Useful Commands

git cl format --js

Formats all code using clang-format.

npm run check

Runs all static analysis checks on DevTools code.

Creating Documentation

Guidelines

• See the Chromium Documentation Guidelines and the Chromium Documentation Best Practices.
• Markdown documents must follow the Markdown style guide.

Previewing changes

Locally using md_browser

Assuming that /path/to/src contains a chromium checkout, you can run:

# in devtools-frontend checkout
/path/to/src/tools/md_browser/md_browser.py --directory $PWD

and preview the result by opening http://localhost:8080/docs/README.md in your browser. This is only an estimate. The gitiles view may differ.

Online with Gerrit's links to gitiles

1. Upload a patch to gerrit, or receive a review request. e.g. https://chromium-review.googlesource.com/c/3362532
2. View a specific .md file. e.g. https://chromium-review.googlesource.com/c/3362532/2/docs/README.md
3. You will see something like
   
   at the top left of the page. Click on the second "preview" link to open the preview for the current patch set.

This gitiles view is the authoritative view, exactly the same as will be used when committed.