gregtatum

Understanding how DevTools multiprocess architecture works.

 ________________________________________________________________________________________
|                                   Parent process                                       |
|----------------------------------------------------------------------------------------|
|                                                                                        |
|  DevTools Toolbox (there can be multiple instances)                                    |
|                                                                                        |
|   - DevTools client code and panels (devtools/client)                                  |

juliandescottes

╔═════════════════════════════════════════════════════════════════════════════════╗
║ How to load/import a file in Firefox Devtools ?                                 ║
╚═════════════════════════════════════════════════════════════════════════════════╝
                                                                                   
 ╔════════════════════════╗                                                        
 ║   SYNC FILE LOADING    ║                                                        
 ╚════════════════════════╝                                                        
                                                                                   
                                                                                   
 ┌ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─         ┌───────────────────────────────┐               

bgrins

# Start a normal instance with the debugger server running
./mach run --start-debugger-server 6080

# Run the Browser Toolbox instance
MOZ_BROWSER_TOOLBOX_PORT=6080 ./mach run --temp-profile -chrome chrome://devtools/content/framework/browser-toolbox/window.html --purgecaches --jsconsole

paulirish

Screencapture and animated gifs

I say "animated gif" but in reality I think it's irresponsible to be serving "real" GIF files to people now. You should be serving gfy's, gifv's, webm, mp4s, whatever. They're a fraction of the filesize making it easier for you to deliver high fidelity, full color animation very quickly, especially on bad mobile connections. (But I suppose if you're just doing this for small audiences (like bug reporting), then LICEcap is a good solution).

Capturing (Easy)

1. Launch quicktime player
2. do Screen recording

paulrouget

More details here: https://developer.mozilla.org/en/docs/Simple_Firefox_build

Hacking Firefox

Get Firefox' source code:

git clone https://github.com/mozilla/gecko-dev.git
git checkout fx-team

Install dependencies:

dypsilon

Frontend Development

Attention: the list was moved to

https://github.com/dypsilon/frontend-dev-bookmarks

This page is not maintained anymore, please update your bookmarks.

---

campd

Writing an Actor

A Simple Hello World

Here's a simple Hello World actor. It is a global actor (not associated with a given browser tab).

let protocol = require("devtools/server/protocol");

let {method, Arg, Option, RetVal} = protocol;