UpStruct

Developing Real-Time Web Applications with SignalR

2013-12-13T13:06:00.000+02:00

Developing Real-Time Web Applications with SignalR

This is the second full day session I gave this week. This one was about Building Real-Time Web Applications with ASP.NET SignalR, as part of Expert Days 2013 event, held by E4D at Kfar Hamacabia.

Thanks for everyone who came, participated, and contributed...

Slide Deck

You can download the slide deck from here, or if you like, view it directly from here.

Code Demos

All the demos are available to download from here.

Enjoy,
Yaniv

Building RESTful Services with Web API

2013-12-11T22:45:00.003+02:00

Building RESTful Services with Web API

Early this week I gave a full day lecture about Building RESTful Services with ASP.NET Web API, as part of Expert Days 2013 event, held by E4D at Kfar Hamacabia.

Thanks for everyone who came, participated, and contributed...

Slide Deck

You can download the slide deck from here, or if you like, view it directly from here.

Code Demos

All the demos are available to download from here.

Enjoy,
Yaniv

Expert Days 2013

2013-11-30T18:54:00.001+02:00

Expert Days 2013

In the up-coming Expert Days 2013 event, taking place about a week from now, I'm going to give 2 sessions:

1. RESTful Services with Web API
2. Building Real-Time Web Applications with SignalR

The details can be found here:
http://www.e4d.co.il/Events/ExpertDays2013/Home/Trainer/Yaniv-Yechezkel

Hope to see you there,
Yaniv

Quick Tour to Front-End Unit Testing

2013-10-17T11:25:00.000+03:00

Quick Tour to Front-End Unit Testing Presentation

This week I gave a presentation about Java Script Unit Testing at the Front-End.IL User Group which was hosted at NICE's auditorium at Ra`anana.

We've talked about the motivations for doing Unit Testing in this era of Single Page Applications with tons of lines of code, and then we drilled down to QUnit, Sinon, and JSTD...

You might find it helpful to go over the series of posts below while you're going over the demos.

JavaScript Unit Testing in Visual Studio:

- Part I - JavaScript is all around
- Part II - Setting up the Environment for Headless Tests

- Part III - Testing Require.JS Modules

Slide Deck

You can download the Slide Deck from here, or view it directly from here.

Demos

Also, the demos can be downloaded from here.

Thanks to Gil Fink for organizing these meetups. :)

Enjoy,
Yaniv

NHibernate HiLo Identity Generator on SQL Azure

2013-07-04T18:07:00.000+03:00

NHibernate POID Generators

NHibernate supports several POID (Persistent Object ID) Generators, including: Identity, Guid, Guid.Comb, and HiLo.

You can find a good explanation here, about the various strategies.

Avoiding Identity and going with Guid.Comb or HiLo is a good practice, but there's a slight problem when your Database is SQL Azure...

HiLo

HiLo, similar to Guid.Comb, generates the Ids disconnect from the Database, but in contrast it takes less space, and is human readable.

You might find this article very helpful.

Defining an Entity to work with HiLo using Fluent NHibernate might look something like this:

public class ProdcutMap: ClassMap<Prodcut>
{
   public ProdcutMap()
   {           
      Id(x => x.Id).GeneratedBy.HiLo(100);
      ...
   }
}

And if you prefer the conventions way, the previous example would translate to something like:

public class HiLoIdConvention: IIdConvention
{               
   public void Apply(IIdentityInstance instance)
   {
      Id(x => x.Id).GeneratedBy.HiLo(100);
   }
}

Problem

Out of the box, the NHibernate HiLo Identity Generator will not work with SQL Azure, as SQL Azure will insist on having a Clustered Index on the table, something that the default implementation doesn't take into account.

As soon as the schema will be generated on the Database, and it will hit the line where it's inserting the default value, you'll get an exception.

Solution

I think the preferred solution would be to use an SQL Azure Dialect, but since it's not built into NHibernate, as long as I know, the second best approach would be to create a custom Identity generator.

Ended up with a Custom Generator:

