What are Best Practices when using FlexUnit?

This question comes in from John, one of the regular attendees of the Flextras Friday Lunch. He asks me about unit testing and some best practices.

I have played with FlexUnit and done all the tutorials [I could find] and understand conceptually how unit testing works. What I've not been able to easily find out, for the newbie who is trying to get into TDD, do you keep your FlexUnit tests in your application project and develop classes around them that pass those tests or do you run a parallel project that runs unit tests. It would seem to me that the former would be true if you actually want to test each time you make a major change or add a class, but hell if I want to go down a long road to find out that nobody really puts their unit tests inside their real project.

I have gone through the exact same issues that John has had with unit testing and lack of documentation on the approaches. I have come up with no concrete answers and am not sure what folks would consider a best practice [or not]. But, I can tell ya'll what I did when writing unit tests for the Flextras Calendar.

I keep the unit tests in a separate project. Since most of my work is with creating components, the code I care about testing is already in a library project. From there, I just create an AIR project strictly for unit testing. I do it in AIR because then I don't have to set up a web server and/or directory for the new project.

The main application is just an instance of a runner, which loads a test suite, which has a bunch of test cases. The real testing magic is in the test cases, of course.

I cover this approach in The Flex Show's extended screencast series on building Flex Components, which is available for purchase.

Now, I understand that Flash Builder 4 has some built in unit testing features, including a view that will act as the test runner. I thought it also had the ability to keep tests in the same code as the project that you want to run tests against. I was never able to get it to work during the prerelease cycle and haven't tried since the official release. In fact, the unit testing that I have written were written against FlexUnit 1. At the time I was writing unit tests for the Flextras Calendar, that was the only unit testing framework I could find any documentation on.

I respect the fact that FlexUnit 4 probably has a lot more features, but having features and giving me the information I need to make use of them are two different things.

How do you guys use unit testing in your projects? Have you had luck with Flash Builder 4's features?

I'll add that one of the aspects of Test Driven Development is that you should write your tests first. In theory this is a great idea, but I don't think it is practical in the real world. Does anyone really do that? Does anyone really work in an environment were they have time to do that? A lot of the consulting I do is "come in and save the day" type of stuff. I'm rarely put in situations where I'd be writing tests first; and I've never come across a client who does it. Maybe the programmers who do don't need to hire folks to come in and save the day?

I love fielding questions from readers (and listeners). If you have one, a href="http://www.jeffryhouser.com/contact.cfm">Please ask. I can even take confidential questions over at www.asktheflexpert.com, or you can put me on the spot life at a Flextras Friday Lunch recording session.

Be sure to come visit me at the Flextras booth at 360Flex in DC this September. Order you tickets with this link and I get Karma points from the 360|Flex folks. If you ask real nicely I may be able to get you a discount code.

Jeffry Houser's 360|Flex DC Speaker Interview

My speaker interview for 360|Flex DC just got posted. Go read it here.

It's a great thing to read if you wanted to join the current 360|Flex ticket giveaway contest currently happening over at The Flex Show. It might give you a hint as to our trivia answer.

You can register over here and I'll get Karma points from the 360|Flex folks if you use this URL.

How do you Apply CSS Styles to a Flex Accordian?

This question comes in from Johnny, one of the folks I met at 360Flex in San Jose:

How can I apply a global styles for all my accordions and datagrids?

Johnny sent me some code to, which I would have expected would work. But, since he said it didn't I did my own research. First I headed over to scalenine.com. Scale nine is a great site all about skinning in Flex and it has plenty of sample themes. I chose one, named brownie and opened up the code.

The main style sheet included something like this:


Accordion {
backgroundColor: #3e3e3e;
headerStyleName: accordionHeader;
borderColor: #22201E;
fontSize: 10;
}

This code will define the global styles for all Accordion's in the Flex application. In the main application file, the style sheet is imported like this:


<mx:Style source="assets/css/Main.css" />

I downloaded the project files, imported it into the project into Flash Builder and tried the code against the Flex 4.1 SDK. I needed to create a libs directory and recreate the html-template directory. After that I Was able to get it to run, but the styles didn't show up.

