Robert Penner

AsUnit is my preferred unit testing framework for ActionScript 2 and 3. For years, I used just the AsUnit framework classes and wrote the unit tests myself. I didn't understand exactly what the "XUL UI" did or why I would use it.

But when I finally gave it the old college try, I found that the AsUnit application was quite practical and sped up my workflow. The XUL UI automates some repetitive tasks of Test-Driven Development (TDD):

• Creating a new class: com.example.Widget
• Creating package folders as necessary: com and example
• Creating the unit test class: com.example.WidgetTest
• Creating AllTests suite classes in every package folder that contains unit tests
  

Practically, this means that when I need a new class, I fire up the AsUnit app, type in com.example.Widget, and in seconds I have code skeletons ready to go. It's so much easier to be disciplined about writing tests first when they exist right off the bat.

For more instructions, see this excellent AsUnit tutorial by Tim Beynart.

AsUnit for Windows

If this is at all convincing, you can download the AsUnit XUL UI Windows installer here. (This link is gone from asunit.org at the moment, while Luke Bayes is reorganizing the site.)

AsUnit for OS X

If you're on the Mac, you can download an AsUnit OS X installer provided by Aral Balkan. The build is a little out-of-date, missing a few minor features added since then. However, Aral graciously wrote out his steps for creating the app at the end of his post. Luke is into Git now, so the source for XUL UI is in github.

AsUnit for Vista: Problem and Solution

When I tried to install the AsUnit XUL UI on a Vista machine, the app refused to launch. It seemed as though Vista's increased security was causing problems with XULRunner. The best solution I found was by rhoq on the FlashDevelop boards. You simply create a shortcut to the .exe with the following in the target field:

"C:\Program Files\AsUnit\xulrunner\xulrunner.exe" -app ../xului/application.ini

My shortcut has this in the Start in field, which seems to be necessary: 


Obviously, adjust these to your particular install path.

A Parting Thought

I do Test-Driven Development for many reasons, but mainly because it's fun. Writing tests first is 100 times more enjoyable than writing tests after production code. I'm not even joking when I say "it feels like rock climbing." I'll try to explain this in a later post.

I'm attending the always excellent FITC conference in Toronto. Main sessions started today and I will be posting on Twitter live, provided the wifi stays up (a bit spotty so far). I'll be using the #fitc search tag.

http://twitter.com/robpenner

So far I've attended Alec Cove's Beautiful Algorithms nature-inspired session, and am in the middle of Mario Klingemann's Tinkerer's Box.

Emanuele commented on Keith Peter's blog:

"The reality is that there very little 3D code inside the player, at least native code. Whenever you export a movie that uses the new “3D” features, you’ll notice that about 13KB of AS3 code is attached to it. This code is responsible for the pseudo 3D rendering using same old tricks used by earlier 3D renderers. You see degradation in rendering because those vector objects are transformed into cached bitmaps and handled as texture over triangles. Bitmap resampling algorithms inside the player are pretty good, but not good enough in several situations like this one. The Flash IDE, however, does a good job by making completely transparent to the user that this 3D manipulation is not native to the player itself but rather to silently attached code."

(here comes the snark)
How then am I able to paste one line of code into FlashDevelop and get a perspective-correct 3D rotation?

myMovieClip['rotationX'] = 60;

And my SWF isn't 13 KB, it's 1 KB. So apparently Flash Player 10 doesn't need any "pseudo 3D tricks". Sorry to be Mr. Snarky McSnarksalot, but saying "3D manipulation is not native to the player itself" is just asking for it.

So what is that extra code injected by Flash CS4 actually doing? If you have ASV, you don't have to guess; you can just decompile the SWF and take a look. You won't find any secret calls to drawTriangles(), or even the word "triangle" anywhere (sorry Keith).

What you will find are fl.motion classes. Remember those from Flash CS3? I wrote those to implement the Copy Motion as AS3 feature. For CS4, Rebecca Sun updated them to support 3D properties like rotationX, etc. What happens is that when a CS4 motion tween uses 3D, all of the tween properties are controlled with the Animator3D class. This includes the simple ones like x and y. However, if you don't use 3D, the tween is implemented with SWF tags as it has been for a decade.

