In case you are using flexunit ant task with your flex builds and you are used to failed builds with haltonfailure=”true”, you may notice that junitreport task is not executed when unit tests fails. Without having test reports, it does not give you much info about what went wrong. Fortunately, there is a solution using attribute failureproperty and fail ant task. Here is a quick ant build config to generate junitreport report for failed unit tests followed by build fail.

<flexunit toDir="${basedir}/${OUTPUT_DIRECTORY}"
    workingDir="${basedir}/${OUTPUT_DIRECTORY}"
    haltonfailure="false" verbose="true" localTrusted="true"
    failureproperty="flexunit.failure"
    swf="${basedir}/${OUTPUT_DIRECTORY}/TestRunner.swf"/>

<mkdir dir="target/surefire-reports" />

<junitreport todir="target/surefire-reports">
    <fileset dir="${basedir}/${OUTPUT_DIRECTORY}">
        <include name="TEST-*.xml"/>
    </fileset>
    <report format="frames" todir="target/surefire-reports/html"/>
</junitreport>

<fail if="flexunit.failure" message="Unit test(s) failed. See reports!"/>

Notice: haltonfailure, failureproperty, fail

Where to go from here:

• Quick Tip: FlexUnit & ANT

At the same time I released YCanvas, I have spotted an interesting starling experiment. I realized I can do this for YCanvas easily with Remotair. Remotair is a concept of transmitting device inputs (gestures, accelerometer, camera etc.) into receiving flash or AIR application. Consists of one transmitting app installed on a mobile device or a tablet and one receiving app running on a PC. In order to pair transmitting and receiving application, RTMFP protocol is used. Implementing remotair reciever into any flash application takes only a few minutes, I spent much more time on touch + multitouch implementation with transitions. At the end of the day, I was able to remote controll YCanvas application with BlackBerry Playbook.

If you want to try it yourself, YCanvas application is available on ycanvas.yoz.sk/remotair, and you can download free Remotair app for Playbook or Android devices from markets. Source is available on ycanvas.yoz.sk.

1. download Remotair application to your device
2. open and click connect, you should recieve a channel id (e.g. 1008)
3. open ycanvas.yoz.sk/remotair on your pc
4. notice white TextInput on top-right position, insert channel id (e.g. 1008) and press enter.
5. device get paired with your pc and after that you should se “Touch” option in Remotair application, click it to open Touch view
6. use one-finer or two-finger gestures to remotely move, rotate and scale application on a pc

Hello YCanvas, who are you? I am an open source ActionScript 3 library that provides stage3D (GPU) engine for perfectly overlapping grid based zooming projects like world maps or onBoard. What? Ok, I am the engine that statnds behind onBoard, and I can handle much more. I can implement Wall Of Fame, WebCanvas, MapQuest, ArcGIS, Open Street Map or do some experiments like Flickr gallery, all this in one flash, few lines (10-20) of specific code per mode, all running at 60 FPS. Anyhing else would you like to see implemented? Just let me know… Do you want to know more and see it in action?

Enough talking, now impress me!

This is YCanvas explorer demo (run fullscreen), you can find sources on repository.

There is also simpliest possible implementation of YCanvas available with sources as well.

FAQ:

Q: Can you run on mobile/AIR?
A: Comes hand in hand with Stage3D available in AIR for mobile.

Q: Can you run google maps?
A: Technicaly yes, on AIR there is no problem at all. In case of Flash Player, however, engine uploads BitmapData to graphic cards, in order to upload it you need the access that would be granted via crossdomain.xml, and unfortunately google maps domains do not serve one.

Q: What are the requirements?
A: wmode=direct, flash player 11.1

Q: Do you have a CPU fallback in case there is no GPU available
A: Not yet.

Q: Do you have a support for moving, rotating, zooming?
A: The YCanvas api lets you set all of these manualy, or you can use available util classes in case you want to rotate around specific point or zoom to specific place. Checkout demo and explorer sources in repository.

Q: Do you have multi touch support, gesture suppport?
A: Yes, have a look at ApplicationRemotair in sources. You can use two finger gestures to move, rotate, scale.

Q: Do you have implementation for drawing?
A: Yes! Any display object on stage can be applied/drawn as simple as by calling one function. Read more in asdoc.