There were a lot of warnings which said that "type CSS Selector must be qualified with a namespace." I had to add a namespace to the css file:


@namespace mx "http://www.adobe.com/2006/mxml";

And then qualify the Accordion style, like this:


mx|Accordion{
// style data
}

After that the accordion was properly styled.

You can set styles on other Flex Components using the same approach.

Do you have a question? Please ask. I can even take confidential questions over at www.asktheflexpert.com, or you can ask me "live" at a Flextras Friday Lunch Connect Session.

Be sure to come visit me at the Flextras booth at 360Flex in DC this September. Order you tickets with this link and I get Karma points from the 360|Flex folks.

How do you learn Flex?

Does this question come up a lot? This time, someone contacted me through LinkedIn asking for resources on how to learn Flex.

I am student of Masters in IT. My current skills involve Java technologies and Cloud Computing. But I am keen interested in learning Adobe Flex. I am learning but don't know whether I am heading towards right direction. I want to know from where I should learn Flex. What should be the method to learn Flex. I want to learn something like integrating flex and Java.

There are a lot of places to go to learn about Flex development. Most people, including me, start with the Adobe documentation and plug through that. Then we look for resources to fill the gaps left by the Adobe Documentation.

Tons of books exists. The O'Rielly seem to be popular, as are the Training from the Source books. You can take a look at Adobe's Flex in a Week sessions. I believe Lynda.com and TotalTraining also have courses available.

My primary podcast, The Flex Show, provides a bunch of free screencasts on various topics. I also produce the Flextras Friday Lunch which is more free form but covers a wider range of topics.

If you can make it out to some of the conferences, I strongly recommend 360|Flex coming up in DC. Register with this link and I get kick backs. There are often different events worldwide, though.

I don't know of any specific resources for combing Flex with Java, though.

What recommendations would you guys have?

Flextras Sends Unemployed Developers to 360|Flex

I believe that 360|Flex is the best Flex conference out there; so in conjunction with the organizers, we are working together to send some unemployed folks to 360|Flex in DC. This is a great way for you to get your feet wet on one of the hottest technologies out there.

You can read my high praises of 360|Flex over at on the Flextras blog or jump right to the promotion on the 360|Flex Blog.

If you're not unemployed, but you're a member of the Flex Community or want to learn, I strongly recommend you make it out to the conference. Give me some kudos by registering with this link.

How do you Create Templates in Flash Builder?

This question comes in from TJ, a listener of my second podcast, the Flextras Friday Lunch.

I read the docs and watched your video on this topic but I am not able to find out how to add new templates to Flash Builder. Do you know if it is possible to add new templates and where could I find this info if possible?

As far as I know, there is no way to create new templates through Flash Builder. You can only editing the existing templates. I think it's a pretty cool feature, but I also wish we could create new ones easily.

To create new templates, you're best bet is to look into creating an Eclipse plugin. As far as I know, this can't be done in ActionScript, so you'll need to create it in Java, or possibly CFML if you're a ColdFusion Developer and using ColdFusion Builder.

TJ also told me something interesting:

I even was able to find the source xml file (default_asfiletemplates.xml) in the com.adobe.flexide.as.core package on my local machine. I have played with this file along with editing and exporting others and trying to import to see if I can create more templates from the new nodes, but it doesn't work.

So, there is some XML file that seems to define the templates. I haven't taken a look at this file, but it does seem intriguing that this file exists. I found two instances of the file on my local machine, one for Flash Builder 4 an one for the 4.01 update. In each directory, there is a properties file. I would bet you'd have to edit both the property and XML file to add a new template, if possible.

There are also similar property files and XML files in com.adobe.flexide.css.core_4.0.1.277662 for CSS. I assume there are files for MXML and FlexUnit types too.

By modifying both the properties file and the XML templates file, I was able to get a quarter of the way there.

First, add a line like this to the end of the property file:


ASFileTemplates.NewJClass.Name=J Class

And add a new template entry in the XML file:


<template name="%ASFileTemplates.NewJClass.Name"
id="com.adobe.flexide.as.core.filetemplates.newjclass"
description="%ASFileTemplates.NewASInterface.Description"
context="new_actionscript_interface" enabled="true"
>

