Confidently Incorrect - Navigator Extension

Confidently Incorrect since 1987

Creating an extension for Chrome/Firefox

So this project felt a bit smaller in scale than our previous projects, perhaps because of our growing competence with coding, but what it allowed us as a team to do was to concentrate on the processes associated with working as a team on a project.

From the outset, we spent time planning and putting in place the ubiquitous rituals and practices that come with AGILE methodology.

So we set up our Trello board for organising our objectives, and agreed that we would undertake a daily stand-up each morning where we discuss new objectives, how we would assign the objectives for that day, our experiences from the previous day, any ideas or suggestions which we want to share with the group.

As a team of 4 we decided to practice pair programming, changing the pairs on a daily basis, with each person taking a turn at the keyboard throughout the day, to ensure we all were comfortable with the code and had a chance to be actively contributing to the codebase, which was a great experience with us learning how we each approach the code differently and getting to see different styles of solving issues within the codebase.

We also agreed that at the end of each day we would have a 15-minute session where we could share our frustrations and victories from the day, and to decide whether any objectives would need more time to be completed to our satisfaction.
This was particularly easy to implement as we already had a daily ritual of writing a journal entry at the end of each day for our school, Ada Tech School.

So we were given free rein as to what kind of extension we were to create, and after some short discussion we settled upon the idea of an extension which when activated would replace certain words on a webpage with a selection of emojis. After settling upon this idea, we set ourselves to reading documentation and various articles relating to how exactly to go about creating a navigator extension, which we allowed a half day for, after which we came together to share our knowledge and thoughts on how to best go about creating our extension, which we decide to call Sweet Web, and quickly created a little graphic for the project:

So after our research, we decided to create a roadmap for our project to allow us to manage our time and deconstruct the challenges we set ourselves:

• Creating the manifest (v3)
• Using a Regex to find the words on the page
• Having a clickable button to activate/deactivate the extension
• Use local storage to allow users to add words to the banned list
• Make the extension cross-platform (Firefox as well as Chromium browsers)

All of these goals were achieved, although the most difficult of these objectives turned out to be making the extension work with Firefox, due to Firefox using the version 2 for the manifest files, so in the end we recreated our extension using the older format of the manifest files, which is not exactly what we envisaged to begin with, but most importantly, worked!

So our extension traverses all the nodes of the DOM (Document Object Model) searching for text, at which point, when text is discovered, the regex is used whereupon using the predefined list of banned words (and any user added words from local storage) it will replace those words with a selection of emojis.

As a brief aside, this project was the point in my studies where it became clear to me the time to upgrade from my 6-year-old laptop had arrived, with my laptop taking a markedly longer time to traverse the nodes in the DOM than my colleagues...

This was also the project where we began to take the time to document our project more rigorously, and using Readmi we created a more complete and attractive ReadMe document, as well as having a logbook which we documented our daily struggles and victories within.

Here is the link to our GitHub repository for those interested, although the majority of our documentation is in French, so be forewarned anglophones reading!

This project was great fun to work on, and definitely benefited from our adherence to our daily rituals and constant communication between pairs and individuals, using Slack and regular meetups to ensure that we were all up to date with changes and improvements and bugs within the code.

Next week, I will discuss our first project (and my first encounter with) using PHP!