Let’s contribute GNOME: Fixing bugs – session three

This time, we were only four: Mario, Fabian, Briggette and me. Mario was trying to install   jhbuild build gtk+ requieres packages like sysdeps, flex, anthy and many others. Briggette was trying to finish the Web basic site completing the BACK and FORWARD button, because Fabian showed us last time to set the GO button. Fabian was helped in the channel of IRC gnome developers as cfoch while I was trying to fix a bug… I was also trying to show Briggette how to connect to the IRC GNOME women channel. It was a shame that I had some problems with my laptop ( I am using a Fedora virtual machine but some plugins were missing)  so I could post my IRC experience later.

11270371_465471206942373_7699094927853625372_o

The complete procedure for fixing bugs (newbies style) is finally available🙂

* I had one bug assigned: 685595
bugzilla

Following the tutorial: cloning is the first part, then get inside the directory to see the code

[yulytas@gnome gnome]$ git clone git://git.gnome.org/newcomers-tutorial
[yulytas@gnome gnome]$ cd newcomers-tutorial/
[yulytas@gnome newcomers-tutorial]$ ls
 COPYING README gnome-image.png hello.js newcomers-tutorial.doap
[yulytas@gnome newcomers-tutorial]$ gjs hello.js
 bash: gjs: command not found

If you get the same message, just install gjs

[yulytas@gnome newcomers-tutorial]$dnf install gjs
 Reading package lists... Done
 Building dependency tree
 Reading state information... Done

Now it is time to run again the program and see what is the error message:

[yulytas@gnome newcomers-tutorial]$ gjs hello.js 

(gjs:4155): GLib-GObject-WARNING **: The property GtkImage:stock is deprecated and shouldn't be used anymore. It will be removed in a future version.

(gjs:4155): Gjs-WARNING **: JS ERROR: ReferenceError: application is not defined
WelcomeToTheGrid<._quit@hello.js:68
wrapper@resource:///org/gnome/gjs/modules/lang.js:169
@hello.js:75

The majority of cases the error message can give us a hint of how to solve them, so the error are related to the image, the WelcomeToTheGRid object and the quit action.

* This is the code with bugs on it:

#!/usr/bin/gjs

const Gtk = imports.gi.Gtk;
const Lang = imports.lang;

const WelcomeToTheGrid = new Lang.Class({
    Name: 'Welcome to the Grid',

    // Create the application itself
    _init: function() {
        this.application = new Gtk.Application();

    // Connect 'activate' and 'startup' signals to the callback functions
    this.application.connect('activate', Lang.bind(this, this._onActivate));
    this.application.connect('startup', Lang.bind(this, this._onStartup));
    },

    // Callback function for 'activate' signal presents windows when active
    _onActivate: function() {
        this._window.present();
    },

    // Callback function for 'startup' signal builds the UI
    _onStartup: function() {
        this._buildUI ();
    },

    // Build the application's UI
    _buildUI: function() {

        // Create the application window
        this._window = new Gtk.ApplicationWindow({
            application: this.application,
            window_position: Gtk.WindowPosition.CENTER,
            border_width: 10,
            title: "Welcome to JavaScript"});

        // Create the Grid
        this._grid = new Gtk.Grid ({ row_spacing: 20 });

        // Create an image
        this._image = new Gtk.Image ({ file: "gnome-image.jpg" });

        // Create a second image using a stock icon
        this._icon = new Gtk.Image ({ stock: 'gtk-about' });

        // Create a label
        this._label = new Gtk.Label ({ label: "Welcome to GNOME, too!" });

        // Create a button
        this._button = new Gtk.Button ({ label: ".. .and good-by" });
        this._button.connect ("clicked", Lang.bind(this, this._quit));

        // Attach the images and button to the grid
        this._grid.attach (this._image,   0, 0, 2, 1);
        this._grid.attach (this._icon,    0, 1, 1, 1);
        this._grid.attach (this._label,   1, 1, 1, 1);
        this._grid.attach (this._button,  0, 2, 2, 1);

        // Add the grid to the window
        this._window.add (this._grid);

        // Show the window and all child widgets
        this._window.show_all();
    },

    _quit: function() {
        application.quit();
    }

});

// Run the application
let app = new WelcomeToTheGrid ();
app.application.run (ARGV);

Examining the current code, we see that the image is called with extension jpg and it was saved in the directory an image with the png extension. The other function to correct is quit, which is not specifying what application has to quit, and finally I edited the label .. . good -by to say …good-bye:

bug

We can see what we corrected by using git diff

[yulytas@gnome newcomers-tutorial]$ git diff
diff --git a/hello.js b/hello.js
index 39fe8b9..d8a8b6a 100755
--- a/hello.js
+++ b/hello.js
@@ -39,7 +39,7 @@ const WelcomeToTheGrid = new Lang.Class({
 this._grid = new Gtk.Grid ({ row_spacing: 20 });
 
 // Create an image
- this._image = new Gtk.Image ({ file: "gnome-image.jpg" });
+ this._image = new Gtk.Image ({ file: "gnome-image.png" });
 
 // Create a second image using a stock icon
 this._icon = new Gtk.Image ({ stock: 'gtk-about' });
@@ -48,7 +48,7 @@ const WelcomeToTheGrid = new Lang.Class({
 this._label = new Gtk.Label ({ label: "Welcome to GNOME, too!" });
 
 // Create a button
- this._button = new Gtk.Button ({ label: ".. .and good-by" });
+ this._button = new Gtk.Button ({ label: "...and good-bye" });
 this._button.connect ("clicked", Lang.bind(this, this._quit));
 
 // Attach the images and button to the grid
@@ -64,8 +64,8 @@ const WelcomeToTheGrid = new Lang.Class({
:

Commit your changes with git commit and write the fixed changes on it:

[yulytas@gnome newcomers-tutorial]$ git commit --amend --signoff
[master fabd51a] Image extension corrected and button clicked action to quit is fixed.
 Date: Sun Jun 21 18:36:52 2015 -0500
 1 file changed, 4 insertions(+), 4 deletions(-)

As the newcomers-tutorial of GNOME indicated, create the patch which will be stored inside the home directory and them attach it to the bug.

[yulytas@gnome newcomers-tutorial]$ git format-patch --stdout HEAD~1 > ~/myPatch.patch

After creating the patch, click on Attachment to upload it in bugzilla:

bugzilla

Your patch is going to be evaluated for the Newcomers maintainers soon.

About Julita Inca

Ingeniero de Sistemas UNAC, Magíster en Ciencias de la Computación PUCP, OPW GNOME 2011, Miembro de la GNOME Foundation desde el 2012, Embajadora Fedora Perú desde el 2012, ganadora del scholarship of the Linux Foundation 2012, experiencia como Admin Linux en GMD y Especialista IT en IBM, con certificaciones RHCE, RHCSA, AIX 6.1, AIX 7 Administrator e ITILv3. Experiencia académica en universidades como PUCP, USIL y UNI. HPC researcher, a simple mortal, like you!
This entry was posted in GNOME, τεχνολογια :: Technology and tagged , , , , , , , , , . Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s