Testing and Debugging
From ManWiki
|
|
Topic Assignments
Play your game and make a list of the bugs in it. Share your game with your classmates and challenge them to find bugs in your game too.
Refer to this "cheat sheet" to help swat your bug". For additional explanation, please see the steps below.
- All reserved words, or vocabulary that Flash understands, turns blue. If the command you typed didn't turn blue, then you didn't type it correctly.
- All movieclip properties must start with an underscore. (e.g. carrot._x)
- When you type a string it turns green. If you don't close the double-quotes most of your code will be green, and that will be a dead giveaway that you have a runaway string.
- The trace function can allow you to find out the value of variables and much more.
- If you get compiler errors in Flash check to see if you...
- ...closed all of your curly braces.
- ...closed all of your parentheses.
- ...closed all of your quotations.
Tabs and a little white space never hurt anyone.
Think of your ActionScript code as an outline. Outlines utilize tab space to separate different blocks of code. Having nested if or onEnterFrame code blocks can benefit from tab space. Also, adding an extra line of white space between code blocks also helps to separate them. Look at the two examples below and see what a difference tab space and white space can make in reading your code and helping see problems more clearly.
Look for proper syntax highlighting in your code.
Flash color-codes special portions of your ActionScript code. Knowing what these colors stand for and whether the code you typed should be plain black or a different color will make you a better debugger.
Flash has many reserved words, or words that mean something special to Flash. These reserved words could be properties, commands, or actions. When these words are spelled corrected and with the proper capitalization, they turn blue. Knowing to look for this color change can alert you to whether you are typing code that Flash understands. The example below shows that Flash is very finicky, even with capitalization. 99% of the time, if the word turns blue, you typed the correct command.
In ActionScript 2.0 all properties of a movieclip always start with an underscore (_). Examples of such properties are: _x, _y, _width, _height, _rotation, _alpha, _visible, _xscale, _yscale. Never type one of these properties without an underscore (_). If you leave the underscore (_) off by accident, the code will be blue, but you will more than likely get an error in your game.
Flash also gives a special color to a string, or literal. When strings are typed, surrounded by double quotation marks("), the font color turns green. Make sure that you end the string with a double quotation mark ("), or you will have a runaway string like in the example below.
Read this tutorial on how to debug your game using tools such as the output window.
The "trace" statement is used to record programming notes or to display messages in the Output window while testing a movie. It can help you find the location of your "bugs". When your code starts to get extremely complex, full of loops and IF statements, and you want to test if a particular area of code is running, add a trace command. The example below shows Flash tracing different strings when the different IF statements for LEFT, RIGHT, UP, or DOWN are executed.
Notice by looking at the Output window, we can tell that the player moved the movieclip "circle" left, up, down, left, and then a collision happened based on a hitTest. The player then moved the circle right. We see that some words are repeated multiple times. Based on where the trace is put in your code, it may loop continuously. So, if the circle comes to rest on the square, the hitTest will continue to be true, which means the trace that states "Collision!" will repeatedly be displayed.
Strings are not the only thing that can be outputted with the trace function. Variables, movieclip properties, and even a movieclip's location can also be traced. The below example shows a variable called counter being traced. In the shown code, the counter's value never goes up or down, but stays constant at 100. If we had code that was affecting counter and we wanted to see the change being made, tracing this variable would be an excellent way to debug the variable.
You can also trace the reserved word this. This is a word that is basically a pronoun for "I" or "me". When you use the reserved word this, you are referring to the current movieclip that your code resides in. If you ever need to figure out "where" a movieclip is located in relation to the main stage, use the command trace(this).
Lastly, the trace function allows you combined string and variable statements. In the below example, instead of just tracing movieclip properties and hoping the programmer knows what the value 147 stands for, the trace function allows you to concatenate together a statement of both string and variable elements. Which statement would make more sense to you, "147" or "Circle's y position is 147"?
Learn about compiler errors. If you have any issues with your ActionScript while it is running, the errors will be shown in the Compiler Errors window. Reading these errors will make your debugging work exponentially faster. Here you can double-click on the error, and it will take you to the line of ActionScript that needs attention. Before you edit the code, make sure you close the running game first.
Below are some common coding mistakes that happen regularly to programmers. Take note of the information shown in the Compiler Errors window.
Missing closing curly braces {} and parentheses () are the most annoying debugging problem. This video shows you an easy method to get around this problem.
When you have multiple nested If statements and onEnterFrame statements, coding mistakes can commonly happen. One of the best things to do is count your opening ( { ) and closing ( } ) curly braces. You should be able to count equal numbers of opening and closing braces. If your counts are not equal, you need to start analyzing your code looking for the missing braces. Below shows an example of a missing closing braces. The Compiler Errors window alerts the programmer that a closing braces is missing, although it typically isn't smart enough to tell you exactly where it should be placed. That is your job as the programmer to find out.
Another issue that commonly happens with complex coding is missing parentheses (). As they teach in math and algebra classes, count your parentheses from the innermost to the outermost. If your counts are not equal, you need to start analyzing your code looking for the missing parentheses. Below shows an example of a missing closing parentheses. The Compiler Errors window alerts the programmer that a closing parentheses is missing, and gives you an excellent starting point (Line 5) to fixing your problem.
Prove your skills. Think you have what it takes to be an awesome debugger? Try to find all 6 errors in this Flash file to make it work correctly like the example shown below. Good luck!
Check your work! Did you get stumped? Can't find a few of the errors? See this page for the full solution with explanation.
Update the Wiki
- Upload the assets (.SWF and .FLA) you created to your Team page if you are working on a Team game, or to your "My Projects" page if you are working alone.
Update the Blog
- Write a Blog post about this topic, share your learning experience!
Related Links and Tutorials
- Browse the MyGLife.org Flash Tutorials list for more tutorials, information and links!
Search the Web for more information
Here are some search results on Flash ActionScript programming:
- Google results for "flash & debug & tutorial".
- TeacherTube results for "flash"
- Ask.com results for "actionscript & debug & tutorial".
