Flex charts automation

Last few months, I was looking for solutions to automate flex charts. Charts automation is different from other GUI functionality automation. Idea is to develop the framework or reusable library, which is the combination of charts and flex objects. Flex is a new technology and support is critical. In other end, Charts verification is different than regular testing. In charts, tester needs to validate the values, position of axes, ticks and colors etc.

I was going through few articles and blogs for flex automation. I tried few commercial tools and few open source tools. I couldn't see any tool is fitting for my requirements. Many tools are having support for Flex environment. But none of the tools are supporting chart automation context sensitive based.

Flex chart requirements

1. Each pie or bar value
2. Data point value for each chart area
3. Data tip or tooltip for each pie or bar or data point
4. The color series for each object pie or bar or line)
5. Each axis tick ( X, Y and Y2 axes)
6. Font style, font size, font color for any object within chart
7. Data label (pie or bar or line)
8. Identify legend names
9. Chart header and footer
10. Axis values or labels

Flex component automation with Silktest

Overview about Flex
Adobe Flex is a collection of technologies released by Adobe Systems for the development and deployment of cross-platform rich Internet applications based on the proprietary Adobe Flash platform. MXML, an XML-based markup language, offers a way to build and lay out graphic user interfaces. Interactivity is achieved through the use of ActionScript, the core language of Flash Player that is based on the ECMAScript standard.

The Flex SDK comes with a set of user interface components including buttons, list boxes, trees, data grids, several text controls, and various layout containers. Charts and graphs are available as an add-on. Other features like web services, drag and drop, modal dialogs, animation effects, application states, form validation, and other interactions round out the application framework.

For more info, visit Flex Wiki page Wiki - Adobe Flex

Help from Vendors
Adobe has developed few libraries to support test automation for flex components. To know more about these libraries, you can go through following links.

• Creating Applications for Testing
• About automating applications with Flex
• Tasks and techniques for testable applications overview
• Compiling applications for testing
• Creating testable applications
• Understanding the automation framework

Borland has given a separate document for flex configuration. You can search in Borland site for ‘QuickTour_Flex.pdf’. Similarly Adobe has published a document ‘Flex2_at_api.pdf’ for Testing Flex Components.

Even Silktest Help documentation contains few pages for Flex and Open Agent. You can check following Silktest Help pages:

• Testing a Flex Sample Application Using a Dual Agent Approach
• Enabling Extensions Automatically Using the Basic Workflow
• Enabling Extensions for Embedded Browser Applications that use the Classic Agent
• Configuring Security Settings for Your Local Flash Player

Silktest Flex API
As a first step, we need to copy Silktest flex library before building Flex components.

1. Navigate to Windows Explorer -> Silktest_Installed_Directory\ng\AutomationSDK\Flex\3.0\Automation
2. Copy FlexTechDomain.swc
3. Paste into C:\Program Files\Adobe\Flex Builder 3\sdks\3.1.0\frameworks\libs
4. In this libs folder, you can see few more files such as automation.swc, automation_agent.swc & automation_dmv.swc

Change in Flex XML configuration
To change flex-config.xml

1. Navigate to Windows Explorer -> C:\Program Files\Adobe\Flex Builder 3\sdks\3.1.0\frameworks

2. Open flex-config.xml and set the following:

   <include-libraries> <library>/libs/automation.swc</library> <library>/libs/automation_agent.swc</library> <library>/libs/FlexTechDomain.swc</library> <library>/libs/automation_dmv.swc</library> </include-libraries>NOTE: Remove the comments for include-libraries tag.

Flex Compiler Settings

1. Open the project.
2. Project Menu-> Properties.
3. Select Flex Compiler.
4. In additional compiler constants, set the following:
   -include-libraries "${flexlib}/libs/automation.swc" "${flexlib}/libs/automation_agent.swc" "${flexlib}/libs/FlexTechDomain.swc"

Browser Setting

To set security settings for Flash Player:

1. Navigate to FlashPlayer Setting
2. In Global Security Settings, select radio button 'Always Allow'.
3. From the Edit Locations drop-down menu, click Add Location.
4. Click Browse for folder and navigate to the folder where your local application is installed.
5. Click Confirm and then close the browser.

To Enable JavaScript:

1. In Internet Explorer 6.0 and 7.0, Choose Tools/Internet Options.
2. Click the Security tab.
3. Click Custom level.
4. In the Scripting section, under Active Scripting, click Enable and click OK.

Settings in Silktest

1. It is important to start the Open Agent before starting your flex application.
2. Enable extensions for flex
3. Check your include files (From Options menu-> Runtime). Flex.inc and flexDataTypes.inc files should be included in the UseFiles. I have given a sample UseFiles value of a simple project below:
   D:\Flex\MyFlex1\frame.inc,extend\explorer.inc,extend\xBrowser\xbrowser.inc,extend\Flex\Flex.inc,extend\Flex\FlexDataTypes.inc,extend\WIN32\WIN32.inc