<![CDATA[${package_declaration}
{
    ${import_declaration}
    ${interface_declaration}
    {
        
    }
}]]>

</template>

You'll see something like this:

Unfortunately, the code appears to confuse the display a bit. And the "ActionScript" interface sort of runs into my new class. I assume this is because I Saved them in the wrong format and/or used Windows Notepad which uses different end of line characters than some other operating systems.

But, even though I have a new file type listed; there was no way to create a file from the new template from the "File New" menu. I assume you have to edit another config file somewhere for that purposes.

Can anyone take this to the next step? How about you stop by the Flextras booth at 360|Flex in DC and show it to me?

How do you Extend RemoteObject?

Someone saw this old thread from the FlexCoders list and e-mailed me one solution. This was the question:

I'd like to have a custom remoteobject for specific error handling and logging. However, if I try to extend remoteobject:

public dynamic class CustomRemoteObject extends RemoteObject { ... }

It is completely unusable in an mxml file. If I try to declare any inside of it, I get a "could not resolve to a component implemenation":


<components:CustomRemoteObject>
<mx:method ...> <!-- compiler error -->
</components:CustomRemoteObject>

I know that is special-cased by the compiler because it doesn't have a component implementation. Is there a way to use custom remote objects in mxml with the mx:method tag? If not, is there a way to use custom remote objects in mxml and have callbacks at the method-level? Is remoteobject not supposed to be extended this way?

My answer at the time was to try this:


<components:CustomRemoteObject>
<components:method ...>
</components:CustomRemoteObject>

However, I doubt that works. As the original poster had stated, the method tag appears to be a compiler kludge. You can't extend RemoteObject and specify the methods in the same way. The method tags are not specified as an array and method is not a property on the RemoteObject class. I bet the compiler turns all the method tags into an operations array, although I haven't checked actual generated code.

The real solution to generating is to review the generated code from the Flex Compiler in a template that uses RemoteObject w/ multiple method tags and then figure out what it does; then replicate that approach in your own ActionSript.

What are some Open Source UI Testing Tools in Flex?

This question comes in from "P" and I'm kind of stuck to give him an answer.

I need to implement TDD in our flex application and condition is that we need to use a open source. My application is primarily has drag and drop functionality. I tried and analyzed several Test automation tools such as FlexMonkey, webdriver etc. they work fine till some extent.But they fail to recognize drag and drop actions and customcomponents.

Basic problem is that all Automated Testing tools identifies 'id' to perform any action. And in case of drag and drop all ids are generated on runtime Can you please suggest me any tool which can help or any change in my code which can help.

I'm at a bit of a loss. Obviously from P's question he needs a UI Testing tool; and FlexMonkey is the most well known in the Flex world. But, it wouldn't work for him.

I said that to get FlexMonkey to work with custom components, he may need to create a custom automation delegate and recompile Flex Monkey. But, I could never get that to work myself and eventually had to put it aside to focus on other things.

So, dear readers, what would you suggest? Are there other options out there?


I do like fielding questions from the audience, and have been doing a lot of that over on Stack Overflow and the Flextras Friday Lunch Podcast.

If you have questions feel free to ask me privately or stop by a Flextras Friday Lunch session.

You can get personal, confidential help from me [with screen sharing] via www.AskTheFlexpert.com.

You can also fine me at 360|Flex in DC this September.

Do ColdFusion and Flex really place nice together?

A comment came in on one of my earlier blog posts; and I thought the conversation was interesting enough that I'm promoting it to a post.

The original blog post was about getting ColdFusion and Flex to share objects (CFC and ActionSCript Classes) back and forth. There is a cool automatic conversion from CFCs to ActionScript objects provided by the built-in ColdFusion AMF Gateway.

To make this work you have to specify the properties in the CFC, and the ActionScript object in the same order, using the same case sensitivity, and with the same data type. This is where Ionectu drops in:

"Adobe has gone through a lot of trouble to make sure that ColdFusion and Flex play really nice together"

Translation : `Adobe` is retarded and here`s why, it`s quite simple.

