Brave Browser Bug Fix
In this week’s episode of open source adventures, I was tasked with fixing bugs in the URL parsing of Brave Browser. First of all what is Brave Browser? It is an open source web browser that focuses on blocking web trackers and intrusive advertisements. It also encourages privacy by sharing less of your personal data with advertising companies. Now that we know a little about Brave Browser, what does that mean for us?
Brave Browser is open source meaning anyone can access the code base as well as contribute. Since it is a relatively new browser compared to Firefox and Chrome for example, there is still a few bugs most notably in the URL parsing. So my professor David Humphrey, gave my class and I a few test URLs to test in Brave Browser and compare its results versus the results in Chrome and Firefox. Most of the URLs given worked except for 2.
" https://www.google.ca/search?q=dog cat "
Both of these URLs were not being parsed correctly by Brave. The result of these URLs can be seen below.
As you can see its taking the entire URL and passing it into the search bar which is definitely not what we want. We want it to just pass “dog cat” into the search bar and get results for that. The reason behind this bad URL parsing is that Brave did not take into account for spaces within query parameters of the URL. If there are leading spaces before or after the URL then Brave accounts for this by calling the
Now the most interesting part about this bug fix is that a new approach was taken to achieve it. What is this new method? Its called Test Driven Development or TDD for short. This method focuses on writing the tests BEFORE fixing the bug so instead we focus on making our failing tests pass instead of the other way around.
Based on this principle, we need to write the tests first. As you can see below, these are the two tests written for this use case.
Now time to actually see if these tests are failing as expected. After installing the mocha library using
npm install — global mocha and building them, I ran
npm run test — — grep=”dog” to only show me the tests that have the word dog in it. This then showed me the 2 tests that were failing.
As you can see the expected values were false however the return values were true which means that the
isNotUrl function does not consider these 2 URLs to be valid, because of the space between dog and cat. Now that we know the tests are failing, its time to go and fix them.
After searching the code base, it was clear that as soon as the URL is being taken into the
isNotUrl function, its being trimmed. Therefore this portion of the code is where we need to handle any spaces before more complex URL manipulation takes place. I realized that Regex is the best course of action to handle an indefinite amount of white spaces as well as ensuring they aren’t located at the front or back of the URL.
As you can see the Regex above simply says “look for all white spaces that aren’t located at the front or the back of the URL and replace it with %20”. Now does this actually work? Yes it does! The unit tests are passing now.
Time to check if it fixes the URL when searching it in Brave Browser.
Success!!! In conclusion this bug fix was very meaningful since it exposed me to a different approach to bug fixing. Rather than debugging code and building my tests after the fact to ensure everything works well, I can build tests that I know will break and then go and fix them. All in all important lesson learned in this bug fix and looking forward to implementing this approach in future bug fixes! For now that’s a wrap. See you on the next blog post!