How to use FlexUnit in Flex

August 12th, 2008 Ntt.cc

Earth-Scan-256x256 If you’re a java programmer, you may familiar with JUnit. Today, software testing is becoming more and more important. A good platform needs good testing tools. Now, Adobe release the unit test tool on flex named FlexUnit. So, let’s try it, and gives you a direct-viewing understand.

clip_image002

I’ll suppose the reader, you familiar with Flex and AS 3.0(or AS 2.0), and any knowledge about software testing is unnecessary. This demo can be ran in Flex Builder 3.0.

DownloadDownload Full Source

First thing first, we must download this tool from the official website. Open this page http://code.google.com/p/as3flexunitlib/，and you’ll see the Featured Downloads on your right hand side. Download the file named flexunit-.85.zip, and extract it.

There’ll be three directories including bin, doc and src after you extracted it. As usual, the bin directory is keeping the SWC library of FlexUnit, and the doc directory is about API documents, the last directory src is about the source code of this project.

Now, let’s build a test project to see how to use it.

clip_image004

Open your Flex Builder, create a new project called TestRunner, choose the project location, set the Application type as Web application and no server is needed.

Click Next, and you can choose the output folder, here we use the default path.

Next again, here comes the setting. Switch to the Library Path, click Add SWC, showing below.

clip_image005

clip_image007

Find the flexunit.swc, and the flexunit will added into the build path libraries. Such as the right hand side graph shows.

If you don’t want to setting it now, you can set it when you want to. You just need to right click the project, choose properties, then click the Flex Builder Path, you can see the same user interface. If you have some experience on Eclipse, you will familiar with it.

What is next? Eh, let’s write some code now. According to adobe, we should use TDD(Test Driven Development) this time. So let’s build the main framework for this project, put the code showing below on the main mxml.

Download: TestRunner.mxml
  1. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns="*"
  2.                 xmlns:flexunit="flexunit.flexui.*"
  3.                 creationComplete="onCreationComplete()">
  4.    
  5.     <mx:Script>
  6.         <![CDATA[
  7.             import flexunit.framework.TestSuite;
  8.            
  9.             // After everything is built, configure the test
  10.             // runner to use the appropriate test suite and
  11.             // kick off the unit tests
  12.             private function onCreationComplete():void
  13.             {
  14.                  testRunner.test = createSuite();
  15.                  testRunner.startTest();
  16.              }
  17.            
  18.             // Creates the test suite to run
  19.             private function createSuite():TestSuite {
  20.                  var ts:TestSuite = new TestSuite();
  21.                 
  22.                  // TODO: Add more tests here to test more classes
  23.                  // by calling addTest as often as necessary
  24.                 
  25.                  ts.addTest( TemperatureConverterTest.suite() );
  26.                 
  27.                  return ts;
  28.              }
  29.            
  30.         ]]>
  31.     </mx:Script>
  32.  
  33.     <flexunit:TestRunnerBase id="testRunner" width="100%" height="100%" />
  34. </mx:Application>

You don’t need to understand the code now, here we’re going to test a little toy program convert the degrees on Celsius and Fahrenheit.

We need to create a test class, inherited from flexunit.framework.TestCase. Choose File->new->ActionScript File, named it as TemperatureConverterTest.as, the code is showing below.

