Attributes-based validation in a WPF MVVM application

.Net, CodeProject, WPF No Comments »

Today, I’m proud to share with you my very first article available on CodeProject. This article presents a technique which can be used in order to add validation in a WPF MVVM application based on attribute. Basically, it means that you can write validation logic like that (notice the attribute associated to this property):

?View Code CSHARP
1
2
3
4
5
6
7
8
9
10
11
12
13
[Required(ErrorMessage = "Field 'FirstName' is required.")]
public string FirstName
{
    get
    {
        return this.firstName;
    }
    set
    {
        this.firstName = value;
        this.OnPropertyChanged("FirstName");
    }
}

Of course the article comes with a nice demo application:

You can read the full article here: Attributes-based validation in a WPF MVVM application


Where does the default TwoWay binding comes from ?

.Net, WPF No Comments »

I got a comment on my post about a very simple MVVM application about the fact that removing the TwoWay mode on a binding did not change the behavior of the application. This is a quick occasion for me to share a quick explanation about this.

Actually and as you already know if you can write XAML like Text={Binding …} it is only because Text is a Dependency Property. Also, dependency properties are defined in a static way (so that if you have 50 textboxes you don’t have to instantiate 50 times the Text property). The default behavior for the mode of the binding (TwoWay, OneWay, etc.) can be found in the static declaration of the dependency property. For example, in the case of the Text property of the TextBox we have:

?View Code CSHARP
1
2
3
4
5
6
7
8
9
10
11
12
TextProperty = DependencyProperty.Register(
	"Text", 
	typeof(string), 
	typeof(TextBox), 
	new FrameworkPropertyMetadata(
		string.Empty, 
		FrameworkPropertyMetadataOptions.Journal 
		| FrameworkPropertyMetadataOptions.BindsTwoWayByDefault,
	new PropertyChangedCallback(TextBox.OnTextPropertyChanged), 
	new CoerceValueCallback(TextBox.CoerceText),
	true, 
	UpdateSourceTrigger.LostFocus));

The interesting part here if of course the BindsTwoWayByDefault option. Note that this is the only default option available (we can’t have a OneWayToSource binding by default).

[WP7] Windows Phone 7 challenge for french readers !

.Net, Events, Silverlight, Windows Phone No Comments »

A couple of months ago, the french programming website www.developpez.com organized an event to discover Windows Azure programming (I wrote a blog post about it here).

A similar event has just been launched for Windows Phone 7 development at challenge-windowsphone7.developpez.com

(tr: “Let’s go !” “World cup ?” “No… Windows Phone 7 challenge by developpez.com !”)

The challenge is made of 6 steps:

  1. Tools : download and install the required tools
  2. Quizz : first basic quizz
  3. Silverlight development
  4. Silverlight and push notifications
  5. XNA
  6. Quizz : advanced quizz

Each winner will have the following gifts:

This kind of challenge is really helpful to discover a new technology the funny way ! I hope I’ll get my “I Love Windows Phone” tee-shirt to wear it this summer :-)

Leveraging expression trees to unit test ViewModel classes

.Net, Silverlight, Tools, WPF 5 Comments »

Introduction: In this article, I’m describing a technique which leverage the expression trees of C# 3.0 in order to facilitate the unit testing of ViewModel’s properties. My final goal is to be able to unit test a ViewModel property in 1 line.

Without any doubt MVVM is now the most used framework to leverage WPF and Silverlight functionalities in the best way ! During the last Mix, 3 sessions were dedicated to this methodology (you can watch the videos online here).

As you already know one of the key advantage of the MVVM methodology is to improve the testability of the overall application by reducing the amount of code in the code-behind and producing ViewModel classes which are testable. We use to say that ViewModel classes are testable because:

  • they are not coupled to UI concepts (controls, focus, keyboard input…)
  • they can wrap model objects using interfaces (for instance a PersonViewModel wraps a IPerson object)
  • they are not subclassing a UI control (such as Button or Window)

Today I’d like to share a technique I’m using to facilitate the unit tests of some properties of my ViewModel classes.

Let’s use a very simple ViewModel class as example:

?View Code CSHARP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
public class PersonViewModel : ViewModelBase
{
  private IPerson person;
  private bool isSelected;
 
