DCSIMG
Unit Testing with Silverlight 2 - Shai Raiten's Blog

Shai Raiten's Blog

It's all about code...

Unit Testing with Silverlight 2

Unit Testing with Silverlight 2

From Jeff Wilcox post : MIX we released source code to the controls, unit tests, and including a unit test framework that runs in the web browser using Silverlight on the Mac and PC.

The Microsoft.Silverlight.Testing framework is simple, easy-to-use, and will give developers yet another way to increase their productivity and application quality.

The framework is familiar to anyone who’s used the desktop unit testing tools inside Visual Studio Team Test (and also now available with Visual Studio 2008 Professional): the same types and attributes are available for unit testing now in Silverlight.

A PDF of this tutorial is also available for download here.

Option 1: Adding a new project and manually hooking up the test framework

Add a New Silverlight Application to use as a test project

We’ll create a new test project by selecting the File->Add->Project menu item within Visual Studio 2008.  Inside the New Project dialog, drill down into the Silverlight project types and select “Silverlight Application”:

ut2

Note: Make sure not to accidentally select the “Test” project types, since that’s for the desktop framework and not Silverlight.  Silverlight unit test projects are not integrated with Visual Studio, so the integrated test features will not work-Silverlight unit tests run in the web browser host.

We’ll name the project “Test”, although if your solution has many discrete components, you may want to pick a better identifier.  When we click the “OK” button, Visual Studio will ask us to choose the type of application project.  To keep it simple, let’s just use the option to automatically generate an HTML test page:

ut3

After clicking “OK”, we’ll then have 2 projects within the ChatClient solution.  You can switch between the startup projects by right-clicking on either the ChatClient or Test project and choosing “Set StartUp Project”.  Next up, adding the unit test assemblies.

Adding references to the unit test framework

The unit test framework is being provided as a download separate from the SDK, as part of the control source code package that you can download here.

If we place the test framework assemblies in a directory within the solution, we can then add them as references to the test project by going to the Project->Add Reference menu item and then clicking on the “Browse” tab and finding that folder:

ut4

Select all three of the files and click “OK”.

Wiring up the test framework

We now need to make some quick changes to the default project to wire up the test framework:

  • Removing Page.xaml and the Page.xaml.cs code-behind file
  • Updating App.xaml’s code-behind file to create a unit test page

First, highlight the Page.xaml file within the Test project.  Go to the Edit->Delete menu item and when prompted to confirm the operation, select “OK”.

Your Visual Studio solution should now look like this:

ut5

Next, we need to replace the RootVisual with a call to create the test page.  The test page handles preparing the framework, starting up the unit test engine, and then running through test classes found and reporting results on the web page.

To wire up the framework,

  • Add a reference to the namespace Microsoft.Silverlight.Testing
  • Replace the RootVisual with a call to UnitTestSystem.CreateTestPage.  The parameter to the method enables the framework’s test engine to reflect on your test assembly.

Here’s the updated App.xaml.cs:

ut6

Now we’re ready to start adding tests.

Option 2: Adding a new test project using prebuilt templates

It’s much easier to use Visual Studio project templates to do all the work above.  Previously posted about here.

Download the templates
  • SilverlightTestProject.zip (project template, adds a test project Silverlight application to the solution)
    Copy this into your “%userprofile%\Documents\Visual Studio 2008\Templates\ProjectTemplates”
  • SilverlightTestClass.zip (item template, adds a test class to your Silverlight test project)
    Copy this into your “%userprofile%\Documents\Visual Studio 2008\Templates\ItemTemplates”
Add a test project to your solution

To create a new Silverlight test project, with your Silverlight application or class library open:

  • Right-click on the solution
  • Select the Add->New Project menu item
  • Click on the root “Visual C#” project type node
  • Under “My Templates”, select “Silverlight Test Project”, and give your test project a name

NewProjectWithTemplate2

There’s a default test.cs file that you can use as a starting point, or to add additional test classes to your test project in the future, you can:

  • Right-click on the test project
  • Select the Add->New Item menu option
  • Click on the root “Visual C#” category
  • Select “Silverlight Test Class” and provide a name for your new class

AddNewItemTemplate

Adding the first test

All that’s left for us to do now is start adding unit tests.  To verify that everything’s hooked up and we can start testing, let’s add a no-op test that will always pass.

Even if you haven’t used the Visual Studio unit test framework before, it’s really easy to pick up since the attributes are self describing:

Add a new class to the test project by going to the Project->Add Class menu item, provide the name “SampleTest.cs” and click “OK”.  Here’s a simple test file:

ut9

Although we’re building a C# test project today, here’s what the same test would look like in Visual Basic:

ut10

Run the unit tests

To run the test project, make sure that it is set as the StartUp project by going to the Project->Set as StartUp Project menu item.  Then, simply press F5 to start debugging (and your web browser).

Since this is a test without any Silverlight controls or interface, nothing is displayed on the plugin’s surface.  Only the test log, created by the HTML DOM bridge feature in Silverlight 2, is displayed.  The log shows the test classes and methods that run, any failures, and a clear indication of the number of tests that ran:

ut11

Soon I'll create Demo Solution from download.

Enjoy

Comments

mukesh sharma said:

Helpfull for me

# September 19, 2008 5:25 AM

Vinney said:

I am having trouble getting the templates installed properly.  I add the files to my documents location: "%userprofile%\My Documents\Visual Studio 2008\Templates\ProjectTemplates\Visual C#".  The installation note just says "copy 'this'".  I don't know whether 'this' means all the contents of the zip file or just the .vstemplate file.  Also, should the folder hierarchy match the visual studio grouping (i.e.: Visual C#\Silverlight)?

Thanks for any help.

Vinney

# February 2, 2009 6:39 PM
Leave a Comment

(required) 

(required) 

(optional)

(required) 


Enter the numbers above: