Tag: programming

Steak vs Cucumber as BDD tools

When I joined the world of Ruby on Rails development and testing I was quite happy with all the tools and testing frameworks available, I was using a lot of them during development process. Words like Rspec and Cucumber quickly became part of my vocabulary, along with other ‘magic’ words like Kanban and Scrum. BDD, or ‘Behaviour Driven Development‘ became a permanent part of my life!

It’s crucial for a project, that the features that a customer would like to have implemented into the finished product are captured as well defined stories early on. We’ll eventually use these stories as a template for our tests. Cucumber is an especially good tool for using these stories as templates for testing. So what is Cucumber and what does it look like?

Here’s the explanation on Cucumber’s own wiki.

Cucumber is a tool that executes plain-text functional descriptions as automated tests. The language that Cucumber understands is called Gherkin.

Here is an example:

As you can see, Cucumber allows you to easily describe the behaviour of your new feature. In fact, it’s that good that some of our customers are using Cucumber descriptions as the acceptance criteria on their project’s stories. So where’s the catch? Well, not everything in cucumber is as easy as it may look. Even though cucumber has lot of pre-defined “phrases” to describe the behaviour of an application, you soon find out that sometimes it can be really tricky to preserve the readability of stories that are more complex than just: “And I should see ‘a yellow box” for example. When it gets tricky it gets really time consuming. And even if you know that implementing the related functionality is really easy – writing the proper, readable cucumber test that makes sense is sometimes very hard. I’m not complaining about writing tests in general. I’m complaining about how hard it is sometimes to achieve basic readability of tests! Does the average customer really have to understand the tests we use? If they do, then ok – I’m here and I’m prepared to write those nice, readable tests for them.  But what if they don’t care? Well there is another way around: the solution is called Steak.  So what is Steak? Steak is an Acceptance BDD solution (like Cucumber) but in plain ol’ Ruby. This is how an acceptance spec looks in Steak…

As you can see, there is a Feature description and a Scenario description, but the rest is Ruby language with Capybara syntax. But why do I think this is so special, and why do I think you should use it? Well it’s much, much faster to write those complex, yet readable tests, and it’s easy to maintain.

Recently, I was working on a tough project where I was the only back-end developer and there was one front-end developer; let’s call him Tom. At the start of this project we were using Cucumber. It took such a long time to write some of the tests, and because there were a lot of front end changes, we had to fix and re-write a lot of these Cucumber tests. Tom found he wasn’t that comfortable writing Cucumber scenarios, so it took him longer to fix them. At the start of the new iteration, I decided to use Steak instead of Cucumber. I discussed with Tom how Steak works, and he preferred it immediately. We started implementing new stories and development suddenly went really well and much quicker. I was writing Steak stories much faster, and Tom was faster too. So, by the end of the iteration there was no complaining about fixing Cucumber stories, and there was a lot more delivered functionality; them were some good times.

Is it Steak final solution?

Maybe, maybe not. It really depends on you and your customer’s needs, but what you really should do is to try it out yourself. You will see how much faster your development process can became.

Pair programming with your mind

My last post was about pair programming. Recently I start working on a small project where I can’t pair with anyone. So I started thinking “what could I use from pairing even When I’m not ? “.

My first thought was to act as if I was, so I would have to act as 2 different people. I should change my t-shirt and wear a hat or just put on glasses and change my hairstyle every time I change from one persona to another, but this could look really strange and potentially have detrimental consequences.

Another thought was, “Hey what are the advantages of pair programming which don’t depend on the other person directly” ? The answer is a better understanding of code, cleaner code and faster development. But how exactly would I achieve this? Let’s find out!

Better understanding of code

Better understanding of code is based on the fact that you explain your implementation to your partner. You can still do this, and very often you are actually doing it without noticing.

If you are speaking or just mumbling to yourself out loud then your brain is using different parts then if you were just “thinking” about the problem. So if you ask yourself out loud “Why doesn’t this work?” or “Ok this points to that if the value is….” then it is same as if you were speaking to someone else. Even if you ask yourself “What would Mr X do?”. Than you force yourself to look at the problem from a different perspective it would also help you.

Faster development

In pair programming you usually switch between each other for short time periods or small problems. This could be easy implemented and the answer is sprint. Pick small timeframe (10 minutes) in which you can implement some functionality. Then you set your watch or phone or some tools that you can download and start. You will see that you are trying to finish your code in the time limit (including your tests of course ;-) ) which will speed up your programming.

