Git is an extremely popular tool for version control in collaboration. It helps programmers to create their own branch, merge their branched version back to the main, as well as helping users deal with conflicts occurred when merging branches. As for me, though I have a little experience with Git before, most cases I experienced didn’t actually include much conflicts or many levels of repo. Therefore, pulling and pushing when there are conflicts remains more or less mysterious to me, and doing upstream is completely new. These two are also the main focus for me while doing the Git activity in class. For the remaining time out-class, my teammates and I continued on building our web extension.

Git Activity

We started by forking the master branch and cloning the forked branch to our local machines. Here, by running “remote -v”, we can only see the cloned branch, without the primary master branch. In order to access to the primary master branch, we need to manually add it as an upstream. And the graph given by our professor illustrate this relation clearly. This is something I had no idea about before this class. And I am very grateful that such structure is so clearly illustrated. Instead of only cloning a branch and doing update on the branch, it is much more professional and explicit to work in this way.

After that, we went to handling merging conflicts. By experimenting, we found that when there is no conflict, for example, the branch has additional lines compared to the main, then when pulling from the main, by some rebase setting, Git can merge smoothly for us. However, when there are conflicts like having different values at the same place, we need to manually go over the code to decide which value we want to keep for each conflict. Honestly speaking, I was afraid of merging before, because I was not sure if there is a conflict and what specifically I should do when there is a conflict. And I was rather not that familiar with using command lines to handle Git. However, now at least I have a basic understanding of how conflicts are treated and I would be more confident when facing conflicts.

At the same time, I know that there are still a lot of techniques of Git remaining mysterious for me, like the specific meaning of rebase. I tried to look them up some time last year, but I failed to fully understand them. I do think that I will push myself to learn them in near future, as manipulating Git professionally is a great personal advantage no matter in just doing projects or succeeding in future career.

Web Extension

As someone totally has no experience writing Javascript before, I actually encountered many problems doing this web extension.

The first essential problem that I need to figure out is the difference between content scripts and background scripts. We targeted this problem because our code at first doesn’t have the access to browser.theme. So we began to compare our code to similar mature projects and found that all of these projects have background specified in manifest.json. By searching online and reading documentations, we have a general understanding that background is supposed to handle tasks more related to the web browser itself, while content script focuses more on the specific contend shown on a webpage, for example, like the text and pictures on the page. And since the goal of our project is customizing the title bar color, we naturally need the background script and content scripts is not necessary.

As a consequence of using background script, we further found that the communication between popup window and background cannot be handled by browser.tabs.sendMessage() like how beautify does. Instead, browser.runtime.sendMessage() would be a decent choice.

For the problems described above, actually there isn’t much clearly stated information online. The mdn documentation is not detailed enough. Though it provides a direction to look into, there were still many bugs that we didn’t know how to fix. And I actually asked someone specializing in frontend in a software company via my friend for help. He provides a great amount of insightful suggestions.

Another challenge worth mentioning is that I later found that in order to update theme for only one window, normal function is Javascript is not enough. We have to use async … await. I am not very clear about the reasons behind. And I figured it out mainly by reading mdn documentation and going over the samples on its website.

One last pitiful thing remained is that, originally, we intend to build a web extension that allows users to change color for every single tab. However, during the process, we found that among provided API, the smallest unit of changing browser theme is a window. A window contains many tabs, but we are not able to access each tab’s theme here. And we don’t have enough time to go that deeper here. So that goal remains unreached.

As for the collaboration part, it was generally smooth. One impressive thing is that, Grace is the one familiar with Javascript among us. So after the others solve a problem, for example, after I figured out the communication between popup and background, the code may remain clumsy, because I am doing poor writing elegant Javascript codes, and then Grace would help to polish the codes, making them more efficient and more flexible to changes. And we are learning from each other as well.

Overall, this is a truly fruitful experience. I learned more things than I imagined, getting in touch with unfamiliar persons which inspired me a lot, making me enlightened by their intelligence.