In this post we will be discussing a long desired feature in XAML based applications. This feature is Binding Debugging specified in XAML. This feature is introduced in Silverlight 5.

Let's create a sample Silverlight application AppSilverlightDebuggingDemo. Definitely an installation of Silverlight 5 is required for this example. Silverlight 5 beta tools can be downloaded from here:

If you have it installed already, the second step would allow you to select Silverlight 5 as the Silverlight version. Here in order to test our example we are selecting the option to create a new website to host the silvelight application specified in previous step. When you hit OK the two projects should be available in Solution Explorer as follows: Now we add a view model to the Silverlight project MainPageViewModel. It is a simple view model implementing INotifyPropertyChanged interface for supporting change notification for its properties. The view model has two properties StudentId and StudentName, setting both would cause PropertyChanged event to be triggered.

Let us update the definition of MainPage.xaml as follows:

In the above view we are using the view model defined previously as DataContext. Here we have assigned some default values the two properties so that the view is loaded with some already existing information. We are binding the properties StudentId and StudentName to the two TextBox(es).Now when we run the application, it should display as follows: Now open the view's XAML and try hitting F9 while putting the cursor on each of the bindings. This would insert a break point in the Binding expression. The execution would break at these bindings like a regular break point but the difference is that now this break point has been inserted in XAML. Now let us run the application again. The execution would step at the break point as follows: It not only steps at the breakpoint, it also lets us to use regular debugging tools provided in Visual Studio. You can see that we have the Locals window opened and it is showing the values of the properties of the DataContext. It also lets us find the issues with binding. Let's update the StudentName binding as follows: How easy do you think your life would be. Easy debugging...no late sittings at work...more time with family :)

Posted by Muhammad Shujaat Siddiqi at 7:18 PM Labels: binding, debugger, debugging, new features, Silverlight, silverlight 5 Abbs said...

Even I've had a lot of problems debugging in silverlight. Everything I seem to do tends to be rendered useless overnight. It is very frustrating.
[null, {"document_url": "http://www.shujaat.net/2011/08/binding-debugging-in-silverlight-5.html", "unformatted_src": "http://4.bp.blogspot.com/-owkp2IyvcQY/Tj6VzFbb2wI/AAAAAAAAA_k/DRSW2KAzbuI/s400/1.jpg", "src": "http://4.bp.blogspot.com/-owkp2IyvcQY/Tj6VzFbb2wI/AAAAAAAAA_k/DRSW2KAzbuI/s400/1.jpg", "rendered_width": 400, "rendered_height": 244}, null, {"document_url": "http://www.shujaat.net/2011/08/binding-debugging-in-silverlight-5.html", "unformatted_src": "http://2.bp.blogspot.com/-1d9E_mndmnQ/Tj6WvH7t8WI/AAAAAAAAA_s/pCZKM7uJM4w/s400/2.jpg", "src": "http://2.bp.blogspot.com/-1d9E_mndmnQ/Tj6WvH7t8WI/AAAAAAAAA_s/pCZKM7uJM4w/s400/2.jpg", "rendered_width": 400, "rendered_height": 320}, null, {"document_url": "http://www.shujaat.net/2011/08/binding-debugging-in-silverlight-5.html", "unformatted_src": "http://3.bp.blogspot.com/-MlT3qI3W2g4/Tj6Xxp5wNpI/AAAAAAAAA_0/kv-xNu3_AtM/s400/3.jpg", "src": "http://3.bp.blogspot.com/-MlT3qI3W2g4/Tj6Xxp5wNpI/AAAAAAAAA_0/kv-xNu3_AtM/s400/3.jpg", "rendered_width": 400, "rendered_height": 350}, null, {"document_url": "http://www.shujaat.net/2011/08/binding-debugging-in-silverlight-5.html", "unformatted_src": "http://4.bp.blogspot.com/-kJEellzRFWU/Tj8NqqrINxI/AAAAAAAAA_8/HIPJc_QKaCY/s400/4.jpg", "src": "http://4.bp.blogspot.com/-kJEellzRFWU/Tj8NqqrINxI/AAAAAAAAA_8/HIPJc_QKaCY/s400/4.jpg", "rendered_width": 400, "rendered_height": 246}, null, null, {"document_url": "http://www.shujaat.net/2011/08/binding-debugging-in-silverlight-5.html", "unformatted_src": "http://2.bp.blogspot.com/-fsFAQFHvjPA/Tj8QG8i5wkI/AAAAAAAABAM/wPZX7qTTXuk/s400/6.jpg", "src": "http://2.bp.blogspot.com/-fsFAQFHvjPA/Tj8QG8i5wkI/AAAAAAAABAM/wPZX7qTTXuk/s400/6.jpg", "rendered_width": 400, "rendered_height": 191}, null, {"document_url": "http://www.shujaat.net/2011/08/binding-debugging-in-silverlight-5.html", "unformatted_src": "http://2.bp.blogspot.com/-ZgVBbfvYzgg/Tj8bLkHitGI/AAAAAAAABAU/MLxMsPVxeM4/s400/7.jpg", "src": "http://2.bp.blogspot.com/-ZgVBbfvYzgg/Tj8bLkHitGI/AAAAAAAABAU/MLxMsPVxeM4/s400/7.jpg", "rendered_width": 400, "rendered_height": 162}, null, null, null, null, {"document_url": "http://www.shujaat.net/2011/08/binding-debugging-in-silverlight-5.html", "unformatted_src": "http://3.bp.blogspot.com/-StVialkfDd8/UCGhpO3j02I/AAAAAAAABuM/_XHqvYMcULs/s195/MVVMSuvivalGuideCover.png", "src": "http://3.bp.blogspot.com/-StVialkfDd8/UCGhpO3j02I/AAAAAAAABuM/_XHqvYMcULs/s195/MVVMSuvivalGuideCover.png", "formatted_filename": "MVVMSuvivalGuideCover", "rendered_width": 161, "rendered_height": 195}, null, null, null, null, {"document_url": "http://www.shujaat.net/2011/08/binding-debugging-in-silverlight-5.html", "unformatted_src": "http://1.bp.blogspot.com/-AM-f-uCY_uU/UbDSwj9c0JI/AAAAAAAAF1Q/0iXTkrmoBZU/s195/VSM.png", "src": "http://1.bp.blogspot.com/-AM-f-uCY_uU/UbDSwj9c0JI/AAAAAAAAF1Q/0iXTkrmoBZU/s195/VSM.png", "formatted_filename": "VSM", "rendered_width": 195, "rendered_height": 54}, null, null, null, null, null]