  public string Name 
  {
     get
     {
        return this.person.Name;
     }
     set
     {
        this.person.Name = value;
        this.OnPropertyChanged("Name");
     }
  }
 
  public bool IsSelected
  {
    get
    {
      return this.isSelected;
    }
    set
    {
      this.isSelected = value;
      this.OnPropertyChanged("IsSelected");
    }
  }
 
  // rest of the code omitted for simplicity
}

The Name property, as usually with the MVVM pattern gets its value from the wrapped model object. The easiest way to unit test this property is to use a mocking library. Here is a example using MOQ (my favourite mocking library):

?View Code CSHARP
1
2
3
4
5
6
7
8
9
10
11
12
[Test]
public void TestName()
{
  var mockPerson = new Mock<IPerson>();
 
  var vm = new PersonViewModel(mockPerson.Object);
 
  vm.Name = "Jeremy";
 
  // verify that the Name property of the IPerson interface has been set
  mockPerson.VerifySet(p => p.Name = "Jeremy");
}

The Selected property is different because it doesn’t wrap a model property. It’s an information that is added to the ViewModel layer in order to control a UI-related property (for example the IsSelected property of a ListBoxItem). This technique is heavily used to have ViewModel classes interact with the WPF or Silverlight TreeView or ListBox control (you can check out this excellent article of Josh Smith for more detail).

In order to unit test this property, we must:
1/ ensure the PropertyChanged event of the INotifyPropertyChanged is raised properly
2/ ensure we can write a value and read back the correct value

Here is a sample code which does this unit test:

?View Code CSHARP
1
2
3
4
5
6
7
8
9
10
11
12
[Test]
public void TestName()
{
var vm = new  PersonViewModel();
bool propertyChanged = false;
 
vm.PropertyChanged += (s, e) => propertyChanged = e.PropertyName ==  "Name";
vm.Name = "newName";
 
Assert.IsTrue(propertyChanged);
Assert.AreEqual("newName", vm.Name);
}

It quickly become cumbersome to copy/paste this unit test for all the ViewModel properties we have. That’s the reason I started thinking about another way to do it…

Here is the feature I’m proposing:

?View Code CSHARP
1
2
3
4
5
6
[Test]
public void TestName()
{
var vm = new PersonViewModel();
TestHelper.TestProperty(vm, v => v.IsSelected);
}

In this sample, I’m telling I want to test the IsSelected property of the PersonViewModel type. The advantages are:
1/ less code involved : 1 line to test 1 property
2/ intellisense support in order to prevent typing error and no more “magic” string to give the name of the property
3/ refactoring the name of the property will refactor this sample code too
4/ automatic generation of default test values behind the scene

How does it works ?

  • TestProperty treats the second parameter as an Expression<Func> and not as a Func directly
  • Using expression tree (the “v => v.IsSelected” part),  I’m able to retrieve the name of the property and its type
  • Using reflection, I’m able to get and set the value
  • Depending on the type of the property (string, bool, int, double), I have default values write and read back (with a test to ensure that the PropertyChanged event has been raised properly).

Here is the code of the TestPropertyMethod:

?View Code CSHARP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
public static void TestProperty<T, U>(T viewmodel, Expression<Func<T, U>> expression)
    where T : INotifyPropertyChanged
{
    if(expression.Body is MemberExpression)
    {
        MemberExpression memberExpression = (MemberExpression) expression.Body;
 
        if (expression.Body.Type == typeof(bool))
        {
            TestViewModelProperty(viewmodel, memberExpression.Member.Name, true, false);
        }
        else if (expression.Body.Type == typeof(string))
        {
            TestViewModelProperty(viewmodel, memberExpression.Member.Name, "value1", "value2");
        } 
        else if (expression.Body.Type == typeof(int))
        {
            TestViewModelProperty(viewmodel, memberExpression.Member.Name, 1, 99);
        }
        else if (expression.Body.Type == typeof(double))
        {
            TestViewModelProperty(viewmodel, memberExpression.Member.Name, 1.0, 99.0);
        }
        else
        {
            throw new NotSupportedException("Type is not supported");
        }
   }
}

And the TestViewModelProperty:

?View Code CSHARP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
private static void TestViewModelProperty<T, U>(T viewModel, string propertyName, U value1, U value2)
    where T : INotifyPropertyChanged
{
    bool propertyChanged;
    viewModel.PropertyChanged += (s, e) => propertyChanged = e.PropertyName == propertyName;
 
    propertyChanged = false;
    viewModel.SetValue(propertyName, value1);
    Assert.IsTrue(propertyChanged);
    Assert.IsTrue(viewModel.GetValue<U>(propertyName).Equals(value1));
 
    propertyChanged = false;
    viewModel.SetValue(propertyName, value2);
    Assert.IsTrue(propertyChanged);
    Assert.IsTrue(viewModel.GetValue<U>(propertyName).Equals(value2));
}

I’m using 2 extensions methods in order to get and set value from the ViewModel object using reflection. Here they are:

?View Code CSHARP
1
2
3
4
5
6
7
8
9
10
11
private static T GetValue<T>(this object obj, string propertyName)
{
    var propertyInfo = obj.GetType().GetProperty(propertyName);
    return (T)propertyInfo.GetValue(obj, null);
}
 
private static void SetValue<T>(this object obj, string propertyName, T value)
{
    var propertyInfo = obj.GetType().GetProperty(propertyName);
    propertyInfo.SetValue(obj, value, null);
}

Please feel free to download the source code of the ViewModelTestHelper class.

Mix10 starting today !

.Net, Events, Silverlight, Visual Stutio No Comments »

Mix10 is starting today and we can expect many cool announcements during the keynote. You can watch the keynote online at live.visitmix.com. I’ll try to give feedback as soon as possible. Because I’m not lucky enough to be in Vegas, I’ll watch the keynote tonight (French time !) at home with some coworkers.

Last information before the keynote, it looks like we’ll have some announcements about Silverlight running on Symbian devices…

WPF internals part 2 : how the WPF controls are organized ?

.Net, Silverlight, WPF No Comments »

A couple of weeks ago, I started a series of articles about WPF internals organization. In the first article I did a tour of the core WPF classes. In this second part, I’m reviewing the organization of the various controls that exist in the framework.

