Home

troggy edited this page Jan 30, 2012 · 5 revisions
Clone this wiki locally

Welcome to the FunFX wiki!

FunFX is a tool that enables functional testing of Flex applications.

It uses Ruby as its scripting language and uses a browser as the testing container, and has cross platform support by supporting both Safari and FireFox.

Getting started

Installing FunFX

To install FunFX, you simply do this (you might need sudo infront if you are on Linux):

gem install funfx

But to be able to use FunFX you will also need either Firewatir for FireFox or Safariwatir for Safari (Safariwatir works only on Mac)

gem install firewatir
gem install safariwatir

I you choose to use FireFox as your browser, you will need to install a simple JSSh plugin for Firewatir to work. This plugin can be found at OpenQA

Getting the Flex application ready for testing

You must also have the Flex SDK that contains the automation files. These files does not follow the regular free sdk. You will need to download the Flex Builder to get hold of these files. With the trial version you will be able to do short testscripts, but if they do more than 10 or some steps, it will ask you to buy the Professional version. (Btw, the Linux alpha version has these files without any restrictions for another year I think)

There are 4 important automation files that we will need to have before running the tests:

  • automation.swc
  • automation_agent.swc
  • automation_dmv.swc
  • automation_agent_rb.swc
  • automation_rb.swc
  • datavisualization_rb.swc

(The three first files are located in the sdk\frameworks\libs, and the last three ones are located under
sdk\frameworks\locale\your_wanted_locale)

You will also need the funfx swc file which you can get from the RubyForge page. Make sure that the swc file has same version number as the gem you installed. These swc files will be built into your swf file.

There are two ways of getting your Flex application ready for testing: using Maven or just with the regular Flex compiler either with Flex Builder or the command line Flex compiler.

FunFX with Maven

A Flex application can be built with Flex-Mojos, which is an incredible tool for building Flex applications with Maven.

The following dependencies will make your application include FunFX and the necessary files. These files need to be installed to your local repositiory.

<dependencies>
  <dependency>
     <groupId>funfx.flex</groupId>
     <artifactId>funfx</artifactId>
     <version>0.2.2</version>
     <type>swc</type>
     <scope>internal</scope>
  </dependency>
  <dependency>
     <groupId>com.adobe.flex.framework</groupId>
     <artifactId>datavisualization</artifactId>
     <version>3.0</version>
     <type>swc</type>
  </dependency>
  <dependency>
     <groupId>com.adobe.flex.framework</groupId>
     <artifactId>datavisualization</artifactId>
     <version>3.0</version>
     <classifier>en_US</classifier>
     <type>swc</type>
  </dependency>
				
  <dependency>
     <groupId>com.adobe.flex.framework</groupId>
     <artifactId>automation</artifactId>
     <version>3.0</version>
     <type>swc</type>
     <scope>internal</scope>
  </dependency>
  <dependency>
     <groupId>com.adobe.flex.framework</groupId>
     <artifactId>automation</artifactId>
     <version>3.0</version>
     <classifier>en_US</classifier>
     <type>swc</type>
     <scope>internal</scope>
  </dependency>
  <dependency>
     <groupId>com.adobe.flex.framework</groupId>
     <artifactId>automation_agent</artifactId>
     <version>3.0</version>
     <type>swc</type>
     <scope>internal</scope>
  </dependency>
  <dependency>
     <groupId>com.adobe.flex.framework</groupId>
     <artifactId>automation_dmv</artifactId>
     <version>3.0</version>
     <type>swc</type>
     <scope>internal</scope>
  </dependency>
  <dependency>
     <groupId>com.adobe.flex.framework</groupId>
     <artifactId>automation_agent</artifactId>
     <version>3.0</version>
     <classifier>en_US</classifier>
     <type>swc</type>
     <scope>internal</scope>
  </dependency>
</dependencies>

These dependencies should be part of a FunFX profile that skips the regular Flex tests. This is due to the fact that FunFX uses the ExternalInterface library that requires that the Flex application is ran within a browser. And the flex-mojo runs the regular Flex tests within a standalone Flashplayer.

Using Flex Builder or the command line

It is also possible to use Flex Builder or just the commandline compiler.

Flex builder

When using Flex Builder, you will need to select properties of the wanted Flex project and select the Flex Compiler option.

Then enter the following in the Additional compiler option:
—include-libraries “Path-to-sdk\frameworks\libs\automation.swc” “Path-to-sdk\frameworks\libs\automation_agent.swc” “Path-to-sdk\frameworks\libs\automation_dmv.swc” “Path-to-sdk\frameworks\locale\en_US\automation_agent_rb.swc” “path-to-where-ever-this-file-is-located\funfx-0.2.2.swc”

If you do not have any custom html file or jsp file, do also choose the option Generate HTML wrapper file. This due to FunFX must be run in a browser, not just within the Flash Player.

Alternatively, if you have an ant build script, you can add the funfx swc to the project’s libs dir and include the files by adding the following options to the mxmlc task:

<compiler.include-libraries dir="${FLEX_HOME}/frameworks/libs" append="true">
	<include name="automation.swc" />
	<include name="automation_agent.swc" />
	<include name="automation_dmv.swc" />
</compiler.include-libraries>
<compiler.include-libraries dir="${FLEX_HOME}/frameworks/locale/en_US" append="true">
	<include name="automation_agent_rb.swc" />
</compiler.include-libraries>
<compiler.include-libraries dir="libs" append="true">
	<include name="funfx-0.2.2.swc" />
</compiler.include-libraries>

To see if this has worked, you can try to run the Flex application, if you see the recorder down on the right hand side, FunFX has been successfully compiled into the application. Now you are ready to write the Ruby tests.

Using the compiler

When compiling from commandline, it is simmilar as with Flex builder. Just add the —include-libraries to the compiler.

Like this:

Path-to-sdk\bin\mxmlc" -include-libraries “Path-to-sdk\frameworks\libs\automation.swc” “Path-to-sdk\frameworks\libs\automation_agent.swc” “Path-to-sdk\frameworks\libs\automation_dmv.swc” “Path-to-sdk\frameworks\locale\en_US\automation_agent_rb.swc” “path-to-where-ever-this-file-is-located\funfx-0.2.2.swc”

The first lines of code

Below is the lines of code you will need at the beginning of your test script to initialize FunFX and Firewatir (this is example for Firefox, but just replace firewatir with safari and you are good to go if you have a Mac).

The two first lines is regualr require statements in Ruby, which is like import in Java,

The next two creates an instance of Firefox and makes it go to the url localhost:8080/my-funfx-flex-application.html, here you must add your own url to your application.

The last one is the tricky part, here it creates a Ruby referance to the Flex swf embedded in the html or jsp file. It takes to arguments, and that is the id and the name of the swf defined in the html file. When creating the HTML wrapper file from Flex Builder, the id and name is default equal to the name of the swf file created.

require 'funfx'
require 'funfx/browser/firewatir' 

BROWSER = FireWatir::Firefox.new
BROWSER.goto("localhost:8080/my-funfx-flex-application.html")

@flex = BROWSER.flex_app('my-funfx-flex-application-id', 'my-funfx-flex-application-name')
# From the default created HTML wrapper file from Flex Builder
AC_FL_RunContent(
			"src", "FlexApplication",
			"width", "100%",
			"height", "100%",
			"align", "middle",
			"id", "my-funfx-flex-application-id",
			"quality", "high",
			"bgcolor", "#869ca7",
			"name", "my-funfx-flex-application-name",
			"allowScriptAccess","sameDomain",
			"type", "application/x-shockwave-flash",
			"pluginspage", "http://www.adobe.com/go/getflashplayer"
	);

Now you are ready to act upon components with in your application.

You can see the @flex referance as the top node of your Flex application.

For instance, if you have a button with label Click Me in you application, you can write:

@flex.button(:automationName => “Click Me”).click

Referencing components

First of all, to be able to reach any components in the Flex application, they must be possible to have a unique identifier by id or label. So when creating the Flex application, add as much id’s as possible. This will make it easier to develop FunFX tests.

When you look for a button from the @flex object with id myButton, it will search from the top node and use an bottom first algorithm to locate a component with id myButton. When it finds something it will return this object. So if you have multiple components with the exact same id, you must be more precise when writing the test. For this you have two options, you can either specify path for the search like this:

@flex.box(:id => “container”).button(:id => “myButton”)

With this, it will first look for the component with id container, and from there search for a button with id myButton.

But you can also add more information to the button, for instance, if you have a repeater, the items for the repeater will have the same id and possible be located within the same container. Then you can for instance add the index:

@flex.button(:id => “myRepeaterButton”, :automationIndex => “index:1”)

Diffrence between id, automationName and automationValue

When creating a Flex application, you may set the id of an component. This id will always be the id of the component, and you will be able to reach this component by :id => ‘the-id-of-the-component’.

If your component has some visible text or a label like a button or a regular text. Then the label or text will become the automationName and the automationValue. So if you have a button as above with a label Click Me, you can reach this by using :automationName => “Click Me”.

Syntax

# getting the list with the name listName
list = @flex.list({:id => 'listName'}) 

# selecting the item with value Arizona on the list
list.select('Arizona') 

# getting the datagrid with the name dg
data_grid = @flex.data_grid({:id => 'dg'}) 
# getting the values for the 4 first rows in the grid
data_grid.values(0,3)
data_grid.num_rows

# selecting a row in a datagrid
data_grid.select("*Peter Motzfeldt* | 555-222-22222 | peter@fictitious.com")

# drag and drop
data_grid.drag_start("*Peter Motzfeldt* | 555-222-22222 | peter@fictitious.com") 
data_grid_drop.drag_drop('copy') 

Get help

Please get in touch here:

The FunFX team