Using FlexBuilder 3 to debug & edit Flash CS3 projects
May 16, 2008 – 2:00 pm by JasonRecently I was working on a project that due to a requirement had to be compiled in Flash CS3. Having spent the last few years exclusively using FlexBuilder I was shocked at the HORRIBLE AS3 editor and debugger in Flash CS3. I quickly tried to figure out how to edit and debug from FlexBuilder 3. I got some help along the way, and wanted to share the process.
Step 1: (FB3) Create a new ActionScript project in Flex Builder 3 and give it a name.


Step 2: (Flash CS3) Make a new Flash CS3 project, save it in the SAME DIRECTORY as the AS3 project.


Step 3: (Flash CS3) Open up File –> Publish Settings in your Flash CS3 project and select “Permit debugging”.

Step 4: (Flash CS3) Click on the Settings button and enter the name of your main AS3 class. If your main AS3 class is not in the same directory as the FLA then add the directory as a Classplath. Click the green check mark to validate the class location.

Step 5: (FB3) Write a bit of code and put in a break point.

Step 6: (Flash CS3) Compile a debug version of the SWF. The breakpoint you entered in FB3 will be compiled into the SWF. After it compiles and opens in the Flash CS3 debugger just close it. The SWF should have been compiled into the root of your FB3 project. I had to quit FB3 and reopen it for the SWF to show up.


Step 7: (FB3) Make a new debugging profile that points directly to the Flash CS3 complied SWF (NOT THE FB3 SWF in the bin directory).


Step 8: (FB3) Debug with your new profile.


If the debugger times-out and does not connect you may need to configure the debugger setting in your Flash Player. Do this by rt-clicking on the SWF and selecting Debugger.

This workflow allows for you to use the code hinting and debugger in FlexBuilder 3 even when compiling in Flash CS3. Let me know if you run into any problems.
Special thanks to Melih Elibol who helped me with some of these steps :).
–jason
6 Responses to “Using FlexBuilder 3 to debug & edit Flash CS3 projects”
Great tip!
Some notes for others trying this. I couldn’t choose the Application file for some reason in the dropdown first seen in step 7. Not sure why. But I manually edited the .actionscriptProperties file manually. Instead of
<— no application in this node
showing that no application file was selected (empty applications tag)
which it happily worked with. Very neat.
By michael on Jun 9, 2008
ah it stripped all the xml out :-(
lets try this again.
It went from:
<applications/>
to
<applications>
<application path="SendMeAToy.as"/>
</applications>
<applications>
<application path="MyAppFile.as"/>
</applications>
By michael on Jun 9, 2008
First, Jason and Melih, I love you.
Secondly, Michael, I had the same problem. I wasn’t given any options to select the Application file in the dropdown seen in Step 7.
So before Step 7, I solved this by Right-clicking my document class .as file then selecting “Set as Default Application”.
By Leif Ilvedson on Jun 20, 2008
A note to Jason: I had to right-click and “view image” on some of the images on this blog entry in order to see the whole image.
By Leif Ilvedson on Jun 20, 2008
Wow this is so cool !!
But how do i access / reference the movie clips within the fla ???
By k3ch0ng on Oct 30, 2008