Firefox DevTools Contributor Docs

Overview

Firefox DevTools Contributor Docs is the technical documentation for developers who want to contribute to Firefox's built-in developer tools. It covers everything from setting up a development environment to writing automated tests and understanding tool architecture.

This documentation is for engineers contributing to Firefox DevTools itself, not for users of the tools. It sits alongside the broader Firefox contributor documentation and provides DevTools-specific technical guidance on testing, performance, architecture, and code quality.

Key Benefits

• Provides step-by-step guidance for setting up a Firefox development environment and submitting patches.
• Documents multiple automated test frameworks including xpcshell, Chrome mochitests, DevTools mochitests, Node tests, and allocation tests.
• Includes DAMP (DevTools Automated Memory/ePerformance) performance test documentation for writing and running performance tests.
• Covers tool architecture for the Inspector, Console, Network, Storage, Memory, Debugger, Responsive Design Mode, and CSS Panel.
• Offers guidance on React and Redux usage within the DevTools frontend codebase.
• Documents the Remote Debugging Protocol and actor-based backend architecture.

How It Works

Contributors first set up a Firefox development environment following the general Firefox contributor setup guide. They then navigate the DevTools-specific documentation to understand tool architecture, write automated tests using frameworks like xpcshell or mochitests, and submit patches through the standard Firefox contribution workflow.

Use Cases

• New Firefox contributors who need to set up their development environment and learn the DevTools codebase structure.
• Experienced Mozilla engineers writing automated tests for DevTools features using xpcshell, mochitests, or Node test frameworks.
• Performance engineers running and authoring DAMP performance tests to track DevTools memory and speed regressions.
• Frontend developers working on the DevTools UI who need React and Redux coding guidelines specific to the project.
• Backend engineers implementing or modifying Remote Debugging Protocol actors for Firefox DevTools.
• Release managers and sheriffs performing recurring release tasks and performance monitoring for DevTools.

Why Choose This Product

This documentation is the official, authoritative source for contributing to Firefox DevTools. It is best suited for developers already working within or joining the Mozilla ecosystem who need technical guidance specific to Firefox's developer tools, not general web development.