“Is there a framework which would let me test the logic written within my mxml Application” – FlexUnit reloaded :)
This is a small post briefly explaining how one can test the logic written within an Application file. This post is a follow up on one of the questions raised very often “Is there a framework to test functions within mxml application in Flash Builder?”
The answer is a straight “YO” ! Here is the small example on how to achieve this.
1)Launch the Flash Builder4 and Create a flex project say “FlexUnitTesting”.
2) Open the file FlexUnitTesting.mxml and type the following code:
3) Save the application.
Note: I am using a sample function which just returns me a string. This can be extended to any complex logic even to the extent of testing custom component.
4)Context click on the FlexUnitTesting.mxml and select New->TestCase class.
5)You would be amazed to see the “Class to Test” being selected as “FlexUnitApplication” and the name of the test case pre-populated as”FlexUnitApplicationTest”.Now click NEXT.
6)You would see the public function ‘ sayIDidThat’, select the method and click FINISH.
7)The mxml editor would now point to stubs for the test case “FlexUnitApplicationTest” which got generated.
8)Verify the stub for the function ‘testSayIDidThat’:
Note: By default you would have the “fail” implementation for all the tests which would look like
fail(“Test method Not yet implemented”);
9)Write your test logic within the function ‘testSayIDidThat’ as follows:
10)Save and Run the tests(Context click on project -> Execute FlexUnit Tests).
Your result view would appear like this:
Yes, “You really Did That” 🙂
For more assistance and to know more about FlexUnit, launch Flash Builder hit F1 and search for “FlexUnit test Integration”.
Data Centric Rapid Application Development one of the star-strickers in the Flash Builder 09 BETA league ensures seemless connectivity between Flex client and Java back-end. Said so, it promises literally “ZERO” Flex code to build a Rich Internet Application.It also provides kick-ass support for client-side Data Management and Paging.
Let us build a sample Inventory application which displays all the mobile phones available in a mall.
a) Downloadand install Flash Builder 4 BETA from http://labs.adobe.com/technologies/flashbuilder4/
b) Download the latest BlazeDS release build from http://opensource.adobe.com/wiki/display/blazeds/Downloads
FYI, BlazeDS is the server-based Java remoting and web messaging technology that enables developers to easily connect to back-end distributed data and push data in real-time to Adobe® Flex™ and Adobe AIR™ applications for more responsive rich Internet application (RIA) experiences. In short, a bunch of libraries to connect ColdFusion or Java back-ends to Flex.
c)Basic knowledge in Java Programming.
d)ZERO knowledge in Flex Programming 😦
BlazeDS comes bundled with Tomcat, but one may also deploy it on other servers like Apache,JBOSS etc.In this post i would assume the BlazeDS sits on in-built tomcat.
a) Go to tomcat\webapps\blazeds\WEB-INF and uncomment the servlet definition and mapping for “RDSDispatchServlet” and set the <param-value> as ‘false’.
b) Kindly set up your data base as mentioned here
c)Add the following class files from Files
and place it under tomcat\webapps\blazeds\WEB-INF\classes\com\random.
d)Open remote-config.xml from tomcat\webapps\blazeds\WEB-INF\flex and add the following mapping:
<properties> <source>com.random.Inventory</source> </properties>
e) Add the mysql jdbc jar file “mysql-connector-java-5.1.7-bin” to tomcat\webapps\blazeds\WEB-INF\lib.
Your BlazeDS set-up is now complete, GOTO tomcat\bin and start the server.
Here are the step-by-step instructions to achieve the workflow:
a) Launch Flash Builder and create a Flex-BlazeDS project as shown in the image below:
Click NEXT from “Project Creation” wizard and set the
server configuration based on the BlazeDS installation directory,click “Validate Configuration” and FINISH.
b) Goto Data->Connect to BlazeDS..
c) An authentication dialog will pop-up, select “No password” check-box and click OK
d)In the Import BlazeDS/LCDS service wizard, enter the service name as “MyDestination”, select the destination and FINISH.
e) Click on J2EEProject.mxml and switch to the design view.
f) Go to Components->Data Controls, select Data Grid and drag-drop onto the design view
g) Now drag-drop getAllItems functions onto the Data Grid. The preview is shown above.
h)Context click on project and select ‘Run Application’ . All the values in the data base gets populated in the data grid launched in the browser.
Similarly all the CRUD operations can be performed including client-side Data Management and Paging without any Flex code.
Wanna know what’s the magic ?? Hoping to get back soon with the MAYA “behind the scenes” 🙂
Now how many of us agree that Java Developers can tie KNOT with Flex for their RIA development ???
Flash Builder 4 now introduces a whole bunch of glamorous features(glam-gals) namely Data Centric Rapid Application Development, FlexUnit Integration in Flash Builder, Network Monitor etc. Hence offering immense richness in the RIA development tool.
Here is a preview of the builder with its latest “Super Models“.
A quick brief on each of these Models:
a) Data Centric Rapid Application Development : is an initiative to enrich various back-ends to connect seemlessly with Flex client 🙂 The supported back-ends include all hot stars namely PHP,ColdFusion,Java and .NET.
b) Network Monitor : is a sniffer built within Flash Builder to sniff service calls made from Flex client(mind you its flex specific call sniffer). Various protocols supported are REST,SOAP,HTTPS and AMF.
c) FlexUnit Integration : FB now offers exclusive support for Test Driven Development by providing exclusive tooling support for FlexUnit – an open source, in-house unit testing framework.
In this post i shall talk more on my hot-sweet celebrity “FlexUnit Integration in FB“.
“FlexUnit Integration in Flash Builder” allows the developer to write unit tests for his code seemlessly. He/She is facilitated with a bunch of helpful wizards which let one easily create a Test Case or a Test Suite class, a sophisticated Result View and extensive support to test Flex, Action Script, Flex Library and AIR projects.
Here are the step-by-step instructions :
1) Launch Flash Builder, create a Flex project
2) Test Case : File->New->Test Case class where you select a ‘Class to test’ and ‘Methods to test’.
3) Test Suite creation: File->New->Test Suite where you include all the test cases as part of your suite.
3) Execution: Context click(right click) on the project and select “Execute FlexUnit Tests”. Option to RUN are also available under Run/Debug/Profile menu.
Note: The current test configuration can also be saved as an mxml file and loaded back on need-serve basis(Refer to Load and Save button in the wizard).
4) View the RESULTS in the FlexUnit Result view.
5) Analyse the result by leveraging the result view options like Source code navigation on double-click, Save/Load the results view, re-running options of selected tests, stopping the tests etc.
All TDD enthusiasts “WATCH OUT” 🙂
Just check out the BETA version of FB when you guys find time , play around with our features and write your experience to me @ email@example.com also feel free to log your issues @ https://bugs.adobe.com/flex/.
Hope you all had a Jolly ride and start loving our “glam-gals” 🙂
Firstly, kudos to the entire Flash Platform team for releasing the BETA versions of FlashBuilder4,Flex4 and Flash Catalyst successfully 🙂
Stay tuned for a GLIMPSE of the most exciting features in Flash Builder 🙂
Meanwhile, just catch up with http://labs.adobe.com/technologies/flashbuilder4/ – “THE BETA BOY“!