In order to start working on my bug, the first step was to set up the local environment. Since my bug is part of the Brackets text editor, I only had to install Brackets in order to begin working on it. Luckily, I did not have any problems setting it up. It was very simple and I only had to follow a few steps from Thimble’s readme:
After that, I was able to get the text editor running.
I then had to figure out why the problem was only happening in Firefox. I did some searching and found out that it’s a common problem where the CSS properties height / line-height render differently in Firefox than in Chrome. Now I had to find this property in the code and see if it really was the problem.
When I opened the code, it was confusing and overwhelming at first. It took me a while but I was able to find the CSS code for the file renaming UI:
Fixing the bug was the easiest part. All I had to do was add a separate line-height property for Firefox. Luckily, something similar had been done previously in the code, so I didn’t have to figure out how to do this and instead just reused the same line. This is what I added:
Here is what the file renaming input looked like before and after I changed it: