Design Patterns for MVVM Unit Testing & Testability
description
Transcript of Design Patterns for MVVM Unit Testing & Testability
![Page 1: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/1.jpg)
Design Patterns for MVVM Unit Testing & Testability
Benjamin Day
![Page 2: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/2.jpg)
Benjamin Day• Consultant, Coach, Trainer• Scrum.org Classes
Professional Scrum Developer (PSD) Professional Scrum Foundations (PSF)
• TechEd, VSLive, DevTeach, O’Reilly OSCON• Visual Studio Magazine, Redmond Developer News• Microsoft MVP for Visual Studio ALM• Team Foundation Server, TDD, Testing Best Practices,
Silverlight, Windows Azure• http://blog.benday.com• [email protected]
![Page 3: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/3.jpg)
Agenda
• My assumptions• Super-fast overview
Model-View-ViewModel (MVVM) Unit testing
• How to build stuff and test stuff.
![Page 4: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/4.jpg)
Assumptions
• Automated tests are required for “done”• Unit tests are written by developers.• QA testing is different from developer testing.
• MVVM in Silverlight is harder than WPF (My demos will be in Silverlight.)
![Page 5: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/5.jpg)
Design for testability?
• Way of architecting your application• Easy to write & run automated tests
![Page 6: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/6.jpg)
Things that need to be architected.
• Requirement: design for testability
• Requirement: testability in isolation They call them unit tests for a reason. Helps to remember Single Responsibility Principle (SRP)
• In Silverlight, figure out async first. Not planning for async will crush SRP.
![Page 7: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/7.jpg)
SOLID Principles of Class Design
Principle Purpose
Single Responsibility Principle
A class should have one, and only one, reason to change.
Open Closed Principle You should be able to extend a class’s behavior without modifying it.
Liskov Substitution Principle
Derived classes must be substitutable for their base classes.
Interface Segregation Principle
Make fine grained interfaces that are client specific.
Dependency Inversion Principle
Depend on abstractions, not on concretions.
http://butunclebob.com/ArticleS.UncleBob.PrinciplesOfOod
![Page 8: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/8.jpg)
Single Responsibility Principle• http://tinyurl.com/ahap3j
• Posters by Derick Bailey
![Page 9: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/9.jpg)
Things that need to be tested.
Goal: test your application without running the UI
• ComboBox / ListBox Population of lists Selection logic
• Field-based logic Value, Visibility, Validation Dependencies between
fields
• MessageBoxes Alerts and exceptions
• ProgressBar logic• Model to Data Access• ViewModel to Model
![Page 10: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/10.jpg)
Overview of unit testing.
![Page 11: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/11.jpg)
What is a Unit Test?
• Piece of code that verifies that another piece of code• Test code verifies application code
![Page 12: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/12.jpg)
Why Write Unit Tests?
• High-quality code Fewer bugs Clean design Clean code
• Professional Responsibility Proof that your code works Notification when your code is broken Quality focus throughout the development cycle
• Side Effects Code is easier to maintain, refactor Self-documenting
![Page 13: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/13.jpg)
Plan for testability?
• If you build it, it needs to be tested.• If you can test it with an automated test, it’s better.• When you build, think of how to test it.• The architecture changes when you think about how to test.
• It is important to remember the“Single Responsibility Principle”
![Page 14: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/14.jpg)
So what is this MVVM thing?
![Page 15: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/15.jpg)
Overview of MVVM.
![Page 16: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/16.jpg)
What is MVVM?
• Model-View-ViewModel• User interface interaction design pattern• Cousin of Model-View-Controller (MVC)• Enabled by data binding in WPF, Silverlight, WP7
![Page 17: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/17.jpg)
Why use MVVM?
• …or MVC or MVP?
• Keep code organized• Separate UI implementation from the logic• Keep code out of the “code behind” (*.xaml.cs)
Hint: this enables Design for Testability
![Page 18: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/18.jpg)
Our “To Do” list
• Architect the Silverlight Async solution• Re-usable fields
Values, Visibility, and Validation• List-based fields
ComboBox and ListBox• MessageBoxes• ProgressBars• ViewModel to Model• Model to Data Access
![Page 19: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/19.jpg)
Tip: If you’re writing Silverlight,figure out your async solution early.
![Page 20: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/20.jpg)
Network traffic in Silverlight
• It has to be async.• If it isn’t, the UI thread locks…forever.
![Page 21: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/21.jpg)
My initial client-side architecture.
![Page 22: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/22.jpg)
My architecture after Async WCF beat me up and ate my lunch.
![Page 23: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/23.jpg)
Async Kills
• Your Repository methods can’t return populated objects must return void
• Exception handling is hard Work happens on a different thread Exceptions can’t “bubble up” the stack
• You could have your *.xaml.cs handle the callbacks Ugly Violates “separation of concerns” Not very testable
![Page 24: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/24.jpg)
Longer discussion of Silverlight async
• http://blog.benday.com/archive/2010/12/24/23300.aspx
![Page 25: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/25.jpg)
Our “To Do” list
• Architect the Silverlight Async solution• Re-usable fields
Values, Visibility, and Validation• List-based fields
ComboBox and ListBox• MessageBoxes• ProgressBars• ViewModel to Model• Model to Data Access
![Page 26: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/26.jpg)
Primitive Obsession in your ViewModel.
![Page 27: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/27.jpg)
Primitive Obsession
• James Shore’s “Primitive Obsession” Too many plain scalar values Phone number isn’t really just
a string http://www.jamesshore.com/Blog/
• Validation in the get / set properties is ok but is phone number validation really the responsibility of the Person class?
![Page 28: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/28.jpg)
Coarse-Grained vs. Fine-GrainedObject Model
• James Shore blog entry talks about Responsibilities Fine-grained = More object-oriented Data and properties are split into actual responsibilities
• I’m concerned about Responsibilities Code Duplication Simplicity
![Page 29: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/29.jpg)
ViewModelField<T>
• Provides common functionality for a property on a ViewModel
![Page 30: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/30.jpg)
With & Without ViewModelField<T>
![Page 31: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/31.jpg)
Are your ViewModel propertiesCoarse or Fine?
• Fine-grained gives you room to grow• ViewModelField<T>• Create custom controls that know how to talk to your
ViewModelFields Simplified binding expressions
• Add features later Field validation later Security
![Page 32: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/32.jpg)
VIEWMODELFIELD<T>Demo
![Page 33: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/33.jpg)
COMBOBOX & LISTBOXDemo
![Page 34: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/34.jpg)
MESSAGE BOXESDemo
![Page 35: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/35.jpg)
PROGRESS BARSDemo
![Page 36: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/36.jpg)
Our “To Do” list
• Architect the Silverlight Async solution• Re-usable fields
Values, Visibility, and Validation• List-based fields
ComboBox and ListBox• MessageBoxes• ProgressBars• ViewModel to Model• Model to Data Access
![Page 37: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/37.jpg)
Focus your testing on stuff that tends to be buggy.
![Page 38: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/38.jpg)
Calls to data access are buggy.
• The goal: Data access should take/return Model objects.
• Databases ADO.NET objects don’t look like your Model Make the db call, convert the data to Models Take the Model, convert it to a db call
• WCF Services Service Reference classes *are not* your model Make a WCF call, convert the data to Models Take the Model, make a WCF call
• This stuff is always buggy.
![Page 39: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/39.jpg)
Repository & Adapter Patterns are your friend
![Page 40: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/40.jpg)
What is Repository?
![Page 41: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/41.jpg)
The Repository Pattern
• “Mediates between the domain and data mapping layers using a collection-like interface for accessing domain objects.” http://martinfowler.com/eaaCatalog/repository.html
• Encapsulates the logic of getting things saved and retrieved
![Page 42: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/42.jpg)
Synchronous Repository
![Page 43: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/43.jpg)
Synchronous SQL Server & WCF
![Page 44: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/44.jpg)
A Big Picture
![Page 45: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/45.jpg)
What is Adapter?
![Page 46: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/46.jpg)
Adapter Pattern
• “…converts the interface of a class into another interface the clients expect. Adapter lets classes work together that couldn’t otherwise because of incompatible interfaces.”
• from “Head First Design Patterns”by Elisabeth & Eric Freeman
![Page 47: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/47.jpg)
My version of Adapter Pattern
• Take object of Type A and convert it in to object of Type B
![Page 48: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/48.jpg)
Why are these patterns your friend?
• Help focus your mind• Better design• Help contain bugs
These conversions to/from will be buggy• Help localize change
Service endpoint designs will change often• Unit test the conversions separately
(Remember it’s a “unit” test.)
![Page 49: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/49.jpg)
Keep the Adapt separated from the Retrieve
• Two classes Repository knows how to talk to the WCF service Adapter knows how to turn the Service Reference types into Models
• Single Responsibility Principle (SRP)
![Page 50: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/50.jpg)
REPOSITORY & ADAPTERdemo
![Page 51: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/51.jpg)
Our “To Do” list
• Architect the Silverlight Async solution• Re-usable fields
Values, Visibility, and Validation• List-based fields
ComboBox and ListBox• MessageBoxes• ProgressBars• ViewModel to Model• Model to Data Access
![Page 52: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/52.jpg)
No shortcuts: Keep your ViewModels & Models separate.
![Page 53: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/53.jpg)
No shortcuts: Keep your ViewModels & Models separate.
• It will be tempting to have your Repository/Adapter layer create ViewModels (Don’t.)
• There’s a reason why it’s calledModel-View-ViewModel
![Page 54: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/54.jpg)
Why keep Model and ViewModel separated?
• ViewModel is a user interface design• Model is the state of your application
aka. “Domain Model” pattern• ViewModel advocates for the UI
1-to-1 between a ViewModel and a *.xaml file Might reference multiple Models
• Don’t have the ViewModel fields directly update the Model.
![Page 55: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/55.jpg)
It’s all about the Cancel button.
• If you’re “two way” data bound, How do you undo?
![Page 56: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/56.jpg)
Cancel: ViewModel wraps Model
• ViewModel populatesitself from the Model
• User edits the screen,ViewModel gets updated
• Model doesn’t get changed until Save button is clicked.
• Model is The Boss.
![Page 57: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/57.jpg)
VIEWMODEL TO MODELADAPTER
demo
![Page 58: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/58.jpg)
Summary: Our “To Do” list
• Architect the Silverlight Async solution• Re-usable fields
Values, Visibility, and Validation• List-based fields
ComboBox and ListBox• MessageBoxes• ProgressBars• ViewModel to Model• Model to Data Access
![Page 60: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/60.jpg)
Other Resources
• http://tinyurl.com/3d2soe8
![Page 61: Design Patterns for MVVM Unit Testing & Testability](https://reader036.fdocuments.us/reader036/viewer/2022081503/568164da550346895dd72a1e/html5/thumbnails/61.jpg)
Other Resources
• http://tinyurl.com/ln248h