Debugging your Fireworks MX Flash Commands (Part I) The Debug Movie Window

When developing Flash movies that rely on variables, functions and nested functions, there is nothing more annoying than previewing your movie, and things dont happen as you want them to, or even worse…strange things start to happen. It can be easier than you imagine to get stuck in an infinite loop that will crash Flash MX if you’re in a rush, and your brain isn’t engaged when working with looping commands.

With the release of Flash MX, the ability to debug effectively has been increased to an unprecedented level, allowing you to see exactly whats going on within your movie, and hopefully will help you spot the erroneous trailing quote you may have left lying around.

In this tutorial, we will gain an insight into the power of debugging and how this can save you many many hours of frustration.

The Debug Movie Window

To enable debugging, select File > Publish Settings, and makes sure the Debugging Permitted checkbox is checked. You can optionally select a password for debugging, or simply leave it blank, and switch off Debugging Permitted when you are exporting the movie to a live environment.

To access debugging mode from within your active movie, select Control > Debug Movie.

One of the most handy attributes of the Flash MX debugger is the ‘Watch’ option, which allows you to track and view variables that you specify. Simply viewing the output from the variables (Debug > List Variables) or object (Debug > List Objects) options can be a little daunting, however with the watch option, you can focus in on as many or as few variables as you wish.

How to watch a variable

Select the Variables tab from the Debugger and right-click (PC) or command-click (Mac) the variable that you wish to keep an eye on. Select ‘Watch’

Move across to the Watch tab, and you will now see your variable and its current value displayed.

Now when the value of the variable(s) change within the movie, you see instant feedback within the Watch Tab of what the value has changed to. I cannot emphasise enough the value of carrying out this procedure whilst creating your movies, as it will save endless hours of frustration and banging your head against the wall 🙂

In Depth Debug Movie Window

The Debugger offers more than just the ability to watch variables, it also now allows you to set code breakpoints allowing you to step around, into and over functions and code, further allowing you identify the possible cause of a problem within your movie, or to just run specific chunks of code from breakpoint to breakpoint

After setting breakpoints within your suspect piece of code, you can then continue playing the movie, testing procedures and buttons, until the movie hits the piece of code you have set breakpoints around.

At this point, you may choose to do one of the following

Step Into the code to execute the code set between the breakpoints,
Step Out of the code, which will circumvent any code held between the breakpoints
Step Over, will advance the debugger on a line by line basis through the code or function, allowing you to carefully examine any watched variables or local variables.

Choosing Step Out here, as shown in the diagram below, steps around the code as dictated by the breakpoints.

Conclusion

This was a short and sweet introduction to debugging within Flash MX, and hopefully if you get stuck, or your movies start to misbehave in an unexpected manner, don’t send them for correctional behaviour, just open the Flash MX Debug Movie Window.