HACKINGON.NET

My New BDD Style

liam.mclennan.nospam@nospam.gmail.com (liammclennan) — Wed, 17 Mar 2010 11:02:00 +1000

I have made a change to my code-based BDD style. I start with a scenario such as:

Pre-Editing

* Given I am a book editor
* And some chapters are locked and some are not
* When I view the list of chapters for editing
* Then I should see some chapters are editable and are not locked
* And I should see some chapters are not editable and are locked

and I implement it using a modified SpecUnit base class as:

[Concern("Chapter Editing")]
    public class when_pre_editing_a_chapter : BaseSpec
    {
        private User i;
        // other context variables

        protected override void Given()
        {
            i_am_a_book_editor();
            some_chapters_are_locked_and_some_are_not();
        }

        protected override void Do()
        {
            i_view_the_list_of_chapters_for_editing();
        }

        private void i_am_a_book_editor()
        {
            i = new UserBuilder().WithUsername("me").WithRole(UserRole.BookEditor).Build();
        }

        private void some_chapters_are_locked_and_some_are_not()
        {
        }

        private void i_view_the_list_of_chapters_for_editing()
        {
        }

        [Observation]
        public void should_see_some_chapters_are_editable_and_are_not_locked()
        {
        }

        [Observation]
        public void should_see_some_chapters_are_not_editable_and_are_locked()
        {
        }
    }

and the output from the specunit report tool is:

Chapter Editing specifications 1 context, 2 specifications

Chapter Editing, when pre editing a chapter 2 specifications

should see some chapters are editable and are not locked
should see some chapters are not editable and are locked

The intent is to provide a clear mapping from story –> scenarios –> bdd tests.

Changing Platform

liam.mclennan.nospam@nospam.gmail.com (liammclennan) — Wed, 17 Mar 2010 07:17:25 +1000

From time to time a developer makes a break from their platform of choice (.NET, Java, VB, Access, COBOL) and moves to perceived greener pastures. Zed Shaw did it, jumping from Ruby to Python, and Mike Gunderloy went from .NET to Rails.

But it can be difficult to change platform. My clients don’t come to me looking for a software developer, they come looking for a .NET developer. This is a tragic side effect of big software companies marketing.

If your village is under attack by bandits, would you turn away the first seven samurai who offered to help because you didn’t like their swords? What matters is how effectively they can defend your village.

You should not tell your carpenter what sort of hammer to use and you should not tell your software developer what platform to use.

Trying to Organise a Software Craftsman Pilgrimage

liam.mclennan.nospam@nospam.gmail.com (liammclennan) — Tue, 16 Mar 2010 19:37:38 +1000

As I have previously written, I am trying to organise a software craftsman pilgrimage. The idea is to donate some time working with quality developers so that we learn from each other. To be honest I am also trying to be the worst.

“Always be the worst guy in every band
you’re in.” Pat Metheny

I ended up posting a message to both the software craftsmanship group and the Seattle Alt.NET group and I got a good response from both. I have had discussions with people based in: Seattle, New York, Long Island, Austin and Chicago. Over the next week I have to juggle my schedule and confirm the company(s) I will be spending time with, but the good news is it seems that I will not be left hanging.

My Message to the Software Craftsmanship Group

liam.mclennan.nospam@nospam.gmail.com (liammclennan) — Mon, 15 Mar 2010 08:05:26 +1000

This is a message I posted to the software craftsmanship group, looking for a week-long, pairing / skill sharing opportunity in the USA.

I am a journeyman software craftsman, currently living and working in Brisbane Australia. In April I am going to travel to the US to attend Alt.Net Seattle and Seattle codecamp.

In between the two conferences I have five days in which I would like to undertake a craftsmanship mini-apprenticeship, pairing and skill sharing with your company. I do not require any compensation other than the opportunity to assist you and learn from you. Although my
conferences are in Seattle I am happy to travel anywhere in the USA and Canada (excluding Hawaii :) ).

Things I am good at: .NET web development, javascript, creating software that solves problems
Things I am learning: Ruby, Rails, javascript

If you are interested in having me as visiting craftsman from the 12th to the 16th of April please reply on this mailing list or contact me directly.

Liam McLennan

Now I wait…

Handy Javascript array Extensions – distinct()

liam.mclennan.nospam@nospam.gmail.com (liammclennan) — Fri, 12 Mar 2010 07:32:00 +1000

The following code adds a method to javascript arrays that returns a distinct list of values.

