Building Mozilla web browser from source

-
This week I built the Firefox web browser from source. Mozilla currently has about 17,998,723 line of code, it is mostly built with C++ but also includes other languages such as HTML, C, JavaScript, Rust, and many more. I personally use Mozilla as my preferred browser, so it was interesting to download and modify the source code.

Mozilla has easy to read instructions that I followed for downloading the source code, building it, then running. I'm using Mozilla on a Windows 10 system.

Some of the prerequisites include installing Visual Studio with certain workloads, Rust, MAPI Header Files, and MozillaBuild. Once I installed everything necessary, I was ready to pull the Firefox source code using the command

hg clone https://hg.mozilla.org/mozilla-central
And then the wait begins.



After patiently waiting for the a while, the downloading aborts. Uh oh, what happened? The message read: "Rust compiler not found". I have installed the Rust compiler and have the PATH set in the Environment Variables, so what was the problem? I thought that maybe it's my laptops fault so I tried the same steps on my desktop, and same problem persisted on both of my machines. I knew that the fault was with my setup. Looking back through the instructions, I was suppose to add the line PATH=$PATH:~/.cargo/bin to one of the following ~/.bash_profile, ~/.bash_login, or ~/.profile. Aren't these Linux files, but I am on Windows, so how does this work? I thought that setting the Environment Variables was good enough. I tried searching these files on my computer but nothing came up. After running out of options, I tried the command  vi ~/.profile  and to my surprise, it worked!


I tried pulling the source code once again and this time everything worked! Once I built and ran the source, a new Firefox web browser window popped up. Success!


Now onto the fun part, modifying the code and seeing how I can change the browser window. I was surprised at the amount of files that the source contained, and with each file containing hundreds or thousands of lines of code.


I modified a few of the icons in the browser, the height of each tab, and the tabs toolbar background. As I was going through the code, I noticed the amount of comments used by these programmers. The comments were very clear and to the point, something I need to work on a little more.


My last change was to open up a cat gif site each time the user opens a new window. Although you could argue that the Firefox browser window that I modified isn't the prettiest, it was a fun experience building Firefox from source.



Comments

Post a Comment

Popular posts from this blog

Async image load test with gh-pages

-
Image
I finally got the opportunity to try out GitHub Pages. GitHub Pages is a simple static HTML page that we can create from our GitHub repositories. It is perfect for documentation or anything related to the project. To get started, a gh-pages branch must first be created, and then it can be further setup in the settings section. For this project, I wrote a test case for async image loading. I built a simple page that would allow me to test this in multiple browsers. The page is very simple with an image, a counter, and a button to reload the image. As the user clicks the button, the image is reloaded. If the image is reloaded, the background changes colours and the counter is updated. The async testing has passed on all the browsers except for Safari. I decided to dig deeper into this and Safari is like this. I had to dig pretty deep into the webkit source files to see where the load event is fired. After digging around for a little bit, I found the ImageLoader.cpp file. The na
Read more

First bugs completed

-
Image
After working on my bugs for the past few weeks, I've finally completed two of my bugs! The bugs themselves were very simple to solve, but in this process, I've learned how to use a variety of different Git command, including clone, pull, add, fork, and pull request. I use to feel lost while using Git, now I'm much more confident with my new skills. Neither of my bugs were software-breaking bugs, and most users wouldn't even notice them. I finished my first bug in my previous blog, you can go and view it here . Deep inside of Firefox's Dev-tools, one button's boundaries extended to the end of the screen, instead of around the image only. The fix was relatively easy, a CSS class was already created and I only had to place the class name in the correct spot on the HTML page. I left the last blog after I completed the bug, without creating a Pull Request. During my previous lab, I practiced creating a Pull Request, so I had an idea on how to do it this time. I cr
Read more