User:Ishitva

Google Summer Of Code 2014

Project: Migrate from YUI2 to YUI3. Bug 453268
Assigned Mentor: Mr Byron Jones
Git Fork: https://github.com/ishitvagoel/bugzilla

Short description: The present stable release of Bugzilla uses YUI2 library for its user interface which is now deprecated and is no longer maintained . There is a compelling need to migrate to the latest version of YUI that is YUI3 as it is a more secure and an actively maintained framework . Therefore in this application , I propose to perform the task of complete migration of the Bugzilla codebase from YUI2 to YUI3 and subsequently carry on the task of refactoring the code.

Weekly Updates

Community Bonding Period:

The community bonding period was used for the experimentation purpose, the summary of the work done is as follows :

• Discussed with my mentor the approach to be used for loading the YUI modules. We tried various approaches like using a separate JS file for creating a YUI instance with the required modules loaded and then including this file on all the Template files which used the YUI code or the code in the JS files. This approach didn't seem viable as then we would have had to load all the modules attached to the YUI instance on all the template pages. So we then finally decided to create a yui3 array on global/header.html.tmpl file, with “node” as the default module to be loaded and then subsequently use the push method to add modules to this array on the template pages to load the required modules during the runtime.To implement this we came up with the following changes to the codebase, as suggested by my mentor, global/header.html.tmpl changes. These changes are yet to be tested.

• We tried to migrate the js/TUI.js file and came up with these changes: TUI.js changes A special thanks to Mr Clarence Leung (Yahoo) who provided valuable feedback during this work.

• Learnt about using the Debugger Tool of Firefox : Debugger . As my mentor has suggested, we will be using this tool to test the changes which we will be making to the codebase. We will be using breakpoints to check whether the functions defined inside the JS files are getting hit or not and also to test for any other errors.

---

Week 1, 19th May-26th May 2014

• Committed the changes to the js/attachment.js file to the git fork: js/attachment.js changes. The changes to this file also are yet to be tested.

NOTE: I will be having my final exams at college for which I will have to prepare full time, so I have taken permission from my mentor to take a preparatory break till 5th June 2014. After that all the pending work will be taken care off. All the remaining testing work will be done and after that only further migrations will be performed.

---

Week 4 , 6th June-15th June 2014

So finally my exams got over and I started with my work !

The work done during this phase is as follows:

• The changes made to the file TUI.js were tried to be tested. While testing it we found out that the YUI3 modules were not getting loaded. The reason behind this was that the previous changes made to the header.html.tmpl file for creating a YUI3 loader were incomplete.When we include a module using the use() function of the YUI() constructor the module doesn’t work unless the the JS file in which its class is defined is loaded already. So what we were missing was the part which would pre-fetch the YUI3 JS files so required for the modules to work. We came up with these , Loader Fix, changes which made it possible for the script elements to be be created which pre-fetch the required JS files , while rendering the HTML.

• Still this was not enough ! We again tried to test the TUI.js file on the page enter_bug.cgi page of Bugzilla and found out that even when all the required JS files were getting pre-fetched and the modules were expected to get loaded without any problem , as soon as we entered the enter_bug.cgi page we came across an error ” TypeError: Y.on is not a function”. This was completely unexpected ! We tried to fix the issue and spent a lot of time on this problem and finally headed towards #yui for some guidance.There :foxxtrot helped us identify what the problem was due to. The problem was due to the fact that we had not included all the dependencies for the modules we intended to use, because of which when the use() function tried to load the modules the asynchronous behaviour of the YUI loader was triggered such that unless the required dependencies would be loaded the rest of the code could proceed to be executed. This created a problem for us as Y.on() function was getting used even before the dependencies for the module(yui-base) it is defined in were loaded and hence the aforementioned error came up. So :foxxtrot suggested us to use a config object {bootstrap:false} for the YUI() constructor. We included this config object , and then using the YUI3 Configurator , calculated all the dependencies and included all the dependency modules along with the modules we wanted to use on the bug/create/create.html.tmpl file, through the yui3 array, and then tested the TUI.js file on enter_bug.cgi page again. This time Eureka ! it worked :) Although this method works , it has some shortcomings too, that the number of dependency modules to be loaded is way too large which makes the loader slow as the script element for each of the module has to be generated and also that we ourselves will have to calculate the dependencies. What we need to do is to automate the offline dependency calculation or maybe combine the modules into one module using a File combiner.So as :dobedobedoh (#yui) suggested , we tried to implement in our header.html.tmpl the YUI3 Loader, the gist of which can be seen here, YUI3 Loader Experiment .The experimentation on the Loader is still going on, but as of now to proceed with the migrations and testing we have decided to use the present working version of the Loader.

• Facing all these challenges we somehow managed to progress ! We tested the TUI.js and the attachment.js files and the changes made to them worked fine. Then the migration of the files change-columns.js , comments.js, flag.js, util.js and global.js and the Voting Extension was done. The changes to these files will be pushed to the GitFork as soon as they are tested. Currently we are trying to migrate the bug.js and custom-search.js files.

So far so good !

---