Q: I like it and I want to support. How?
A: Cool, feel free to donate via PayPal here. Thank you.

Even if you have worked already with flexunit task in ant, it may not be obvious that there are 2 ways to execute it. First, you can compile runner.mxml to .swf prior to flexunit task or you can force flexunit task to generate/compile runner for you. Now lets have a look at pros and cons of those 2 solutions. Unfortunately it seems the flexunit ant task development has stopped sometime a year ago, and a few features are missing in order to call this task perfect, so it seems we are left in wild with what we have…

Running compiled runner.mxml

<flexunit toDir="..." workingDir="..." haltonfailure="true" verbose="true" localTrusted="true" swf="runner.swf"/>

• simple one line definition
• requires runner.swf to be compiled prior to the task (you can use mxmlc task)
• your runner.mxml is a static file containing predefined test cases/suites, there is no simple way you can dynamicaly force test cases/suites to be tested

See more details for flexunit ant task in wiki.

Here is an example of a simple runner.mxml:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
	xmlns:flexUnitUIRunner="http://www.adobe.com/2009/flexUnitUIRunner"
	creationComplete="runTests();" layout="absolute">
	<mx:Script>
		<![CDATA[
			import org.flexunit.listeners.CIListener;
			import org.flexunit.listeners.UIListener;
			import org.flexunit.runner.FlexUnitCore;

			public function runTests() : void
			{
				var core : FlexUnitCore = new FlexUnitCore();
				core.addListener(new UIListener(uiListener));
				core.addListener(new CIListener());
				core.run(MyTestSuite);
			}
		]]>
		</mx:Script>
	<flexUnitUIRunner:TestRunnerBase id="uiListener" width="100%" height="100%"  />
</mx:Application>

Running dynamically generated runner

<flexunit toDir="..." workingDir="..." haltonfailure="true" verbose="true" localTrusted="true">
    <source dir="${basedir}/src" />
    <testSource dir="${basedir}/src">
        <include name="**/*Test.as" />
        <include name="**/*Test.mxml" />
    </testSource>
    <library dir="${FLEX_HOME}/ant/lib">
        <include name="**/*.swc" />
    </library>
</flexunit>

• lets you dynamically define test cases/suites to be included for testing (testSource)
• lets you define libraries and sources to be included, but that is where it ends (source, library)
• does not let you define additional compiler arguments (theme, flash player version, resource bundles etc.)

Make sure to define flexunit task in ant, if you do not have .jar file, just download the latest from flexunit.org or adobe.com, and do not forget to copy necessary .swc classes into your libs dir.

<taskdef resource="flexUnitTasks.tasks" classpath="${FLEX_HOME}/ant/lib/flexUnitTasks-4.1.0-8.jar"/>

JUnit reports

This task should be defined and available in ant, but in case it is not (you run ant from maven), just include taskdef and target .jar files (should be available with ant download package)

<taskdef name="junitreport" classname="org.apache.tools.ant.taskdefs.optional.junit.XMLResultAggregator">
    <classpath>
        <pathelement location="${FLEX_HOME}/ant/lib/ant-junit.jar" />
        <pathelement location="${FLEX_HOME}/ant/lib/ant-junit-4.jar" />
    </classpath>
</taskdef>
...
<junitreport todir="target/surefire-reports">
    <fileset dir="...">
        <include name="TEST-*.xml"/>
    </fileset>
    <report format="frames" todir="target/surefire-reports/html"/>
</junitreport>

Where to go from here:

• Run Flex Unit Tests from ANT

onBoard is a massive collaborative painting and drawing canvas where you can draw, sketch, paint, zoom, rotate, screenshot or post your drawing to facebook. See other users drawing live. Today, I am releasing 3rd version (1st, 2nd) that is a little different than the previous ones. It takes advantage of Starling Framework and YCanvas and runs on GPU at 60fps, smoother than any before. For now there is a new web version available with old drawing and other tools. Mobile versions are currently not available. I am also working on a canvas/grid framework called YCanvas that is available on github (more information with next blog post). Have a look and compare cpu vs. gpu versions of onBoard…

onBoard v2 – cpu

onBoard v3 – gpu

