Updated: July 1st, 2010

Archive for July, 2010

Unit testing Flash panels within the Flash authoring environment using FlexUnit 4 and Flash Builder.

iconJuly 1st, 2010 icon2 Comments

For a recent project of mine I created an ActionScript 3.0 API for JSFL. The API is used as a communication layer between a Flash panel (built in Flex), and the JSFL interpreter in the Flash authoring environment. What follows is an explanation of how to execute unit tests in the Flash authoring environment, verify the results in Flash Builder, and uses the ActionScript 3.0 JSFL API as an example.

To ensure the robustness of my project I wrote a number of unit tests for my model, and other key pieces of the application including the JSFL API. As it was built using Flex 4, the unit testing features of Flash Builder came in handy. There was cause for concern however, as JSFL only runs within the interpreter in the Flash authoring environment, unit tests for the ActionScript 3.0 JSFL API would not work in the browser, or standalone runtime, because the API wouldn’t have access to the JSFL interpreter. Fortunately, with Flash Builder, and FlexUnit 4 there’s a way to write and execute unit tests in Flash Builder while testing them in the Flash authoring environment. Below are step-by-step instructions on how to run unit tests in the Flash authoring environment. The steps are written for those that have a basic level of understanding of how to create and run a custom Flash panel in the Flash authoring environment.

How to run tests within the Flash authoring environment.

  1. In the project settings of the Flash Builder project with the unit tests, modify the output folder in the Actionscript Build Path to the WindowSWF directory of your local installation of the Flash authoring environment.
    On a Mac:
    /Users/{username}/Library/Application Support/Adobe/Flash CS5/en/Configuration/WindowSWF/
    On a PC:
    \Documents and Settings\{username}\Local Settings\Application Data\Adobe\Flash CS5\en\Configuration\WindowSWF\
  2. The bin-debug directory will now link to the above directory on your local system.
  3. In the run dialogue of Flash Builder, run “FlexUnit Tests.” Ignore the results. This step is to make sure that the FlexUnitApplication.swf has been compiled.
  4. Restart, or open Flash. This step makes sure that Flash recognizes the new FlexUnitApplication WindowSWF.
  5. In the Flash menu bar select Window > Other Panels > FlexUnitApplication. This loads and executes the test runner within the Flash authoring environment.
  6. To see the results of the tests, view the FlexUnit Results panel within Flash Builder. The test runner passes the test results from the Flash authoring environment to Flash Builder in the same way as it would if the test runner was executed in a browser, or standalone version of the Flash player.
  7. When adding or modifying tests repeat step 3, completely close the FlexUnitApplication panel by clicking the close button in the top right of the panel, then repeat steps 5, and 6. It’s not necessary to restart Flash everytime you add or modify a test.

The above steps work in Flash CS5. For Flash CS4, I created an ActionScript only Flash Builder project that was run as a Flash panel. The Flash panel was used as a container for the test runner SWF and would re-load the test runner SWF file each time the Flash panel was clicked. Using the container panel made it easier to rerun tests after modifying or adding to the test suite.

The Author

Johannes Tacskovics
ECMAScript Developer

Portrait of Johannes Tacskovics

On front-end software engineering this is the blog of Johannes Tacskovics, a Los Angeles based ECMAScript Developer. This blog is focused on object oriented software development for the web.

Article Categories

Article Archives