class AzureCompliantTableHiLoGenerator: TableHiLoGenerator
{           
    public override string[] SqlCreateStrings(NHibernate.Dialect.Dialect dialect)
    {            
        IList<string> script = new List<string>();

        script.Add(string.Format("create table {0} ( {1} {2}, {3} varchar(128) not null )", HiLoIdConvention.NHibernateHiLoIdentityTableName, 
                                                                                            HiLoIdConvention.NextHiValueColumnName, 
                                                                                            dialect.GetTypeName(this.columnSqlType),
                                                                                            HiLoIdConvention.TableColumnName));

        script.Add(string.Format("create clustered index IX_{0}_{1} on {0} ( {1} asc );", HiLoIdConvention.NHibernateHiLoIdentityTableName,
                                                                                            HiLoIdConvention.TableColumnName));
                        
        script.Add("go");            

        return script.ToArray();            
    }

    public override string[] SqlDropString(NHibernate.Dialect.Dialect dialect)
    {
        return new string[] { dialect.GetDropTableString(HiLoIdConvention.NHibernateHiLoIdentityTableName) };
    }
}

An Id Convention:

public class HiLoIdConvention: IIdConvention
{      
    private const string TableParamName = "table";
    private const string ColumnParamName = "column";
    private const string MaxLoParamName = "max_lo";
    private const string WhereParamName = "where";
        
    public const string NHibernateHiLoIdentityTableName = "NHibernateHiLoIdentity";
    public const string NextHiValueColumnName = "NextHiValue";
    public const string TableColumnName = "Entity";
    public const int MaxLo = 10;
 
    public void Apply(IIdentityInstance instance)
    {                   
        instance.GeneratedBy.Custom(typeof(AzureCompliantTableHiLoGenerator),
                                    builder => builder.AddParam(TableParamName, NHibernateHiLoIdentityTableName)
                                                        .AddParam(ColumnParamName, NextHiValueColumnName)
                                                        .AddParam(MaxLoParamName, MaxLo.ToString())
                                                        .AddParam(WhereParamName, string.Format("{0} = '[{1}]'", TableColumnName, instance.EntityType.Name)));             
    }

    public static void CreateHiLoScript(NHibernate.Cfg.Configuration config)
    {
        var script = new StringBuilder();

        script.AppendFormat("delete from {0};", NHibernateHiLoIdentityTableName);

        script.AppendLine();

        script.AppendLine("go");

        script.AppendLine();

        foreach (var tableName in config.ClassMappings.Select(m => m.Table.Name).Distinct())
        {
            script.AppendFormat(string.Format("insert into [{0}] ({1}, {2}) values ('[{3}]',1);", 
                                                NHibernateHiLoIdentityTableName, 
                                                TableColumnName, 
                                                NextHiValueColumnName, 
                                                tableName));

            script.AppendLine();
        }

        config.AddAuxiliaryDatabaseObject(new SimpleAuxiliaryDatabaseObject(script.ToString(), 
                                                                            null, 
                                                                            new HashedSet<string> 
                                                                            { 
                                                                                typeof(MsSql2000Dialect).FullName, 
                                                                                typeof(MsSql2005Dialect).FullName, 
                                                                                typeof(MsSql2008Dialect).FullName 
                                                                            }));
    }
}

And my Bootstrapper code, removed most of it for brevity, looks something like this:

public static class Bootstrapper
{    
    private const string ConnectionStringName = "MyDB";
    
    public static void RegisterTypes(IUnityContainer container)
    {
        CreateAndRegisterSessionFactory(container);
        ...
    }
    
    private static void CreateAndRegisterSessionFactory(IUnityContainer container)
    {
        NHibernate.Cfg.Configuration configuration = Fluently.Configure()                
                                                                .Database(DefineDatabase)
                                                                .Mappings(DefineMappings)
                                                                .ExposeConfiguration(HiLoIdConvention.CreateHiLoScript)                                                                    
                                                                .BuildConfiguration();

        CreateSchema(configuration);

        ISessionFactory sessionFactory = configuration.BuildSessionFactory();

        container.RegisterInstance<ISessionFactory>(sessionFactory);
    }
   
    private static IPersistenceConfigurer DefineDatabase()
    {                
        return MsSqlConfiguration.MsSql2008
                                    .ConnectionString(x => x.FromConnectionStringWithKey(ConnectionStringName));                                                                 
    }

    private static void DefineMappings(MappingConfiguration mapping)
    {
        mapping.FluentMappings                   
                .AddFromAssemblyOf<ProductMap>()
                .Conventions.Add<HiLoIdConvention>();
    }
    
    private static void CreateSchema(NHibernate.Cfg.Configuration configuration)
    {
        SchemaExport schemaExport = new SchemaExport(configuration);          

        schemaExport.Drop(false, true);
        schemaExport.Create(true, true);                        
    }
}

It works fine, no complaints.... But still, would be glad find out that NHibernate supports an Azure Dialect, or that there is already some Library that I can use instead...

Developing Real-Time Web Apps with SignalR

2013-06-20T16:32:00.002+03:00

Developing Real-Time Web Apps with SignalR Presentation

SignalR is a new async signaling library for .NET developed and maintained by David Fowler and Damian Edwars from Microsoft’s ASP.NET and NuGet teams.

If you ever wanted to push data from the server to clients (and not just browser clients!) in real time with ease, SignalR will be your perfect companion.

Slide Deck

This week I gave a presentation about SignalR at the JS-IL Event, a conference held by E4D.
You can download the Slide Deck from here, or view it directly from here.

Enjoy,
Yaniv

Advanced JavaScript Unit Testing

2013-06-20T16:30:00.002+03:00

Advanced JavaScript Unit Testing - Presentation

Unit Testing is an inseparable part of the development process, no matter which methodology you follow, be it TDD, or BDD, you know for sure that this investment is worthwhile, enabling early bug fixes, safe refactoring, and better design.

You want to test your JavaScript code but don’t know where to start? Which tools to pick? And how to integrate it all with your IDE?

Let's take a look at the tools. Let's see how to combine them to play nicely together in, and hopefully, try making Testing a breeze.

Slide Deck

This week I gave a presentation about Unit Testing at the JS-IL Event, a conference held by E4D.
You can download the Slide Deck from here, or view it directly from here.

Enjoy,
Yaniv

Building Modular JavaScript Application with AMD and RequireJS

2013-06-20T16:28:00.003+03:00

Building Modular JavaScript Application with AMD and RequireJS Presentation

The rule of thumb when things get complex is usually to break it down to smaller, more manageable, and loosely coupled units.

Yet, JavaScript (or say ECMAScript) in its current form, doesn't provide any so-called concept of Module or Package or any kind of logical unit of deployment.

This is where AMD (Asynchronous Module Definition), and Require.JS comes into play.

With Require.JS, you can lay out a solid, scale-able architecture, and come up with maintainable and testable units of code.

Slide Deck

This week I gave a presentation about Require.JS at the JS-IL Event, a conference held by E4D.
You can download the Slide Deck from here, or view it directly from here.

Enjoy,
Yaniv

Mobile App Development with PhoneGap

2013-06-20T16:24:00.003+03:00

Mobile App Development with PhoneGap Presentation

The Mobile World certainly have changed the way we consume data and services, and mobile devices have long become an integral part of our everyday life.

PhoneGap is a free and open source framework that allows you to create mobile apps using web standards for 7 different platforms including iOS, Android, Blackberry, and Windows Phone.

With PhoneGap you can cut down on development time by re-using your existing web development skills, frameworks and tools, and get all the benefits of cross-platform development while building apps just the way you like.

Leverage your HTML, CSS and JavaScript skills to create platform-neutral mobile applications with PhoneGap.

Slide Deck

This week I gave a presentation about PhoneGap at the JS-IL Event, a conference held by E4D.
You can download the Slide Deck from here, or view the slide show here.

Enjoy,
Yaniv

Israel JavaScript Conference

2013-04-17T00:11:00.001+03:00

First Israel JavaScript Conference

JavaScript is all over the place. Client-Side, Server-Side, Mobile...
And with the boost it has got from HTML 5.0, and the tremendous performance improvements it went through in last couple of years, it is just the right time to get deeper into this language, and get to know it better, because it's here to stay for a while...

I, personally, think that this conference is a MUST, and I've been looking forward to it for a while now...

I'm going to give 4 sessions:

- Mobile App Development with PhoneGap
- Building Modular JavaScript Application with AMD/Require.JS
- Advanced JavaScript Unit Testing integrated with Visual Studio Environment
- Developing "Real-Time" Web Applications with SignalR

Check out the conference web-site. Sure you'll find some interesting sessions...

A First Look at SignalR

2013-02-26T02:35:00.000+02:00

Introduction

I stumbled upon SignalR just about 2 months ago, while looking for some abstraction over Web-Sockets with a fallback to other transports for older User Agents.

Back then I've already heard, and read a little about Socket.IO, and Node.JS, but wanted a .NET library for my upcoming project.

So when I've landed on the SignalR project page, and read about what SignalR is all about, and how can it be used, I was VERY exited.

So, if you are into "Real-Time Web", and looking for an ASP.NET, IIS hosted solution, then SignalR is the answer for all your prayers, and more (as I'm learning each day I'm diving deeper into it...).

Getting Started with SignalR

In order to put your hands on SignalR and start coding against the API, you'll first need to set up the environment and get the project's libraries.

IIS 8.0

Although not required for development and testing, pay attention that Web-Sockets are only supported on IIS starting with IIS 8.0. This means that in order to gain the full benefits that SignalR provides you should deploy your solution to Server 2012 (which is of course available for both PaaS and IaaS on Azure).

For development and testing you can use IIS 8.0 Express, which is bundled with Visual Studio 2012.

I've used this opportunity, along with the concept of starting a new year, to install Windows 8 and Visual Studio 2012. Windows 7 was great, but Windows 8 is even greater...

Visual Studio 2012

You'll need Visual Studio 2012. Or at least the Visual Studio 2012 Express Version, which is free to download from the Asp.Net website.

SignalR Lib

2 months ago, I've downloaded version RC1, and it was available as a zip package from the project's site. This option is still viable, although it is also available as a Nuget package, or better yet as part of the 2012.2 update.

Earlier this month, on February 18, Scott Guthrie announced the final release of ASP.NET and Web Tools 2012.2 Update. This update, among other exiting new stuff, contains all the necessary components for SignalR development.

A Getting Started Tutorial

You can find a great step-by-step introductory tutorial on the Asp.Net website, here, along with some great videos demonstrating this new framework. Don't skip those videos.

So far I've done a simple POC, deployed it to a Web-Role on Windows Azure, and it works like charm.

In my upcoming posts I'll start investigate SignalR, and get a look deeper into the Transports, Scale-Out on Windows Azure, Security issues, and basically look behind the Magic...

The Future of WCF

2013-02-23T01:56:00.000+02:00

A Retrospective

Back then, somewhere in 2006, when Windows Communication Foundation was born, with the exotic code name "Indigo" I was a .NET trainer. And also 7 years younger... but who counts...

These where the days of Windows Vista, Visual Studio 2005, Web Forms, Ajax, and XML Web Services.

Giving countless training and lecture hours on WCF, I still remember the slide in the MOC showing ASP.Net Web Services, WSE (Web Service Extensions), COM+, DCOM and Remoting, and then the animation minimizing all those putting WCF right in the middle and emphasizing Consolidation.

It was a huge step in evolution, and it let you select one framework to nail all your problems.

A Snapshot

Over time WCF has been bent toward being more RESTFULLY, and with its almost unlimited extensibility we've been able to take control over messaging, roll out custom security models to feet our needs, and run it with ASP.Net compatibility to employ the ASP run-time which is more suitable for web.

The WCF REST Starter Kit didn't get so far, and the WCF Web API has been eventually merged into ASP.Net and became ASP.Net Web API...

Today, it is not that obvious anymore that WCF will play the role of running your endpoints. As ASP.Net with its Controllers, Web API and SignalR Hubs has gone a long way since, as far as it relate to HTTP, REST, and HTML 5.0 standards.

I know there is no breaking news here, but still... I recently started a new project without considering WCF to be part of the stack. It seemed weird, and raised some more questions and wondering regarding the future of WCF...

