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.
The complete procedure for fixing bugs (newbies style) is finally available 🙂
* I had one bug assigned: 685595
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:
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:
Your patch is going to be evaluated for the Newcomers maintainers soon.