Setting up for Android and Firefox OS Development

This post is a follow-up to an earlier article I wrote about setting up a FirefoxOS development environment.

I’m going to set up a Sony Z3C as the target device for Mobile OS software development. The Sony Z3C (also known as Aries or aosp_d5803 ) is a nice device for Mobile OS hacking as it’s an AOSP device with good support for building the OS binaries. I’ve set the phone up for both FirefoxOS and Android OS development, to compare and see what’s common across both environments.

Please note that if you got your Sony Z3C from the Mozilla Foxfooding program, then this article isn’t for you. Those phones are already flashed and automatically updated with specific FirefoxOS builds that Mozilla staff selected for your testing. Please don’t replace those builds unless you’re actively developing for these phones and have a device set aside for that purpose.

My development host is a Mac (OSX 10.10) laptop already set up to build the Firefox for Macintosh product. It’s also set up to build the Firefox OS binaries for the Flame device.

Most of the development environment for the Flame is also used for the Aries device. In particular, the case-sensitive disk partition is required for both FirefoxOS and Android OS development. You’ll want this partition to be at least 100GB in size if you want to build both operating systems. Set this up before downloading FirefoxOS or Android souce code to avoid ‘include file not found’ errors.

The next step to developing OS code for the Aries is to root the device. This will void your warranty, so tread carefully.

For most Gecko and Gaia developers, you’ll want to start from the base image for the Aries. The easiest way to flash your device with a known-good FirefoxOS build is to run in the expanded file from the official builds. You can then flash the phone with just Gecko or Gaia from your local source code.

The Aries binaries from a FirefoxOS build:


The Aries binaries in an Android Lollipop build:


If you want to build Android OS for the Aries, then read these docs from Sony, and these Mac-specific steps for building Android Lollipop. Note that the Android Lollipop SDK requires XCode 5.1.1 and Java 7 (JRE and JDK.) Both versions of XCode and Java are older than the latest versions available, so you’ll need to install the downgrades before building the Android OS.

When it comes time to configure your Android OS build via the lunch command, select aosp_d5803-userdebug as your device. Once the build is finished (after about 2 hours on my Mac,) use these commands to flash your phone with the Android OS you just built:

fastboot flash boot out/target/product/aries/boot.img
fastboot flash system out/target/product/aries/system.img
fastboot flash userdata out/target/product/aries/userdata.img

Firefox Platform Rendering – Current Work

I’m often asked “what are you working on?” Here’s a snapshot of some of the things currently on my teams’ front burners:

I’m surely forgetting a few things, but that’s a quick snapshot for now. Do you have suggestions for what Platform Rendering features we should pick up next? Add your comments below…

FirefoxOS Dev Quick Start

B2G_dev_envI’m posting the steps I took to create the FirefoxOS dev environment for the Flame device. We use the Flame as our reference device on the Platform Rendering team. I had to re-do this recently on a new computer and I figure this might help others in the same boat. These steps assume you can already build the desktop version of Firefox on your computer.

  1. Get ADB
  2. Turn on ADB debugging on your device.
  3. Download the latest base image ( at the time of this writing.)
  4. Unzip the base image archive and run the script to update your phone to the latest base image. You’ll need to re-enable ADB debugging after this step.
  5. Clone the B2G repository and follow the prerequisite steps for local builds.
    Note: the device we target for the step is flame-kk (not the older flame device.)
  6. Get a coffee and wait for the long source download.
  7. Run ./ in the B2G source directory to build.
  8. Run ./ in the B2G source directory to put your new build on to your phone.

Mozilla Platform Rendering in Asia

I’ve spent the last 3 weeks traveling in Asia for Mozilla and W3C business. On May 20 to 24, my team was in Taiwan for a series of meetings on Platform Rendering (Layout, Graphics, and Media.) It’s always an enlightening experience for me when I spend time with such a talented group of people:

The Mozilla Firefox Platform Rendering Team on location in Taiwan.

Going to Taiwan was a very special event. The local Taiwan office was awesome, and the local staff was very wonderful, taking great care of us while we were there. Beautiful and fast rendering requires a deep understanding of the underlying hardware, and if you’re serious about hardware, you eventually have to go to Taiwan. Meeting and working with the local Taiwan team was great. They’re so smart, and eager to learn about the Firefox Platform. We spent a lot of time getting them caught up on Rendering infrastructure, and various Mozilla-specific topics (Open Source, Open Specs, Code Review, etc.)

I’ve pasted the calendar we followed for the week, below. The links point to raw notes from the sessions (where available.) I apologize for the lack of context in some notes, as they’re meant for the attendees. They’re in this blog post to give you an idea of what the Rendering Team does when we get together in a large group every few months.

Taiwan Rendering Sessions

Monday Tuesday Wednesday Thursday Friday
9am Lightning talks Graphics: SkiaGL Canvas (snorp) Graphics:WebGL (Vlad) Layout/Media: Implementing WebVTT CSS features (rillian/dbaron)
10am Free Graphics: SkiaGL Content (Jeff M.)
Layout: Intro to Style System (dbaron)
Graphics: WebGL (Vlad)
Media: libCubeb/Audio Latency (Kinetik)
Platform:Cycle Collection 101 (khuey) Graphics: Timing Attacks (bjacob)
Layout:Layout Documentation – Conf Room B (jwir3)Media: ???
11am Free Graphics: Async Canvas (Vlad, snorp)
Layout: Intro to Dynamic Changes in Layout (dbaron)
Graphics: WebGL (Vlad)
Media: Web Audio (padenot)
Layout: CSS Masking
Media: Fixing MediaStreamGraph video propagation (roc)
Graphics: Imagelib (joe)
Other: WebGL (Vlad)
Layout: ???
Media: ???
Noon Lunch Lunch Lunch Lunch Lunch
1pm Graphics: OMT-Compositing (Nical – “D”)
Layout: Layout 101 (Elika – “C”)
Layout: APZC Graphics: Moz2D/Player2D (Bas) Layout:Layout fuzzer status (multicol security bugs, etc.) – Conf Rm. A Graphics:Intro to Gecko Graphics (mwoodrow)
Layout: ???
Media: ???
2pm Graphics: Layers and buffers (bjacob) Layout:Web Animations (birtles)
Media: MediaSource Extensions (kinetik)
Graphics: OMT Canvas Layout: Web Animations contd. (birtles) Graphics: ???
Layout: Standardization and Mozilla (dbaron/abr) «IETF Slides»
Media: ???
3pm Graphics: Gralloc
Layout:CSS Variables / CSS Cascade (heycam, dbaron – “C”)
Layout: CSS Graphics Graphics: OMT Animation
Layout: (see graphics)
Media: Media Decoding (cdouble) OMX Codec (sotaro)
Graphics: B2G/Android Graphics Testing
Layout:CSS Writing Modes – Vertical Text (fantasai)
Graphics: ???
Layout:Layout Performance (jet)
Media: ???
4pm Media: WebVTT/TextTrack (rillian) The Mozilla Way (roc) Graphics: CSS Filters
Layout:CSS3 Fonts
Code Reviews – The Mozilla Way (roc) Work Week Wrap-up (jet)