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”:
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:
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:
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:
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:
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
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
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:
Although we’re building a C# test project today, here’s what the same test would look like in Visual Basic:
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:
Soon I'll create Demo Solution from download.