JavaScript Unit Testing in Visual Studio Part III

2013-02-16T03:47:00.000+02:00

Testing Require.JS Modules

This is the 3rd post in this series, talking about JavaScript Unit Testing in Visual Studio.

In the first post we've set up the expectations, and one of them was compatibility with Require.JS, and in the previous post, we've went all the way from downloading the libraries, to running headless tests against multiple browsers from Visual Studio.

In this post we'll take it another step toward a modular application, and check out how this can also get tested with the stack we've already discussed.

Tackling Complexity With Require.JS

So, if you're not already using Require.JS and asking yourself how could you go without it, let's see what problems it solves and why you should use it.

Simply put, Require.JS is a JavaScript file and Module Loader, at least this is what stated on it's homepage.

Since JavaScript doesn't provide, yet, a mechanism to define modules, developers usually go with the Module Pattern, or do object nesting to get something that can remind a namespace in other language, like C# for example.

Both techniques are good in the sense that both provide some kind of encapsulation and scope, and keep the global namespace (the Window object) clean.

So what are the benefits you get by moving to Require.JS? Some of them might be:

First and most important, you get decoupling between modules.
All the headache of finding the exact order to load script because of dependencies is gone, as it will resolve dependencies automatically.
If you're building SPAs (Single Page Applications), you can utilize text plugin to load markup fragments on-demand, compile them and render them on the client. Works great with Underscore and BackBone.JS.

I hope it's enough to get you motivated, so let's see how to use it. I'll continue from where we stopped in the previous post, assuming you followed and got the project running...

Download the Libraries

Go and download Require.JS.
Although not directly relevant for the purpose of this post, I would really recommend also getting the other plug-ins that come along with it.
Add Require.JS to the project, and place it under Scripts/libs/require.

Defining a Module

The only code we had was the Calculator, residing in the calculator.js file, so go and open the file, and refactor the code to look like the snippet below:

define([
    "jquery"
], function ($) {

    var Calculator = function () {
        this.sum = function (num1, num2) {
            if (num1 == undefined || num2 == undefined) {
                throw "Invalid argument";
            }
            return num1 + num2;
        }
    };

    return Calculator;
});

We've defined Calculator as a module, with a dependency on another module, in this case it's jQuery.
Also, you can see the module return a closure to Calculator.
In some cases you might prefer to return an already instantiated object.

Defining the Bootstrapper

Next, will configure the main entry point for Require.JS, so go and append a JavaScript file under the Scripts library, in the root, and call it bootstrapper-js-test-driver.js.

Open the file and copy the code snippet below:

require.config({
    
    // jsTestDriver serves all files from a test directory, so base URL must reflect it by
    // a relative /test prefix.
    baseUrl: "/test/Scripts",

    paths: {
        jquery: "libs/jquery/jquery-1.8.3.min",
        domReady: "libs/require/domReady",
        text: "libs/require/text",
        order: "libs/require/order"        
    }

});

require([
    "jquery"        
], function ($) {
    
    // Prevent Fake Timers by default.    
    sinon.config.useFakeTimers = false;

});

Pay attention to the inline comment, regarding the /test prefix.
Remove any unused libraries from the paths section.

At this point, after adding the libraries and bootstrapper, your project structure is supposed to look similar to the one in the screenshot below:

Define the Unit Test as a Module

Next, open the calculator-tests.js file, and also wrap it as a module.

The code should be similar to the code snippet below:

require([
    "jquery",    
    "modules/calculator"
], function ($, Calculator) {

    module("Calculator Tests", {
        setup: function () {    
        },    
        teardown: function () {    
        }
    });

    test("Sum", function () {
        // Arrange
        var calculator = new Calculator();
        // Act
        var sum = calculator.sum(2, 3);
        // Assert
        equal(5, sum);
    });

});

As you can see, as opppsed to other modules, test modules should be defined with require, and not with define, as they are running as standalone modules, and acts as an entry point for jsTestDriver.

You can see that jQuery and the Calculator module, are now being passed as dependencies.

Configuring JS-Test-Driver

Next, load jsTestDriver.conf, and modify it:

Under the load section, add an instruction to load Require.JS, and the boostrapper.
Add another section , serve, this section is used for static resources.
Move calculator.js from the load to the serve section.

After the modification it should look like this:

server: http://localhost:9876

basepath: ""

load:      
  - Scripts/libs/jquery/jquery-1.8.3.min.js
  - Scripts/libs/qunit/qunit-1.10.0.js
  - Scripts/libs/sinon/sinon-1.5.0.js
  - Scripts/libs/sinon/sinon-qunit-1.0.0.js
  - Scripts/libs/sinon/sinon-ie-1.5.0.js
  - Scripts/libs/js-test-driver/equiv.js
  - Scripts/libs/js-test-driver/QUnitAdapter.js
      
  - Scripts/libs/require/require.js
  - Scripts/bootstrapper-js-test-driver.js

test:    
  - Scripts/tests/calculator-tests.js
  
serve:
  - Scripts/modules/calculator.js

Go on and run the tests, and make sure it all works as expected.
And that's it, you've put all your code, both source and tests, to act as independent, decoupled modules.

Summary

You should now be comfortable with writing and running unit tests in Visual Studio, with the knowledge and the confident that you can leverage all your unit testing skills and apply them without any compromise or any limitation set by JavaScript or Visual Studio.

Are you still here? What are you waiting for? Go and write some tests...

JavaScript Unit Testing in Visual Studio Part II

2013-02-12T02:20:00.000+02:00

Setting up the Environment for Headless Tests

In the previous post, we've set up the scene, by setting the expectations and picking the libraries & tools for the job.

In this post we will take it step-by-step, so you can follow and get active in the process.

So here we go...

Prerequisites

Visual Studio.
You can even download the Web Express Edition.
Java Run time.
You'll need it to run the JS-Test-Driver later, as it's a Jar file.

Set Up the Project

We'll start by creating an empty Web Project. So, launch your Visual Studio, and create a new Web Project. Select ASP.NET MVC Web Application, name it JavaScriptTesting or whatever makes you happy, and make sure to select an Empty template on the second step in the Wizard.

Feel free to delete all items under the Content and Scripts project folders.
Go even further, and delete the packages.config file automatically added by Visual Studio and the packages folder in the solution root on the disk.
Just so we can concentrate on what really matters... (Nothing personal against NuGet).

Under the Scripts folder,go and create three sub-folders and name them: libs, modules, and tests.

At the moment your solution tree should look similar to the one in the screenshot below.
Nothing special yet, a naked MVC project with minimal elements.

NOTE: In your development environment you might not like the idea of having the source code and tests under the same project. You can of course place the tests in a separate project, and as the concept of adding a reference to a js file doesn't exist, and we would not want to duplicate source files, you can accomplish that by defining a pre-build event on the tests project to copy all the stuff you wanna test.

In this post, for brevity, a single project holding both source and tests will suffice...

Download the Libraries

Let's go and grab all the libraries.

QUnit

QUnit - Get both js and css, and place them under a Scripts/libs/qunit.

Sinon.JS

Sinon.JS - Save the js under a sinon folder beneath Scripts/libs/sinon.
Sinon Adapter for QUnit - Save it also under the sinon folder.
Make sure to also get the Sinon-IE.js. It is for compatibility for IE when Timers & fake XHR is used. While on Sinon.JS site, navigate to the Fake XMLHttpRequest section under the documentation and look for sinon-ie.js.

JSTD

JSTD (JS Test Driver) - Navigate to the downloads page and look for JsTestDriver-1.3.5.jar. Download and add it to the project root folder.
QUnit to JsTestDriver Adapter - Download both QUnitAdapter.js and equiv.js, and place them under Scripts/libs/js-test-driver.

jQuery

Get a fresh copy of jQuery and also place it under a new folder - Scripts/libs/jquery.

At the moment your solution tree should look similar to the one in the screenshot below, and your solution folder should contain the project folder and the JSTD jar file.

We will leave Require.js aside for now, to be discussed in a later post in this series.
So, for now, we've got all the libraries we need to start with.

The Unit Under Test

