Thursday 9 February 2017

Lab 3: Fixing a Bug in Mozilla Thimble

For this lab, we had to choose a issue within Thimble to solve. I chose to go with:

https://github.com/mozilla/thimble.mozilla.org/issues/1536

The original person who created the issue made this comment:

"A user guiding teachers through Thimble noted that on their Chromebooks, Thimble interpreted both parts of double- and single-quotation mark pairs as closing quotations, breaking attribute values. We should make sure Thimble interprets opening and closing quotation mark keystrokes differently on Chromebooks or provide an easily discoverable work-around."

To start this lab, I followed David Humphrey's guide to fixing a bug in Thimble (http://blog.humphd.org/fixing-a-bug-in-mozilla-thimble/), which does involve some initial setup. I had to make 3 downloads:

1) Node.js
2) Vagrant       -> **stored in C:/Hashicorp/Vagrant**
3) Git

I forked Bramble to my Github account, but when I tried to use:

$ git clone --recursive git@github.com:{your-username}/brackets.git
For some reason I got this response inside Git Bash:




















So this is my first set-back...

I googled the problem for about 5 minutes with no real progress. By chance I happened to look at the actual Brackets repo I had forked. I looked at the README.md and saw it had instructions of its own. I followed those instructions, typing:

git clone https://github.com/[yourusername]/brackets --recursive
Now it works!! All of the submodules are coming in. I navigated to the root of the directory I cloned:

ls -a  -> to view list of all folders
cd brackets   -> go to the new directory of the repo I cloned.






I did the command, and nothing happened for several seconds. I thought something was wrong, but eventually it started to do stuff (lots of deprecated warnings, then actual installations). From here on, I went back to David Humphrey's tutorial and followed onwards for getting Bracket set up on my local machine.
Futher down, I ran into a familiar problem again. Using -


$ git clone git@github.com:{your-username}/thimble.mozilla.org.git
I was not given access rights. I figured I'd use the same fix as the first problem up above and changed it to:

$ git clone https://github.com/Blackweda/thimble.mozilla.org.git

And that solved the problem again. I actually just realized now, I cloned the thimble.mozilla.org.git repo inside of my brackets folder... that may cause BIG problems in the future, but for now.. we'll just hope nothing goes terribly wrong.

Moving into the thimble directory I continued with: $ vagrant up and received this error message:















It is saying that I don't have any 3rd-party software for Vagrant to use.. I'm hoping this has nothing to do with the fact that I messed up directories, so I'm going to go ahead and download VirtualBox from the internet. Once I had it installed, I tried the command again in Git Bash.

Worked.





















Next, I will have solve the problem of the simple bug for Thimble. I will revisit this post with the results of my efforts shortly...

[Few Days Later...]

Apparently even before getting into trying to solve the bug, I tried to reproduce the problem on a Chromebook I borrowed, because the bug involved Chromebooks. Already the issue has been closed for now.




















I am thinking to switch to another issue:

https://github.com/mozilla/thimble.mozilla.org/issues/1715

========================================================
ISSUE 1715

While browsing files, I came into these:

thimble.mozilla.org/scripts/localize-client.js

and noted the following lines of code:

let nunjucks = require("nunjucks");

let template = nunjucks.configure(filePath, { noCache: true });


thimble.mozilla.org/package.json

"dependencies": {

"npm-run-all": "^1.5.1", "nunjucks": "^2.3.0"

thimble.mozilla.org/services/login.webmaker.org/Gruntfile.js


grunt.initConfig({
pkg: grunt.file.readJSON("package.json"),




At this point I got curious, if I just happened to change the number inside the dependencies block,
would that automatically make the installs choose the next version?

This also gave me an idea that possible package.json is referenced in another file that will do some sort of initConfig() for setting up our Nunjucks??

So, in order to test this bug, it seems that I have to get rid of my Thimble and then re-install it and look to see what version of Nunjucks is loaded during installation. Looking at the vagrant commands, it looks like I'll have to PROVISION it. I tried 'vagrant provision' but the machine is saying:

$ vagrant provision
A Vagrant environment or target machine is required to run this
command. Run `vagrant init` to create a new Vagrant environment. Or,
get an ID of a target machine from `vagrant global-status` to run
this command on. A final option is to change to a directory with a
Vagrantfile and to try again.

So I typed in 'vagrant global-status' and it showed me the ID of my VM. I then typed in 'vagrant provision myID' and let it run. After doing so, my same virtual box is there... so I'll run through the processes that happened and see if Nunjucks was anywhere in the list of things affected. Unfortunately I did not see it... I'm going to try a command the professor mentioned in class - 'vagrant destroy'. This should completely remove my setup of Thimble I hope, so I can remake it and see the version of Nunjucks I have and see if the issue looks similar to what I have.

I'm looking for this:


npm WARN deprecated nunjucks@2.3.0: potential XSS vulnerability in autoescape mode, and with escape filter was fixed in v2.4.3
Let's go. I destroyed it, now I redo everything with 'vagrant init', then 'vagrant up' again. Uh oh.. got this....















So I decided to completely delete both the cloned versions of Brackets and Thimble from my local machine and start over... I asked some questions about how the package.json file, and I was correct in thinking that changing the version number will actually change what files the software downloads!

So what I'm going to do is this:

1. Get the most recent version of Brackets and Thimble and fork them.
2. Clone both versions of the issue branches to my local machine.
3. Create an issue-1715 branch in both repositories. (My concern is: do I do this on GitHub or inside       my local machine??)
4. Change the package.json file inside my local machine for both of the software packages.
5. Test that they work.
6. Push both issues back to the GitHub account.
7. Make a pull request back to the original repositories.


While re-cloning Brackets and Thimble again, I realized that my cloned version is also a repository because I saw the (master) branch designation... So I suppose that only when I do '$ npm run build' will the software actually be working on my local machine, but the repository is actually present.

So what I did was:

Inside Git Bash, while on the master branches of Thimble and Brackets, I made another branch for my issue:

git checkout -b issue-1715

When I went inside Thimble's package.json file, I saw nunjucks at version 2.3.0. I quickly made a change to 2.4.3. Inside Bracket's package.json file, I actually didn't see nunjucks at all!! So I added a line inside their dependencies section with "nunjucks": "2.4.3",

Once I did that, I [git add] and then [git commit] both of them. I then pushed them both back to my GitHub repos:


$ git push origin issue-1715
Going back to my GitHub account, it shows a notification that I pushed something.














I will click the 'Compare & pull request' and proceed on both repositories. The pull requests are here:

https://github.com/adobe/brackets/pull/13105
https://github.com/mozilla/thimble.mozilla.org/pull/1742


Setting up Thimble and Brackets wasn't too much of a hassle, because I simply followed the instructions. The hardest parts was understanding the differences between what my Forked Repo was, and what my Cloned Repo was.. and where to make changes.

I basically learned that I had to Fork another group's project, clone it to my local machine, make a branch in the version of my machine, make the changes and push it back to my GitHub repo... then make a pull request back to the group project where it came from.

The bug itself was a simple fix: simply to tell the software to look for the better version of nunjucks while it is installing its plugins.. I edited the version inside package.json so that while the software is looking for its dependencies, it will get the correct version.



[Check Back A Few Days Later]

I went back and saw this posted on the Brackets page:


 


  So two things mentioned: 

Changing the dependencies changes nothing if the code never uses it. Also, I needed to be in the Brackets version of Mozilla, not the original Brackets used by many different softwares!! So let's go do that. 

 

No comments:

Post a Comment