Download: TemperatureConverterTest.as
  1. package {
  2.  
  3.      import flexunit.framework.TestCase;
  4.      import flexunit.framework.TestSuite;
  5.     
  6.      public class TemperatureConverterTest extends TestCase {
  7.          
  8.           public function TemperatureConverterTest( methodName:String ) {
  9.                super( methodName );
  10.            }
  11.      
  12.           public static function suite():TestSuite {
  13.                var ts:TestSuite = new TestSuite();
  14.               
  15.                ts.addTest( new TemperatureConverterTest( "testToFahrenheit" ) );
  16.                ts.addTest( new TemperatureConverterTest( "testToCelsius" ) );
  17.                return ts;
  18.            }
  19.          
  20.           /**
  21.            * Ensures the celsius to fahrenheit conversion works as expected.
  22.            */
  23.           public function testToFahrenheit():void {
  24.                // Test boiling point
  25.                var celsius:Number = 100;
  26.                var fahrenheit:Number = TemperatureConverter.toFahrenheit( celsius );
  27.                assertTrue( "Expecting 212 fahrenheit", fahrenheit == 212 );
  28.               
  29.                // Test freezing point
  30.                var celsius:Number = 0;
  31.                var fahrenheit:Number = TemperatureConverter.toFahrenheit( celsius );
  32.                assertTrue( "Expecting 32 fahrenheit", fahrenheit == 32 );
  33.            }
  34.          
  35.           /**
  36.            * Ensures the fahrenheit to celsius conversion works as expected.
  37.            */
  38.           public function testToCelsius():void {
  39.                // Test boiling point
  40.                var fahrenheit:Number = 212;
  41.                var celsius:Number = TemperatureConverter.toCelsius( fahrenheit );
  42.                assertTrue( "Expecting 100 celsius", celsius == 100 );
  43.               
  44.                // Test freezing point
  45.                fahrenheit = 32;
  46.                celsius = TemperatureConverter.toCelsius( fahrenheit );
  47.                assertTrue( "Expecting 0 celsius", celsius == 0 );
  48.            }
  49.          
  50.       }
  51. }

Now, we need to create the class which needs to be tested. Create the ActionScript File named TemperatureConverter.as, we can write some simple code to fill it, show as blow.

Download: TemperatureConverter.as
  1. package {
  2.     
  3.      public class TemperatureConverter {
  4.          
  5.           public static function toFahrenheit( celsius:Number ):Number {
  6.                return ( 9 / 5 ) * celsius + 32;
  7.            }
  8.          
  9.           public static function toCelsius( fahrenheit:Number ):Number {
  10.                return ( 5 / 9 ) * ( fahrenheit - 32 );
  11.            }
  12.       }
  13. }

It seems everything goes all right, let’s run the project. And you’ll see

clip_image008

From this graph, we can see the Running bar is red, it means some failures happened, and you can see the failures showing on the graph.

Now, let’s change the code to fix it. The code is showing below.

Download: TemperatureConverter.as
  1. package {
  2.  
  3. public class TemperatureConverter {
  4.  
  5. public static function toFahrenheit( celsius:Number ):Number {
  6.  
  7. return ( 9 / 5 ) * celsius + 32;
  8.  
  9. }
  10.  
  11. public static function toCelsius( fahrenheit:Number ):Number {
  12.  
  13. return ( 5 / 9 ) * ( fahrenheit - 32 );
  14.  
  15. }
  16.  
  17. }
  18.  
  19. }

Run it again. You’ll get…

clip_image009

This time, the Running bar was changed to green, it means no failure.

According to this simple introduction, I think you can get a direct-viewing on this powerful tool. Now you can get it from Google code, and use it on your daily life.

Share and Enjoy:
  • Digg
  • del.icio.us
  • Facebook
  • Google Bookmarks
  • DZone
  • Reddit
  • Technorati
  • StumbleUpon
  • Twitter
Posted in FlexUnit Tags: , , , 3,770 views
RSS Enjoy this Post? Subscribe to Ntt.cc

RSS Feed   RSS Feed     Email Feed  Email Feed

Related Post

« URLParser: a parser to get value of host, protocol, port, parameters from an URL using regular expression
A trick of ActionScript 3: Using break “labelname” to break from outer loops »
You can leave a response, or trackback from your own site.

3 Responses to “How to use FlexUnit in Flex”

  1. Jonecir says:
    October 4, 2008 at 11:41 pm

    Hello,

    Nice article, however I installed the flexunit0_9 version which is quite different from the version you used. Any how, it did not show me any errors when I run the application. Also, you have defined the celsius and fahrenheit variables twice so I’ve got a warning.

    Now after making sure the application is free of errors, how do I release the application? Should I remove the TemperatureConverterTest file from the project and recompile the application again?

  2. FlexUnit — An Testing Framework For Flex and ActionScript 3.0 | FlexMan says:
    January 5, 2009 at 8:13 pm

    [...] How to use FlexUnit in Flex Ntt.cc [...]

  3. Swathi says:
    June 18, 2009 at 5:22 pm

    Good article, As Jonecir said, I too installed the flexunit0_9 version and it did not show me any errors. Please let me know how to proceed…

Leave a Reply

  • Ads