In order to run unit tests, we first need some kind of unit. So let's create a very simple component to play around with.

Create a new calculator.js file, under Scripts/modules, with the code snippet below:

var Calculator = function () {
    this.sum = function (num1, num2) {
        if (num1 == undefined || num2 == undefined) {
            throw "Invalid argument";
        }
        return num1 + num2;
    }
};

This should be enough, as now we can go on and test the sum method.

Unit Test

Next, create a new js file under Scripts/tests and name it calculator-tests.js, with the code snippet below:

module("Calculator Tests", {
    setup: function () {    
    },    
    teardown: function () {    
    }
});

test("Sum", function () {
    // Arrange
    var calculator = new Calculator();
    // Act
    var sum = calculator.sum(2, 3);
    // Assert
    equal(5, sum);
});

We've created a Module named Calculator Tests, with a single test named Sum, which in we instantiate the Calculator, call the Sum method, and simply Asserts for the expected result.

Configuring JS-Test-Driver

Js-Test-Driver, expects a configuration file in a YAML format. For more about the Configuration File settings see here.

Create a text file in Visual Studio, name it jsTestDriver.conf, and place it in the project root, just next to the Js-Test-Driver jar file.

Copy the snippet below to the file:

server: http://localhost:9876

basepath: ""

load:      
  - Scripts/libs/jquery/jquery-1.8.3.min.js    
  - Scripts/libs/qunit/qunit-1.10.0.js      
  - Scripts/libs/sinon/sinon-1.5.0.js
  - Scripts/libs/sinon/sinon-qunit-1.0.0.js
  - Scripts/libs/sinon/sinon-ie-1.5.0.js      
  - Scripts/libs/js-test-driver/equiv.js
  - Scripts/libs/js-test-driver/QUnitAdapter.js      
    
  - Scripts/modules/calculator.js

test:    
  - Scripts/tests/calculator-tests.js

If you've placed JsTestDriver outside the project, replace the basepath to reflect the path to the folder containing JsTestDriver-1.3.5.jar.
If using other versions of the libraries under the load section, then rename accordingly.

Customize the Tools Menu

We're almost there...

JS-Test-Driver can be executed from the command line, but we wanted seamless integration with Visual Studio, so let's create custom menu entries so we can run those tests with no more than a few keystrokes.

Menu Item for launching the Server

Open the External Tools under the Tools menu.
Click Add, to add a new entry in the menu.
Set "JSTD Server" for the Title.
Set the full path to jave.exe.
In my case it is "C:\Program Files (x86)\Java\jre7\bin\java.exe".
Set the Arguments to:
-jar JsTestDriver-1.3.5.jar --port 9876 --browser "C:\Program Files (x86)\Internet Explorer\iexplore.exe","C:\Program Files (x86)\Google\Chrome\Application\chrome.exe"

I've set it to run both IE and Chrome.
Make sure to point to the correct path on your system.
Set Initial Directoryto $(ProjectDir)
Check Close on exit.
Click OK to Save.

It should look similar to the screenshot below:

Menu Item for running Tests

Open the External Tools under the Tools menu.
Click Add, to add a new entry in the menu.
Set "JSTD &Run" for the Title.
Set the full path to jave.exe.
In my case it is "C:\Program Files (x86)\Java\jre7\bin\java.exe".
Set the Arguments to:
-jar JsTestDriver-1.3.5.jar --server http://localhost:9876 --tests all --testOutput "jsTestDriver-TestResults" --verbose
Set Initial Directory to $(ProjectDir)
Check Use Output window.
Save settings.

It should look similar to the screenshot below:

And that's it.

Running The Tests

From the Tools menu, click on JSTD Server.
It will launch a new command, and you'll see new windows/tabs added to both Chrome and IE.
Now go and hit Tools menu, and then JSTD Run, or just Alt+T+R.

NOTE: When the solution contains more than one project, make sure to select the project before running the JSTD Server or the tests. As the $(ProjectDir) will instruct Visual Studio to look for the the Jar file under the selected project.

Tests will get executed, and you'll be able to see the results in the Output Window:

You've made it. You have just executed your first JavaScript Unit Tests in Visual Studio.
And you can see that both tests passed.

You should leave the JSTD Server running, and the browsers waiting, and just hit Alt+T+R when changing the code...

What We've accomplished

Seamless integration with Visual Studio.
Headless testing.Against multiple browsers at the same time.
Support for Async Tests.
(More about it in future post).
Documented libraries & Tools.
Free Tools.

What's Next?

In the next posts we will talk about AMD and we will see how to combine JS-Test-Driver and Require.JS to play nicely together.

Have fun testing...

NServiceBus Configuration Schema

2013-01-30T12:08:00.000+02:00

Who Likes Configuration Files?

Configuration files got a bad reputation in .NET and most developers don't like messing around with configuration files. They'll prefer Fluent NHibernate when it comes to mapping files, and a lot have been said about WCF configurations complexity and the "pain that is gone" with WCF 4.0.

Going against that stream, I felt an XSD for NServiceBus is missing...

NServiceBus Configurations

NServiceBus promotes convention over configuration, and provides an elegant way with it's fluent configuration coding style to achieve most of what you need without messing with those config sections.

But nevertheless, there are things you might choose to define in configuration, especially those dynamic settings that happened to get changed frequently.

Being it an open source it was straight forward to get the code and go over all the custom config section classes in NServiceBus assemblies and come up with an XSD file that can be referenced from Visual Studio and provide tooltips and intellisense.

For now, you can download it from here nservicebus-configuration.xsd.
In the future I hope it will find its way to the NServiceBus project.

It has already saved me a lot of time in my current project, and I hope you'll find it useful as well.

JavaScript Unit Testing in Visual Studio Part I

2013-01-28T21:36:00.000+02:00

JavaScript is all around

If you're building complex SPAs (single page applications) with ASP.NET MVC, or native-like Apps for smartphones using frameworks like PhoneGap (yeah, yeah it's Cordova now, just that PhoneGap sounded much better) or alike, then JavaScript plays a big role in your day to day work. Not to mention Node.JS and Windows 8 Metro Style Applications...

The days where JavaScript has been used for small client-side manipulation, and jQuery alone was enough to overcome browser compatibility issues is long gone.

And with the boost of HTML5, and tremendous improvements in performance in modern web browsers, you can say what you want, but C# is not enough anymore.

That being said, how should we tackle complex projects where JavaScript lines of code are running high?

Unit Testing, in that sense, can help by keeping complex things more simple.

If you are an architect in a project, and you aim for quality, then you got to give your teams the right tools to come up with maintainable projects.

Picking The Tools

When you go out there and pick your JavaScript libraries for your next project, and I must admit it becomes a very nontrivial task those days with libraries like jQueryMobile, Backbone.JS, KnockOut, AngularJS and many more..., then you should also take into account those libraries that will assist you and your team to write and run your unit tests in your development environment.

As a .Net architect, my main development environment is Visual Studio, so my goal was to come up with a set of libraries that will allow me and teams I work with to do unit testing in Visual Studio, pretty much in same way we've been doing it with other .Net Unit Testing libraries.

Let's set the expectations

What do we want to accomplish?

Seamless integration with Visual Studio.
So we can run tests without leaving the IDE.
(In any case, this is the Post's title right?)
Headless testing.
Against multiple browsers at the same time if possible.
Later we will want to take it a step forward and automate it as part of CI (Continuous Integration), right?
Support for AMD (Asynchronous Module Definition) / Require.JS.
Support for Async Tests.
Documented libraries & Tools.
Free Tools are preferred.

Libraries & Tools

Eventually I came up with the combination of the tools listed below:

QUnit - Unit Testing Library.
Sinon.JS - Mock Library.
Sinon Adapter for QUnit - Seamless Sinon.JS integration for QUnit.
JSTD (JS Test Driver) - Console Runner (Java).
QUnit to JsTestDriver Adapter - Translates QUnit API to JS Test Driver.

I can definitely say I'm quite happy with this combination.

In following posts of this series I'm going to describe in details how to combine those tools to play together.

What tools/libraries do you use for Unit Testing Java Script in a Visual Studio/TFS development environment?