With compilable languages, It`s a must to at least pretend to be able to create it once and leave it alone. It`s OOP not HTML ... amf remoting is `dependency central`. NORMAL people need to be able to change one end and not scrue up the entire thing, this is what development is about (in part), continuity, to have a flow that can be easily redirected.

Amf remoting remindes me of something along the lines of

if(this.file == "index") displayPage(1); else if(this.file == "page2") displayPage(2); else if(this.file == "page3") displayPage(3); else if(this.file == "page4") displayPage(4); else buy a hamster and teach it oop, it`s gonna come up with something better than Adobe did

The hell ?! Are all Adobe employees Google or Microsoft "rejects" ? (that`s not a nice thing to say, I know and I`m sorry, I`m just really pissed off, it just rubs me wrong.)

I, personally, think it is a big leap to call Adobe retarded for the Flex Remoting implementation in ColdFusion. It seems reasonable to me that when two completely separate systems have any similar objects used for the purpose of communicating between these two systems that when you change something on one system a similar change will have to made in the second.

As one example, If you change a database table, you may also have to change a Gateway Object or Data Access Object that relates to that table.

The sole purposes of Value Objects / Data Transfer Objects is to share data between two systems, in our case CF and Flex. IF you make changes to one side of the equation, it makes sense to me that you have to make changes to the other side.

Yes, the exchange is finicky in the order of properties on the objects, the data types of said properties, and the case sensitivity of the property names. CF is not case sensitive--most of the time--but Flex and most programming languages are. I accept the case sensitivity requirement without complaint.

I don't understand Ionectu comparison to the "If" condition. At the end of the day most development is some kind of if condition, isn't it?

I, basically, told that to the commenter, and he followed up:

In, Adobe`s making sure that CF and Flex play nice together they kind of forgot to teach them, how to understand and help each other. At the moment all that they can do is copy values from point a to point b (if you have points defined) (If you don`t you`re better off using wsdl btw). They don`t play nice togheter.. they just copy values from point a to point 1 from point b to point 2, the concept is the simplest I`ve ever seen .... this value goes here, this one here, and .... hm.. yep yep this goes here. Yeah that it. Client.as ....

And if that took them year(s).. well then that`s just sad. They could have spend some time "implementing" some "usability"

How can they as a company think that it`s a success ... "Ok we did it!" .. "To use it you just have to set the same name, set the same position, set an id, on both ends ... and that might do it, I think that`s all". "We`ll call this a ... bridge? no , no, that`s not FLASHy enough.. we`ll call it a protocol.. yeah protocol" ... How can they call that a protocol :wallbash: when clearly it can`t even stand on it`s own "two" feet.

I believe there are huge benefits to using AMF, such as performance and packet size; so I don't agree that we'd be better off using WSDL.

The real question I have is, how else would you implement it? I'm not quite sure.

I can respect that it'd be nice if Flex and CF were a bit more aware of each other.

Why do the properties have to be defined in the same order? Why can't the AMF Gateway use the alias properties in CF and Flex to associate the CFC to the Class and then do some magic to match up properties and data types?

What are your thoughts on this issue?

Want to discuss this in person? Come visit the Flextras booth at 360|Flex in DC this September.

360|Flex comes to Washington DC in September

In my 8th grade year book we had the opportunity to write biographies for each other. Most of them were slightly humorous; and many had us dying in weird and bizarre ways. What happened to me?

After replacing much of my body parts with computer hardware, I electrocuted myself during a failed world takeover by falling into the reflection pool between the Washington Monument and Lincoln Memorial.

I don't want to give away any spoilers, but I strongly recommend you make a trip to 360|Flex DC this September to welcome in my new world order. There will be Zombies involved. Thank you Brian Nolan.

360|Flex, if you didn't know, is my favorite Flex conference, and it will land in DC on September 19th.

You can register here or try to respond to their call for papers and get yourself a presentation spot.

Note: Image stole from http://www.visitingdc.com/memorial/washington-monument-address.htm

More Entries

All Content Copyright 2005, 2006, 2007, 2008, 2009 Jeffry Houser. May not be reused without permission
BlogCFC was created by Raymond Camden. This blog is running version 5.9.2.002.