Notice the smooth rotation, and no render glitches with gpu version. Best performance with non-debug flash player.

After a few months off from mobile development, I realized I have forgotten all the necessary developer, application and market links for my Android, iOS, BlackBerry applications. Furthermore, it took me some time to gather them all back together as well as market deeplinks for all environments. So, I have decided to put the list together that will help me catch much faster next time.

Android

• Developer & Application administration
• Market schema details
• desktop -> market:
  https://market.android.com/details?id=<package_name>
• phone -> market (detail):
  market://details?id=<package_name>
• phone -> market (search result):
  market://search?q=pname:<package_name>

iOS

• Developer administration
• Application administration
• Market schema details, more details, podcasts
• desktop -> market:
  http://itunes.apple.com/us/app/onboard/id<applicationid>?mt=8
• desktop -> itunes:
  http://itunes.com/apps/<applicationname>
• phone -> appstore (direct):
  itms-apps://itunes.com/apps/<applicationname>
• phone -> appstore (itunes redirect?):
  itms://itunes.com/apps/<applicationname>
• phone -> appstore (old):
  http://phobos.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=<applicationid>&mt=8

BlackBerry Playbook

• Developer administration, Signed Keys
• Application administration
• Tablet developers home
• desktop -> market:
  http://appworld.blackberry.com/webstore/content/<applicationid>
• tablet -> appworld:
  http://appworld.blackberry.com/webstore/content/<applicationid>
• tablet -> appworld (suggested all over the internet, but does not work for my playbook):
  http://appworld.blackberry.com/webstore/clientlaunch/<applicationid>

Market schemas (deeplinking) is especially useful to generate QR codes. You can try the following QR codes with your mobile device to access my application directly in application market. Codes were generated by open source project zxing.

Here is a simple zxing wrapper class for generating QR codes to bitmapData

package
{
    import com.google.zxing.BarcodeFormat;
    import com.google.zxing.common.ByteMatrix;
    import com.google.zxing.qrcode.QRCodeWriter;

    import flash.display.BitmapData;

    public class QRUtils
    {
        public static function generate(link:String, width:uint, height:uint):BitmapData
        {
            var writer:QRCodeWriter = new QRCodeWriter;
            var format:BarcodeFormat = BarcodeFormat.QR_CODE;
            var byteMatrix:ByteMatrix = (writer.encode(link, format, width, height)) as ByteMatrix;
            var bitmapData:BitmapData = new BitmapData(width, height, false, 0x009900);
            for(var y:uint = 0; y < width; y++)
            for(var x:uint = 0; x < height; x++)
                bitmapData.setPixel(x, y, byteMatrix._get(x, y) == 0 ? 0x000000 : 0xFFFFFF);
            return bitmapData;
        }

        /**
         * Generates QR code link to Android Market to be accessed by Android Device
         * usage: generateAndroidMarket("air.sk.yoz.remotair", 300, 300);
         */
        public static function generateAndroidMarket(appId:String, width:uint, height:uint):BitmapData
        {
            return generate("market://details?id=" + appId, width, height);
        }

        /**
         * Generates QR code link to App Store to be accessed by iPhone/iPad Device
         * usage: generateAppStore("onboard", 300, 300);
         */
        public static function generateAppStore(appName:String, width:uint, height:uint):BitmapData
        {
            return generate("itms-apps://itunes.com/apps/" + appName, width, height);
        }

        /**
         * Generates QR code link to App World to be accessed by BlackBerry Playbook device
         * usage: generateAppWorld("21076", 300, 300);
         */
        public static function generateAppWorld(appId:String, width:uint, height:uint):BitmapData
        {
            return generate("http://appworld.blackberry.com/webstore/content/" + appId, width, height);
        }
    }
}

Where to go from here:

• zxing – Multi-format 1D/2D barcode image processing library with clients for Android, Java (and actionscript)
• QR Code Generator from the ZXing Project
• SocialQRCode – Create Social QR Codes in minutes.

The title may sound like there are two possible ways how you can have your source code analyzed and published to sonar, but you better do not rejoice prematurely. After spending couple of hours trying to figure out how to make it work using ant I may have hit some nice articles, however sonar-ant-task seems to have major issues with sonar version 2.8. The solution is maven!