Array.prototype.distinct = function() {
    var derivedArray = [];
    for (var i = 0; i < this.length; i += 1) {
        if (!derivedArray.contains(this[i])) {
            derivedArray.push(this[i])
        }
    }
    return derivedArray;
};

and to demonstrate:

alert([1,1,1,2,2,22,3,4,5,6,7,5,4].distinct().join(','));

This produces 1,2,22,3,4,5,6,7

Note that this implementation of distinct() is dependant upon my implementation of contains.

Handy Javascript array Extensions – contains(…)

liam.mclennan.nospam@nospam.gmail.com (liammclennan) — Thu, 11 Mar 2010 14:29:00 +1000

This javascript adds a method to javascript arrays that returns a boolean indicating if the supplied object is an element of the array

Array.prototype.contains = function(item) {
    for (var i = 0; i < this.length; i += 1) {
        if (this[i] === item) {
            return true;
        }
    }
    return false;
};

To test

alert([1,1,1,2,2,22,3,4,5,6,7,5,4].contains(2)); // true
alert([1,1,1,2,2,22,3,4,5,6,7,5,4].contains(99)); // false

Sneaky Javascript For Loop Bug

liam.mclennan.nospam@nospam.gmail.com (liammclennan) — Wed, 10 Mar 2010 12:57:00 +1000

Javascript allows you to declare variables simply by assigning a value to an identify, in the same style as ruby:

myVar = "some text";

Good javascript developers know that this is a bad idea because undeclared variables are assigned to the global object, usually window, making myVar globally visible. So the above code is equivalent to:

window.myVar = "some text";

What I did not realise is that this applies to for loop initialisation as well.

for (i = 0; i < myArray.length; i += 1) {

}

// is equivalent to


for (window.i = 0; window.i < myArray.length; window.i += 1) {

}

Combine this with function calls nested inside of the for loops and you get some very strange behaviour, as the value of i is modified simultaneously by code in different scopes. The moral of the story is to ALWAYS declare javascript variables with the var keyword, even when intialising a for loop. This way i is scoped to the current function.

for (var i = 0; i < myArray.length; i += 1) {

}

Documenting the Success Scenario

liam.mclennan.nospam@nospam.gmail.com (liammclennan) — Thu, 04 Mar 2010 11:07:00 +1000

Posts like my intro to jQuery client-side templates may appear, at first glance, to add nothing to the existing body of knowledge. However, the trouble that I regularly encounter with technical documentation is that the author tries too hard to be exhaustive. When first approaching a new topic the reader is most interested in the success scenario. Under normal conditions, how would I use this technology? What is the most basic syntax?

A great example of documentation that focuses on the core usage of a technology is Joel Spolsky’s excellent Hg Init. The top level topics are: Subversion Re-education, Ground up Mercurial, Setting up for a Team, Fixing Goofs, Merging and Repository Architecture. These are exactly the things I want to know about as a Hg newbie.

Much as we describe software functionality with user stories, the best introductory documentation is grouped by ‘what is the reader trying to do’, instead of alphabetical or chronological groupings. Once the reader has a working knowledge of the topic then exhaustive reference documentation becomes useful.

jQuery client-side templates with jqote and Asp.Net MVC

liam.mclennan.nospam@nospam.gmail.com (liammclennan) — Wed, 03 Mar 2010 17:48:00 +1000

Why Use Client-side Javascript Templates?

When building rich internet applications you often need to construct html on the client. I am going to demonstrate how to construct DOM elements using the jqote jQuery plugin (2.0.0).

The naive approach to client-side html generation is to embed html inside javascript like:

var text = 'Some text';
$('body').append($('<div id="content>' + text + '</div>"'));

This approach fails as the complexity of the html increases. It is also a clear separation of concerns violation to mix html (presentation) with script (interaction).

Javascript templates provide a way to dynamically build html on the client while storing the dynamic html with the rest of the presentation markup. Additionally javascript templates provide MVC-like separation of concerns.

Dynamically Building a Table with a Client-side Javascript Template

Suppose you want a web page that allows the user to build a table of people. For each person the user can enter their name and age. First we need a form to collect the values, and we need some jQuery magic to cancel the form post:

<form id="people_input">
        <label for="name">Name: </label><input type="text" name="name" /><br />
        <label for="age">Age: </label><input type="text" name="age" /><br />
        <input type="submit" value="Add" />
    </form>

    <script type="text/javascript">

        $(document).ready(function () {

            $('form#people_input').submit(function (e) {
                e.preventDefault();
            });

        });    
    
    </script>