Why the dramatic change in tween implementation when you use 3D? It boils down to Adobe deciding not to define new SWF tags for 3D features. I'm not going to comment here on the pros and cons of that decision. The practical result, though, is that 3D motion must be scripted, whether by you or by IDE-generated code. And apparently it's still the case that a movie clip is controlled either by the timeline (i.e. with SWF tags) or by ActionScript. I remember being surprised by this in Flash 4, when one tellTarget to _xscale would break a timeline tween permanently.

The Animator3D class may look complex, but it's not doing any rendering per se; it's doing motion. The rendering code is merely a few assignments to:

this._target.transform.matrix3D

There are a lot of Matrix3D manipulations going on. But they are mainly to convert friendly properties like rotationX to coefficients, and to interpolate between matrices. The Animator and Animator3D classes also have to make all scaling and rotation relative to the transformation point, not the origin. This is trickier than you might think.

I hope this helps explain what's going on with that extra 3D code. The moral of this story could also be a nice tagline for ActionScript Viewer:

ASV: Don't guess what's in your SWF. Know it.

Mika says:

This release is long overdue but there were a few issues that we wanted to resolve and then there were summer vacations...
There are quite a lot of new features and really nice stability improvements, we hope that all of you enjoy this release!

About FlashDevelop:

* Features
* Screenshots

Changes:

GUI:
* New "fullscreen" editor mode
* New common GUI for AS2Api and ASDoc
* SWF exploration shows the frame where definitions are imported

ActionScript:
* Fine tuned code completion
* Dynamic syntax highlighting: custom classes get colored like flash classes (MovieClip, Event, etc)
* Completion for package-level declarations and Flash 10's Vector. type
* New generator: Ctrl+Shift+1 on a non-imported type to generate the import
* Go To Declaration (F4) with SWC classes display a generated pseudo-class
* Improved generators

MXML:
* Tags with ID now appear in outline view and script code completion
* Updated completion (generated using a tool available in SVN)

Templates:
* Improved MXML projects templates
* New optimized AS3 project template with preloader (no Flex dependencies)
* Templates now include an index.html with swfobject.js

PHP:
* Now featuring simple PHP completion

Important:

* Backup your customized user files: The setting files have changed quite a lot so check before you overwrite the new ones.
* Get Adobe Flex 3 SDK. The free Flex SDK (2 or 3) is required for ActionScript 3 development if you don't use Flash CS3.
* Get the debug Flash player (you need: projector and Active X)
* Java 1.6+ is required for the Flex compiler (ActionScript 3).

If you think the program is good, please donate some money for this project.

Download:

Built from rev. 36
Download FlashDevelop 3.0.0 Beta8

After being with the Flash Authoring team for over two years, I've made a change. Adobe is an awesome company to work for, but I was working remotely and found I really needed more face-to-face interaction. Every time I went to San Francisco and worked at Flash HQ I'd have such a great time. Then after a week I'd come back and work in a room by myself for months on end. It got depressing after a while and I eventually realized that socializing at work wasn't just a privilege but a necessity for me. I wasn't ready to relocate so I found a position with Club Penguin, a local (Kelowna, B.C.) company that Disney bought last year. I started last week and already I'm talking to myself less. =)

Club Penguin has another position open right now:
http://www.clubpenguin.com/company/jobs/actionscript_programmer.htm

I don't know what Adobe's plans are for my former position, but you can keep an eye on their job postings here:
http://cooljobs.adobe.com/frameset.html?goto=er-joblist

At Club Penguin I'll be taking on massively multiplayer online game development, an exciting new challenge. I'll also be responsible for mentoring the ActionScripters here, equipping them with the best knowledge, tools and practices for Flash development. I'll be advocating for some of my hobby horses like OOP, TDD and AsUnit, pair programming, refactoring, Agile practices, mtasc and mxmlc, SVN, continuous integration, FlashDevelop and Flex Builder. I love both teaching and creating so this will be a nice blend of the two.