First of all, for “flex language” sonar uses FlexPMD. Sonar plugin/task should be able to take your source code and evaluate based on FlexPMD dependency. Unfortunately this thing is never done for you in case of sonar-ant-task. Even there is a simple way described you can invoke FlexPMD from Ant (you have to do slight changes for latest FlexPMD version), there is no way sonar 2.8 let you pass these results into its database. Ant way was a no-go for me.

Later I realized we already have some flex projects on sonar, but these get there using maven, while whole projects has been built by maven (flex-mojos). And as Sonar was initialy developed for maven, it is integrated really nicely. Even my current project is not being built by maven, there is a way to use minimal configuration just for sonar. It appeared there are already some maven – sonar config examples, all I needed to do in addition to this was adding pluginManagement, while we are not using latest maven version:

<build>
	<sourceDirectory>...</sourceDirectory>
	<pluginManagement>
		<plugins>
			<plugin>
				<groupId>org.codehaus.mojo</groupId>
				<artifactId>sonar-maven-plugin</artifactId>
				<version>1.0-beta-2</version>
			</plugin>
		</plugins>
	</pluginManagement>
</build>

Finally, the day was saved thanks to maven. So my preference to use maven or ant is 50:50 because, even if ant seems much easier to use, there are some thing that you just can not do for now.

Where to go from here:

• Frequently Asked Questions
• Analyse with Ant Task
• Sonar ANT Task – [closed]
• Reusing Flexcover reports with Sonar/Ant (No Maven Repo)
• Reusing Flexcover reports with Sonar/Ant (No Maven Repo)
• Reduce dependency on Maven

While there is not much source available out there about how to prepare QTP (HP QuickTest Professional) automation test environment working with flex applications, I decided to write this post. It is not clear, nor straightforward for one who never ran QTP, and while I spend just a few hours preparing the test environment, I hope this article will help some of you to get started much faster. Basicaly what you need is QTP 11, Internet Explorer 8 (unfortunately), Flex Automation Plug-in and flex automation framework (.swc classes)…

First you need to download and install QTP from HP. To locate a download link appeared to be a few hour investigation thanks to internet full of broken links. Finally I hit this nice article Update: Download and Install QTP describing all the download process hell. Basicaly downloads are available after login on hp.com and you should be looking for HP Functional Testing 11.00 Evaluation. There were some installation steps and additional dependecies and software within the installation, but default settings worked for me.

Next, I spend few hours looking for a valid firefox or chrome plugin to work with QTP, but unfortunately non worked. After I surrendered and decided to use Internet Explorer, it appeared that only IE 8 worked with QTP 11. Does it need any comment describing my anger downgrading to version 8? … yeah, you just have to, no other way.

Once you have QTP 11 and IE 8 installed, you should be already able to do some recording with html webpages etc.

Flex Automation Plug-in from Adobe contains .bat executables that register proper .dlls so that is not much work with it, just download and run.

There are 2 possible ways described on Adobe Help of how you can make flex qtp framework work for your application. You can “include-libraries” directly into your app or you can create an application wrapper with libraries included that loads your application.swf via SWFLoader. I played with the idea of having the automation framework classes available through PreloadSWF in mm.cfg (some more reading about PreloadSWF) but it appeared that the classes from preloaded .swf appears in different application domain… and while automation framework classes are unfortunately initialized staticaly (mixin), there is no elegant way to initialize them on components on different application domain. I end up with my custom wrapper, that has some changes against the template from flex sdk (…/4.1.0.16076/templates/automation-runtimeloading-files/runtimeloading.mxml):

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
                xmlns:s="library://ns.adobe.com/flex/spark"
                xmlns:mx="library://ns.adobe.com/flex/mx"
                creationComplete="init()">
    <fx:Script>
        <![CDATA[
            public function init():void
            {
                var pointerKey:String = "automationswfurl";
                var variables:URLVariables = new URLVariables;
                for(var key:String in parameters)
                    if(key != "automationswfurl")
                        variables[key] = parameters[key];

                swfLoader.loaderContext = new LoaderContext(false, ApplicationDomain.currentDomain)
                swfLoader.source = parameters.automationswfurl + "?" + variables.toString();
            }
        ]]>
    </fx:Script>
    <mx:SWFLoader id="swfLoader" width="100%" height="100%"/>