There needs to be a table to display the people, and each time the form is submitted a new row should be added to the table. jqote templates are defined in the html by wrapping the template in a script tag and a CDATA tag. The script tag is necessary to stop the template from being interpreted as part of the page. The CDATA tag is required so that the page remains syntactically valid. Here is my empty table and a template for a row:

<table id="person_table">
        <tr>
            <th>Name</th><th>Age</th>
        </tr>    
    </table>

    <script type="text/html" id="template">
    <![CDATA[
        <tr>
            <td><$= this.name $></td><td><$= this.age $></td>
        </tr>    
    ]]>
    </script>

The default jqote tags use <%= %> syntax which I have replaced with <$= $> to avoid conflict with Asp.Net MVC. Inside of a jqote template ‘this’ refers to the data object used to render the template. Within the jqote tags any javascript is valid since jqote is based on John Resig’s Javascript Micro-Templating.

The final, and most interesting step is to render the template each time the form is submitted and insert the result at the end of the table. Note the second parameter to the jqote() method, which is the character to use for the html nugget syntax.

        $(document).ready(function () {

            $('form#people_input').submit(function (e) {
                var data = { name: $('input[name=name]').val(), age: $('input[name=age]').val() };
                $('table#person_table').append($('#template').jqote(data, '$'));
                e.preventDefault();
            });

        });

To try out the complete code, grab it from codepaste.net.

Looking at Languages (C#, Javascript & Ruby) 3: Classes

liam.mclennan.nospam@nospam.gmail.com (liammclennan) — Fri, 27 Nov 2009 09:04:00 +1000

Javascript does not have classes in the traditional sense, but we can achieve something similar in a number of ways. C# and Ruby both have standard class syntax.

This post is part of a series comparing the language features of the C#, Javascript and Ruby programming languages.

C#

public class Vehicle
    {
        protected string Make { get; private set; }
        protected string Model { get; private set; }

        public Vehicle(string make, string model)
        {
            Make = make;
            Model = model;
        }

        public virtual void Print()
        {
            Console.WriteLine(GetDescription());
        }

        protected string GetDescription()
        {
            // string formatting syntax             return string.Format("Make: {0}  Model: {1}", Make, Model);
        }
    }

    public class Helicopter : Vehicle   // inheritance syntax     {
        public int NumberOfRotorBlades { get; private set; }

        public Helicopter(int numberOfRotorBlades, string make, string model)
            : base(make, model)
        {
            NumberOfRotorBlades = numberOfRotorBlades;
        }

        public override void Print()
        {
            // string concatenation syntax             Console.WriteLine(GetDescription() + " Number of Rotor Blades:" + NumberOfRotorBlades);
        }
    }

Javascript

Class:

// declare vehicle 'class' var vehicle = function(seed) {
  var that = {};
  
  // private method     var getDescription = function() {
    return "Make: " + seed.make + "  Model: " + seed.model;
  };

  // public method   that.print = function() {
    alert(getDescription());
  };

  return that;
};

// instantiate a vehicle var magna = vehicle({
  make: 'Mitsubishi',
  model: 'Magna' });  magna.print();

Derived class:

 // declare helicopter 'class' var helicopter = function(seed) {
  var that = {};
  that.prototype = vehicle(seed);

  var getDescription = function() {
    return "Make: " + seed.make + "  Model: " + seed.model;
  };
  
  that.print = function() {
    alert(getDescription() + " Number of Rotor Blades:" + seed.numberOfRotorBlades);
  };

  return that;
};

// instantiate a helicopter var ah64 = helicopter({
  make: 'Hughes Helicopters',
  model: 'AH-64',
  numberOfRotorBlades: 4 });  ah64.print();

Ruby

 class Vehicle    def initialize(make, model)     @make = make;
    @model = model;
  end

  def print
    puts get_description
  end

private

  def get_description
    return "Make: #{@make} Model: #{@model}"   end  end  magna = Vehicle.new('Mitsubishi', 'Magna')
magna.print

class Helicopter < Vehicle

  def initialize(make, model, number_of_rotors)
    super(make, model)
    @number_of_rotors = number_of_rotors
  end

  def print
    puts get_description + " Number of Rotors: #{@number_of_rotors}"   end  end  ah64 = Helicopter.new("Hughes Helicopters", "AH-64", 4)
ah64.print