Cleaner code

Cleaner code is basically only about you, and because nobody is watching, you tend to not care that much about sanity of your code.

When I start programming in Ruby my friend who taught was really strict about code sanity. Every time when I paired with him, he would point out every small thing e.g. end of the line, space between operators etc.. So I was forced to care. Since then even when I’m not pairing I always make sure my code is clean enough to satisfy his sanity check. So imagine somebody who’s got your respect and is really anal about clean code. Try to not disappoint him.

These three rules will help you in your “virtual pair programming”. If you have another technique feel free to leave a comment!

jQuery bug or just strange behavior ?

Today I discovered some strange behavior of jQuery library, when I added some new functionality to our old adminstration.
So I’ve got Form element with some inputs and submit button. On inputs are binded click event. That mean that only if you click on input element Event will fire, right ? But I found that even if you press return key, Event fires too. I know that if you press return key and you are inside form element, Form will fire submit Event. But it fires click Event which is strange. jQuery documentation says:
//
The click event fires when the pointing device button is clicked over an element. A click is defined as a mousedown and mouseup over the same screen location. The sequence of these events is:

* mousedown
* mouseup
* click
//
Do you see any keyPress event or something, I don’t. I just don’t know if it is a bug or if it’s purpose. I also test if it’s because that keyPress Event or because that submit. It seems to me that if you press return key jQuery call submit Event and somehow call click Event too. Here is a example. What do you think ?

Solution for prevent this behavior is bind click Event only to inputs whith type text.

Btw: It works same way at all browsers.

HTML5 storage

Html5 storage – I recently started write pomodoro aplication to practice my skills and try out new technologies.
One of new technology that I tried is HTML5 storage. Storage is actually database but I prefer the word storage. I show you some examples here how it works.

I recently started write pomodoro aplication to practice my skills and try out new technologies.
One of new technology that I tried is HTML5 storage. Storage is actually database but I prefer the word storage.
I show you some examples here. I also
must tell you that Html5 storage works only at Safari. I tried it at Firefox 3.5 and Chrome
but didn’t work even after installation WebKit Nightly.

Fist step is change doctype definition and put manifest at html tag:

1: <!doctype html>
2: <html manifest="PomodoroTimer.manifest">

Ar row 2 you can see defintion of manifest file which is like cache. You can named it
as you like.

Step two is javascript. Because you need somehow dynamicaly add and remove or create records at your hmtl5 storage,
javascript is the right choice. So here is how you can create storage.

if (window.openDatabase){
  storage = openDatabase("pomodoro_timer", "1.0",
   "HTML5 Database for PomodoroTimer", 200000);
  if (!storage)
    alert("Failed to open the database on disk.");
  } else {
    alert("Couldn't open the database.);
}

At first line you can see how to check if window object support starage. At line 2 I create instance
of a storage: storage name, a storage version, a display name, and an estimated size, in bytes, of the data to be stored in the storage/database.
Rest of lines didn’t need an explanation.

So we created a database next step is create some table.

storage.transaction(function(request) {
  request.executeSql("SELECT COUNT(*) FROM tasks", [], function(result) {},
  
  function(request, error) {
    request.executeSql("CREATE TABLE tasks 
      (id INTEGER PRIMARY KEY AUTOINCREMENT, name TEXT,
         number_of_pomodoros INT, number_of_interuptions INT)", [],
      function(result, error) {           
      });
  });
});

At line one we create an anonymous function for storage transaction. Official definition of transaction method:
“The transaction method takes one to three arguments:
a transaction callback, an error callback, and a success callback. The transaction callback gets passed a SQL transaction object on
which you can use the executeSQL() method.This method takes from one to four arguments: a SQL statement, arguments, a SQL statement callback,
and a SQL statement error callback. The SQL statement callback gets passed the transaction object and a SQL statement result object which gives access to the rows, last inserted ID, et cetera.
“

Last step is insert some data to the table.

storage.transaction(function(request) {
  request.executeSql("INSERT INTO tasks 
     (name, number_of_pomodoros, number_of_interuptions) VALUES (?, ?, ?)", 
    [task.name, task.number_of_pomodoros, task.number_of_interuptions],
     function(result) {}, 
       function(request, error) {
         alert(error.message);
         return;
    });
});

I inserted some data from my object Task. You can see complete code
here.
My sources was this example aplication and w3c documentation.

Have fun.
ps: Select from storage is asynchronous so my pomodoro aplication didn’t use html storage until I resolve this issue.