</s:Application>

… and ant build script:

<?xml version="1.0" encoding="UTF-8"?>
<project name="AppStudio application" default="main">
	<taskdef resource="flexTasks.tasks" classpath="${FLEX_HOME}/ant/lib/flexTasks.jar" />

	<target name="main">
		<mxmlc file="${basedir}/src/main/flex/QTPWrapper.mxml" output="${OUTPUT}" target-player="${TARGET_PLAYER}"
			static-link-runtime-shared-libraries="false" debug="${DEBUG}">
			<compiler.include-libraries dir="${FLEX_HOME}/frameworks/libs/automation" append="true">
				<include name="automation.swc" />
				<include name="automation_agent.swc" />
				<include name="automation_dmv.swc" />
				<include name="automation_flashflexkit.swc" />
				<include name="automation_spark.swc" />
				<include name="qtp.swc" />
			</compiler.include-libraries>
		</mxmlc>
	</target>
</project>

There were some more issues and random compile time as well as runtime errors exceptions after including flex automation and qtp libraries, however some unexpectedly disappeared with release build and some were manualy investigated and removed.

Where to go from here:

• Configuring Flex application using tools
• Steps required to automate a flex application
• Flex samples: Automation API sample applications
• Installing Flex 4 Plug-In for QTP
• Compatibility Matrix for Flex QTP plugin 3.0.0 and 4.5.0 for QTP and IE combinations

There are some usefull apis since Flash Player 10, I have never been playing with. Yesterday, I realized one experiment with Sound + SampleDataEvent and created quick demo for converting music into a bitmap and vice versa.

There is a Sound.extract() method in ActionScript allowing you to grab raw sound data from a sound object. It provides you ByteArray of 32-bit floating-point values, which can be converted to a Number using ByteArray.readFloat(). The resulting values are -1 < value < 1...

I tried to add and multiply the Number to get unsigned integer and it appeared that only first 16 bytes are changing while the rest 16 remains unused (0xffff). I did not get any further to investigate if it is related to the type conversion or its a limitation of Sound api. While for BitmapData you provide 32 values (unsigned integers) and the converted sound value use only 16, next 16 bites can store additional sound value. That perfectly fits for left + right channel. BitmapData handles 32-bit ARGB values. In my case, left channel will occupy first AR, right channel GB values, so please do not expect the result to be Mona Lisa portrait, but rather it is a chaotic (noise like) color and alpha result. Following image contains 5 seconds of Vivaldi:

If you are able match image width with music rythm, some more interesting result may appear. And here is the demo player:

Sound In Image – wonderfl build flash online

There is a lot of commented code in the demo, feel free to uncomment for generating images from your mp3s.

Some quick math about image size vs. music length:

• in sound, the audio data is always exposed as 44100 Hz stereo
• so there is 88200 32-bit floating-point values per second (left + right channel)
• two values can be stored in a pixel, that results in 44100 pixels per second
• that means you can store almost 18 seconds in 1024×768 ARGB image

It would be nice to see how can image compression, watermark etc. affect the resulting sound/size. Or how would some image filters affect the resulting sound… A lot of experiments ahead

With my latest approach to create universal parser, I came up with something simple yet mighty. SequenceParser is a simple (30 lines) class that crawles any source and matches specified list of highly customizable ISequences. While each sequence can contain list of nester sequences, you are able to parse any type of source with nested conditions and sequences. A good example can be an attribute inside a xml node, a xml node inside a xml node, an escape character inside quotas etc.

I have also created some example sequences like MatchAnything, MatchRegexp, MatchString, StartRegexpEndRegexp, StartRegexpEndString, StartStringEndString that should help to cover almost any possible parsing scenario. These sequences notifies back via callback containing parsed string, that is vital for further bulding additional logic like highlightning, validation over parsed phrases.

Here is a simple example of css parsing and highlighting via SequenceParser:

SequenceParser – wonderfl build flash online

Here is an example of parsing and validating pseudo serch queries:

SequenceParser – Query Validator – wonderfl build flash online

… and a JSON decoder:

SequenceParser – JSON decoder – wonderfl build flash online