Scaling the CairngormsOne Way Up the Mountain

Test-Driven Flex and ArcGIS Server Development Utilizing Cairngorm 3

Your SherpaGlenn GoodrichEnspiria Solutionsggoodrich@enspiria.com@ruprictGeek

Destination: Summit of PragmaticaBuild good practices like TDD, IoC, DI and make a MOCKery of unmaintainable development.

What’s on our backs?

FlexUnit 4 Cairngorm

3Flex

API

ASMock

Parsley

Hamcrest

Who are you?Previous Climbing Experience Flex Developer Understand TDD, IoC/DI Understand Mocking

Bonus Cairngorm experience Other MVC experience

Base Camp: Cairngorm

Micro-Architecture Command Pattern IoC to Inject Models & Services

We are here

GuidelinesToolsLibraries

NOTHING like Cairngorm 2.(Really, like, they are TOTALLY different)

Base Camp: Cairngorm Guidelines

Application Layers Presentation Application Domain Infrastructure Presume IoC, but don’t specify

Loose Coupling

NOTHING like Cairngorm 2.(Really, like, they are TOTALLY different)

Base Camp: Cairngorm GuidelinesPresentation View and View Models MXML has minimal script MXML binds to Model MXML throws inline events View Model throws business events

Application Events & Commands Integrate to the world Changes Model

Domain Business Objects Business Logic (Client-side)

Infrastructure Services, Remote & Local (cache)

Base Camp: Cairngorm Guidelines

Cairngorm

View => PM

Messaging

event Command

Model

updates

Infr

astr

uctu

re

invokes

event

binds to

returns

Base Camp: Cairngorm Tools

Leverage Existing Libraries FlexUnit4 ASMock FlexPMD IDE Plugins

Pretty sparse, right now.

IDE Integration could be the only place Cairngorm 3 is like Caringorm 2

Base Camp: Cairngorm Libraries

IntegrationObserverValidationNavigationModuleTask PopUp

Think Patterns & Practices Provide framework Handle common needs

Base Camp: Cairngorm Libraries

Integration Command Pattern Global Error Handling Progress Information

public class SelectStadiumsCommand{ [Inject] public var service:IStadiumService;

[Inject] public var selectedStadiums:Stadiums;

[Command(selector="selectStadiums")] public function execute(event:SelectStadiumsEvent):AsyncToken{ return service.getStadiumsForGeometry(event.geometry); }

[CommandResult(selector="selectStadiums")] public function handleStadiums(result:*,event:SelectStadiumsEvent):void{ //Transform result

Base Camp: Cairngorm Libraries

Observer Data binding Don’t use this (unless you have to)

<observer:Observe source="{model.selectedExtent.xmin}“ handler="updateExtent"/>

Base Camp: Cairngorm Libraries

Validation Data Input Domain Validation

<validators:ValidatorGroup id="validatorGroup"> <validators:validators>

<mx:StringValidator id="firstnameValidator" source="{ firstnameInput }" required="true" minLength="3" property="text" triggerEvent="change"/>

<mx:StringValidator id="lastnameValidator" source="{ lastnameInput }" required="true" minLength="2" property="text" triggerEvent="change"/>

</validators:validators>

</validators:ValidatorGroup>

Base Camp: Cairngorm LibrariesNavigation Waypoints and Landmarks Navigation Interceptors Navigation State <mx:ViewStack xmlns:mx="http://www.adobe.com/2006/mxml" >

<mx:Metadata> [Waypoint] </mx:Metadata>

<dashboard:BoardView automationName="{ ContentDestination.DASHBOARD }“/> <news:NewsView automationName="{ ContentDestination.NEWS }"/> <messages:MessagesView automationName="{ ContentDestination.MESSAGES }"/>

</mx:ViewStack>………………………………………………………………………………………..[Landmark(name=“news")]public class ContentPM implements ISelectedIndex{ [Bindable] public var selectedIndex:int;………………………………………………………………………………………..private function navigateTo(destination:String):void { dispatcher(NavigationEvent.newNavigateToEvent(destination)); }

Base Camp: Cairngorm Libraries

PopUp PopUp Management Abstract PopUpManager

<popup:PopUpWrapper id="popup1" open="{model.popUpHandler.showStadium}" > <mx:TitleWindow width="450" height="400" title="{model.selectedStadium.team}" layout="absolute" > <esri:Map id="stadiumMap" verticalCenter="0" horizontalCenter="0"

mapClick="trace(model.selectedExtent);trace(stadiumMap.extent)"width="400“ height="300"></esri:Map>

<mx:Button bottom="10" left="10" label="Close" click=“dispatchEvent( new Event( Event.CLOSE ) )"/> </mx:TitleWindow> <popup:behaviors> <mx:Array> <popup:AddPopUpToParsleyContext context="{ context }"/> </mx:Array> </popup:behaviors> </popup:PopUpWrapper>

Base Camp: Cairngorm Libraries

Module Modular Applications*

Task Sequence Commands Parallel Commands

*Duh

Base Camp: Parsley & SpiceLib

Parsley Dependency Injection Messaging Task Framework

SpiceLib Submodule of Parsely Reflection Task Framework

Pragmatica NeedThe Cairngorms are the last place on earth where the NFL hasn’t played a football game. The leaders of Pragmatica want to lure the NFL to Scotland and need a way to select the different stadiums and learn about these “football” teams.*

*worst contrived presentation demo story ever

User Story As a Pragmatica Leader, I want to select specific NFL Stadiums so I can see what makes a good stadium. *

The Foot of the SummitData Base Map NFL Stadiums (via GeoCommons)

Special Instructions Compiler setting for ASMock/FlexUnit4 runner Create “test” folder for our unit tests

Source Structure Broken into Functional Areas Separate test folder

The Foot of the Summit

First Belay: Write a Test

FlexUnit4 Setup Test Suite (Scaling Tests) TestRunner Application

User Story As a Pragmatica Leader, I want to select specific NFL Stadiums so I can see what makes a good stadium.

Map Test User draws a polygon Map fires event (SelectStadiumsEvent)

First Belay: Under Test

Cairngorm

View => PM

Messaging

event

First Belay: Under Test

Second Belay: Write a Test

Application Layer Shields view from Infrastructure Changes Model

Command Test Should call a service Should update model with results

Drives the Model Stadium Stadiums

Second Belay: Under Test

Cairngorm

Messaging

Command

Infr

astr

uctu

re

invokes

returns

Model

updates

Second Belay: Under Test

Third Belay: Hook Up the View

Guidelines Only knows about PM Use Flex data binding

Third Belay: Hook Up the View

Fourth Belay: Configure IoC

Parsley IoC Create a Context Add Presentation Models Add Business Objects Add Commands Add Services

Views addedToStagePMs ManagedEvents

Fourth Belay: Configure IoC

Fourth Belay: Configure IoC

Race to the Summit

Some Other Examples Stadium Map Show PopUp

Rinse, Lather, Repeat Write Tests Write Code to Satisfy Tests Hook up Views Configure IoC

Back at Base Camp

Presentation on SlideSharehttp://slideshare.net/ruprict/scaling-caringorms

Source Code on GitHubhttp://github.com/ruprict/scaling-cairngorm-agsLinks to all libraries

Contact Meggoodrich@enspiria.com@ruprictGeek

Questions

Thanks for coming!

Post Clim

b Refreshments