"[Flash CS3 has a] lack of documentation on how to develop custom components ... Hopefully our screams for help will be heard."
-- Posted by SmackMe

Scream no more, Sir SmackMe. You just been smuck'd with an epic mini-series on component creation, now up on Adobe's Developer Center. My colleague Jeff Kamerer, engineer on the Flash Authoring team, has written basically a thesis, a small book on how to make your own AS3 components with the Flash CS3 framework. When Jeff sent me a draft six weeks ago, it was 32,000 words and 102 pages. He's not kidding around.

Here's the summary of what's covered:

Creating ActionScript 3.0 components in Flash

After following along with this series, you will learn how to do the following:

• Set up the layers and frames in your component movie clip symbol
• Implement Live Preview for your component
• Dispatch events
• Support styles and easily editable skins
• Manage drawing with the invalidation model
• Manage focus
• Handle keyboard input
• Create a compiled clip shim for your ActionScript definitions
• Deploy your component to the Components panel

http://www.adobe.com/devnet/flash/articles/creating_as3_components.html

For Flash CS3, we updated our JSFL engine to version 1.6 of SpiderMonkey. Firefox started using this version in Firefox 1.5. This is just the JavaScript interpreter, not the Document Object Model, which differs greatly between Firefox and Flash. (For those not familiar with JSFL, it's the JavaScript engine inside the Flash authoring tool; it's not in the Flash Player.)

SpiderMonkey 1.6 introduced JavaScript 1.6, which is JavaScript 1.5 plus several new features:

E4X

ECMAScript for XML (E4X) is a programming language extension that adds native XML support to JavaScript. It does this by providing access to the XML document in a form that feels natural for ECMAScript programmers. The goal is to provide an alternative, simpler syntax for accessing XML documents than via DOM interfaces.

E4X is standardized by Ecma International in ECMA-357 standard (currently in its second edition, December 2005).

E4X is implemented (at least partially) in SpiderMonkey (Gecko's JavaScript engine) and in Rhino (JavaScript engine written in Java).

Array Extras

There are seven new Array methods that can be separated into two categories, item location methods and iterative methods. The item location methods are:

• indexOf() - returns the index of the given item's first occurrence.
• lastIndexOf() - returns the index of the given item's last occurrence.

The iterative methods are:

• every() - runs a function on items in the array while that function is returning true. It returns true if the function returns true for every item it could visit.
• filter() - runs a function on every item in the array and returns an array of all items for which the function returns true.
• forEach() - runs a function on every item in the array.
• map() - runs a function on every item in the array and returns the results in an array.
• some() - runs a function on items in the array while that function returns false. It returns true if the function returns true for any item it could visit.

For more information, see Nicholas C. Zakas' article, Mozilla's New Array Methods.

Array and String Generics

Sometimes you would like to apply array methods to strings. By doing this, you treat a string as an array of characters. For example, in order to check that every character in the variable str is a letter, you would write:

function isLetter(character) {
 return (character >= "a" && character <= "z");
}

if (Array.prototype.every.call(str, isLetter))
 alert("The string '" + str + "' contains only letters!");

This notation is rather wasteful and JavaScript 1.6 introduces a generic shorthand:

if (Array.every(str, isLetter))
 alert("The string '" + str + "' contains only letters!");

Similarly you can easily apply String methods to any object:

var num = 15;
alert(String.replace(num, /5/, '2'));

[from http://developer.mozilla.org/en/docs/New_in_JavaScript_1.6]

Firefox 2 introduced JavaScript 1.7, which has some quite interesting features like generators and iterators. In the future, SpiderMonkey and Firefox will integrate the Tamarin virtual machine, which today runs ActionScript 3.

So JSFL developers gain some tools in Flash CS3 just from the SpiderMonkey update. As well, we added a number of new JSAPIs, which I'll talk about in a later post.