Dahlia Bock

Testing: Unit testing on the UI in Flex (Part 1)

leave a comment »

I seem to be obsessed with testing lately and after watching J.B. Rainsberger’s video, I feel even more convinced that good developer testing plays a big part in producing code that is maintainable and not adverse to change in addition to providing the assurance to the developer that a functionality is done when they say it is.

Testing UI code is often a challenge and most projects I’ve been on defer that to acceptance tests that are driven from the browser. I’m not disregarding browser tests entirely but like I’ve mentioned in my previous post, that could be a suboptimal testing option.

Mate (pronounced Mah-tay), which is a tag-based Flex framework, provides the ability to define a separation between the state and behavior of the presentation of a view and the UI controls of the view itself, thus allowing for extensive unit testing of the UI. Before I delve deeper into how that works, let me talk a little bit about the Presentation Model pattern, advocated by Martin Fowler. Given a Model-View-Controller situation, the idea of the pattern is to remove all logic from the view into the presentation model, which is a model class that is part of the presentation (or view). This gives us a few advantages:

  1. The view becomes dumb and simple. No logic resides here, just UI components.
  2. The view could potentially be reused to display other data by just switching out the model.
  3. And more importantly, we are now able to test the behavior of the view (i.e. what happens when a button is clicked, are multiple drop-down menus dependent on each other, and if so, how?)

We will take a look at how to test the behavior and state of the view in my subsequent posts.

Written by Dahlia Bock

October 28, 2009 at 1:48 am

Posted in UI, flex, testing

Leave a Reply