How to debug a game?

Hi, Is there any way to output data to the console like "console.log" or similar using microScript? How do you debug your games?

Debugging Utility Allows you to easily print text to the screen, do benchmarks, and also draw shapes. It can easily be toggled on/off (see the Settings section below for the hotkeys).

Usage The first thing you have to do is ensure you update and draw the debugger every frame. Ideally, update it before everything else, and draw it after everything else.

update = function() debug.update()

// stuff end

draw = function() // stuff

debug.draw() end Then you can start printing whatever you need to be monitoring. You can call debug.print with a key and a value:

debug.print("some_name", some_value) Or with only a value:

debug.print(some_value) If your value is a float, you can also specify the decimal precision:

debug.print("some_name", some_float, precision) If the value is an object or class, and it implements an __str method, then that method will be called. __str should return a string representation of the object. (E.g., a Vector2 might return '(' + x + ',' + y + ')'.)

Note: the float precision parameter has no effect on properties of objects or classes.

Lastly, the debugger flushes everything at the beginning of each frame, so calling debug.print inside the init function will have no effect. It must be called every frame for continuous monitoring of any variable.

Benchmarking You can use debug.bm() to perform benchmarks. Simply wrap your code in a function and pass it as the last argument.

debug.bm("some_name", function()

// code

end) The results will be printed to the screen.

You can change the debug.bm_smoothing property if the results are too twitchy to read (default 15). Higher values make it less twitchy, but also less responsive. If the timings fluctuate a lot, higher values may not accurately reflect that.

If you want the results to be printed to the console instead, then you can call debug.bmc() in the exact same way. To prevent printing too often to the console, the property debug.bm_con_upd_interval controls how frequently the results get printed, in seconds (default 1.0). The smoothing value has no effect on the console printing.

Shape drawing You can use the debugger to quickly draw shapes (for bounding boxes, points, vectors, etc.), and you can easily toggle their display on/off by pressing CONTROL + key1 or CONTROL + key2. (See the settings section below.)

debug.line(10, 10, 20, 20, "#f00", 1)

debug.rect(30, 30, 50, 50, "#0f0") The above will be drawn immediatelly, and that's probably what you need most of the time.

However, if you need to defer drawing you can preppend a d to the names of the functions:

debug.dline(10, 10, 20, 20, "#f00", 1)

debug.drect(30, 30, 50, 50, "#0f0") Those commands are now added to a queue. When you're ready to have them drawn on the screen, you can call debug.commitDeferred().

draw = function() // stuff

debug.commitDeferred()

debug.draw() end You don't have to call commitDeferred at the end of the frame. commitDeferred will draw everything that is in the queue and then empty the queue. You can still queue up more draw commands after that, and call commitDeferred again when you're done.

These are the available drawing functions (all of them have a deferred version, with a preppended d):

line(x1, y1, x2, y2, color, thickness=0, outline=false, dash=false)

draw a line from x1,y1 to x2,y2. dash can be true or false, but it can also be the dash settings (e.g. [5,7]) to override the main ones. rline(x, y, rx, ry, color, thickness=0, outline=false, dash=false)

same as line, but rx,ry are relative to x,y. rect(x, y, w, h, color, thickness=0, radius=0, outline=false, dash=false)

draw a rectangle. If radius is not 0, it will have rounded corners. frect(x, y, w, h, color, radius=0, outline=false)

draw a filled rectangle point(x, y, radius, color, thickness=0, outline=false, dash=false)

draw a point (circle) fpoint(x, y, radius, color, outline=false)

draw a filled point (circle) text(text, x, y, size, color, outline=false, font="")

draw text. You can optionally specify the font name to use. Settings There are quite a few properties you can change to your liking:

key1 / key2 (string) - by default they are \ and ~, but you can set whatever keys work best for you. Some keys don't work the same, or have different positions in some keyboards, so having two keys might help mitigate that issue for multiple users.

font settings:

text_font (string) - the name of the font to use. Note: currently there's no way to get the current font being used, so by default, after drawing everything, the debugger blindly sets the font back to font_default. If your project uses a different font and only ever sets it once inside init, then the debugger will interfere with it.

text_font_default (string) - the font that the debugger will switch back to after drawing.

text_font_size (number) - the text size

text_line_spacing (number) - the vertical spacing between lines

text_outlined (bool) - whether to draw the text outlined or not

text_outline_width (number) - the width of the text outline

text_background (bool) - whether to draw the background panel or not

panel

text_col_separation (number) - amount of separation between the left and right columns (in pixels). If display_as_table is false, then this acts as the amount of space between the keys and the values.

text_use_colors (bool) - whether to display values in different colors (colored according to their type)

panel_margin_left (number) - size of the panel's left margin in pixels

panel_margin_right (number) - size of the panel's right margin in pixels

panel_margin_top (number) - size of the panel's top margin in pixels

panel_margin_bottom (number) - size of the panel's bottom margin in pixels

colors

panel_key_color (colorstring) - the color of the key text (left column) panel_number_color (colorstring) - the color of number values panel_string_color (colorstring) - the color of string values panel_object_color (colorstring) - the color of object values back_color (colorstring) - the color of the panel's background frame_color (colorstring) - the color of the panel's frame text_outline_color (colorstring) - the color used for outlining panel text shape_outline_color (colorstring) - the color used for outlines in shape drawing shape drawing: - shape_font (string) - The font used by the text drawing function (it has the same caveats from the text_font) shape_line_width (number) - the line thickness used for drawing lines.

shape_outline_width (number) - the line thickness used for drawing outlines.

shape_dash (list) - the dash settings (list) for drawing dashed lines. (default [4,6])

general settings:

display_as_table (bool) - whether or not to display the keys and values vertically aligned. Makes them easier to read, but only works well with monospaced fonts.

float_precision (number) - the default float precision. Individual print commands can override this.

time_in_secs (bool) - whether or not to display the benchmarking results in seconds or milliseconds.

render_target (object) - the target where to render drawing. By default it's the screen. See the section below.

manual_input (bool) - when true, the debugger doesn't handle input, and you have full control over how to toggle the debugger on/off in your own way.

benchmark settings:

bm_smoothing (number) - how much to smooth the benchmarking results. Lower is more responsive, higher is less twichy. bm_con_upd_interval (number) - how frequently to print benchmarking results to the console Render Target You can set a render target for shape drawing. This is useful if you need to draw onto a buffer image, or if you're using some library that changes the rendering transformations.

As an example, when using my own camera class:

init = function() camera = new Camera()

debug.render_target = camera end

update = function() debug.drect(30, 30, 50, 50, "#0f0")
end

draw = function() camera.beginDraw()

debug.line(10, 10, 20, 20, "#f00", 1)

debug.commitDeferred()

camera.endDraw()

debug.draw() end

Thank you! Although I have reviewed your comment, it is not clear to me how to continue, it seems to be documentation. Is that an external library or something you have built yourself?

Could you share with me a project or basic example where you have it implemented to check how it works?

Thank you very much!

Found the source! https://microstudio.dev/i/Skaruts/debug_tools/

yes, sometimes you can just find them in microstudio. You Got it. :)

I do not many friends, would you like to be friends? If you do then I will make a blank project and you can come help me make a great game. (That is if you want to)

In general, you can add print statements and extra debug code to figure out what's going wrong. If you're using JavaScript, you can also debug using DevTools.

Small Appendum: There's a small purple button by the right of your console. You can use both the console and the small menu behind the button to debug your game.

The console itself is more for testing functions and their return values, while the debug menu itself is more for viewing variables. You can also quickly create test variables on the go with the console as well.