Because the image of the diagram is pretty big, I decided to use Silverlight DeepZoom and the result is just below this text :-) You can download the full image resolution here. Please use the full screen button in the upper right corner of the viewer for the best browsing experience.

    Here are general remarks that might help you get information from those diagrams.

    The top level Control class:

    • Defines general UI properties such as Background, Foreground, BorderBrush and BorderThickness
    • Defines a set of properties to control font rendering: FontFamily, FontSize, FontStyle…
    • Has a DoubleClick event (other mouse events such as MouseUp/MouseDown comes from the UIElement class)

    Below the Control class, we have (this list is not complete):

    Below the ContentControl class we can find many existing WPF controls:

    General other remarks:

    • It’s funny to see that both Window and UserControl inherits from ContentControl. Before doing the diagram I though that Window came from somewhere else :-)
    • Having those diagrams in mind (or on a screen !) is very useful when you need to create your own custom control
    • We can see the differences between creating a custom control (inherit from Control or derived class) and a UserControl (inherit from UserControl)
    • .Net4 will introduce new controls (not in this diagram) in the WPF framework such: DataGrid, Calendar, TimePicker

    kick it on DotNetKicks.com

    Discover and compare existing MVVM frameworks !

    .Net, Silverlight, WPF 14 Comments »

    A couple of weeks ago, I wrote a blog post where I compared the existing MVVM frameworks. This post became a bit famous in the WPF/Silverlight blog world and I received a lot of feedback to update the list, fix information, etc. I also got a request from Erik suggesting me to put all the datas in a matrix.

    Today I’m proud to announce the MVVM frameworks Silverlight application (click the image to open the Silverlight3 page).

    silverlight-mvvm-app

    A couple of observation:

    • please contact me via this blog or twitter if you find incorrect information
    • I’m not judging anybody’s work by giving rating, it’s just my personal feeling to have an easiest way to sort the data

    Hope you’ll like it :-)

    PDC09 : How VS2010 was built with WPF ?

    .Net, Events, Tools, Visual Stutio, WPF No Comments »

    PDC09

    In my last blog post, I did a review of a PDC09 Session “Advanced performance tuning with WPF”. Today, I’m doing a review for another very interesting session “How VS2010 was built with WPF ?”. The video is available here.

    vs2008tovs2010

    Why did Microsoft choose WPF for VS2010 ?

    • Technological: prove the capabilities of WPF4
    • Architectural
      • Separated presentation
      • Support for long range road map (+10 years)
    • Key VS2010 features need it: Editor, Architecture Editor, Parallel tools debugging
    • Take an opportunity to give feedback for WPF4: when VS2010 development started, .Net 3.5 SP1 was just shipped and it was the right time to give feedback for the new features and fixes for WPF4.

    It is worth noting that VS2010 is a project that is being watched carefully inside Microsoft. We can expect that more Microsoft applications will move to WPF in the next coming years.

    What WPF features are used ?

    • Declarative UI using XAML
    • Databinding
    • Styles and templates
    • Application Resources
    • Interop Win32 (because they did not have the time to rewrite everything using WPF or because features doest not need to use WPF for example de WinForms designer…)
    • Integration with the message loop (to deal with particular focus issues)
    • New text stack (part of WPF4) based on DirectWrite

    Staged approach

    • Define data models: a huge diagramming and architectural exercice
    • Replace the main window with WPF (only the window not its content !) to start the mix approach (managed/unmanaged, WPF/Hwnds)
    • Write new managed components: Window manager, command bar presentation
    • Scout with other VS teams
    • Test, Test, Test…

    What were the challenges ?

    • Mixed mode application: native and managed code; WPF and HWNDs (Win32 or WinForms)
    • Keep existing extensions working and allow new extensions to take advantage of WPF
    • Don’t “stop the train” other teams were working at the same time on the product to add new functionalities
    • Text clarity
    • Performance
    • Focus management

    You can watch the session here if you want more detail and demos of what I mention in this post.

    Using Snoop to take a look at VS2010 !

    .Net, Visual Stutio 5 Comments »

    If like me you’re curious about how big WPF applications are made, you probably tried to use Snoop to inspect the visual tree of Visual Studio 2010 Beta2. And you probably had a problem because Snoop wasn’t able to detect the devenv process of VS2010:

    I wasn’t sure about the cause of this problem, but I grab the source of Snoop and took a look at the code that list the available window:

    ?View Code CSHARP
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    
    public void Refresh() {
    	this.windows.Clear();
     
    	foreach (IntPtr windowHandle in NativeMethods.ToplevelWindows) {
    		WindowInfo window = new WindowInfo(windowHandle, this);
    		if (window.IsValidProcess && !this.HasProcess(window.OwningProcess))
    			this.windows.Add(window);
    	}
     
    	if (this.windows.Count > 0)
    		this.windowsView.MoveCurrentTo(this.windows[0]);
    }

    I setup a breakpoint to find out what was wrong and discover that the window.IsValidProcess failed with the VS2010 process. Because I just wanted to check if it was the only reason why Snoop wasn’t able to inspect it, I hack the code to remove this test:

    ?View Code CSHARP
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    
    public void Refresh() {
    	this.windows.Clear();
     
    	foreach (IntPtr windowHandle in NativeMethods.ToplevelWindows) {
    		WindowInfo window = new WindowInfo(windowHandle, this);
    		if (/*window.IsValidProcess &&*/ !this.HasProcess(window.OwningProcess))
    			this.windows.Add(window);
    	}
     
    	if (this.windows.Count > 0)
    		this.windowsView.MoveCurrentTo(this.windows[0]);
    }

    And it’s working:

    vs2010-snoop

    Happy exploration with Snoop :-)

    VS2010 Beta 2 coming today !

    .Net, Visual Stutio No Comments »

    In case you don’t have the info yet, VS2010 Beta2 is coming today October 19th for MSDN subscribers. It will be released to public on Wednesday (source).

    Also, Visual Studio 2010 RTM will officially launch on March 22, 2010

    vs2010

    I’ll try to give some feedback as soon as I’ll be able to grab my copy and install it on ma workstation !

    WP Theme & Icons by N.Design Studio
    Entries RSS Comments RSS Log in