Action Flow Debugging

You have been using DronaHQ Studio with its simple visual development interface to create apps with little or even no coding knowledge. You have been using Action flows that provide you the flexibility to define the functionality for on-screen and server-side action. When you are developing something there would always be a possibility for some errors or deviations from expected outputs. So for you to have an easy method to identify the problems in Action Flows, we have added the Action Flow Debugging feature to Studio. It will be available in the Preview mode of Studio, thus allowing you to have an error-free package for distribution and usage.

Now let us understand how to use Action Flow Debugging. Let us take an example of an Onboarding App. We would have action flows to insert personal details here and also to navigate to the next page to add Educational Qualifications and Experience Details.

Once you have designed your app, you would be taking a preview to ensure that the app is working as expected. So now if you go to the Preview you will notice a BUG icon on the right-hand side of the screen.


Click the Bug to start debugging. It opens the Action Flow Listing. There are different screens listed out that contain the action flows. Select the Screen which you want to debug.

Here we are using the OnBoarding form containing the three action buttons with the respective action click events listed out.

Mark the breakpoint for the action events of the respective button that you want to investigate. So select them you simply need to click. A red mark appears against them indicating the breakpoint added.

Note: Then Branch Task of the Action flows is not supported. You would not be able to add any breakpoint to investigate your Branch Task.

Now continue with the execution, add the necessary data and click the action button. The debugger starts when you click the action button and the task starts executing. You can see that the different tasks in the Action flow are listed out.

While debugging you can manage the breakpoints and execute them together or step by step as per your investigation needs.

The Debugger is basically distributed into four sections; Action Blocks, Input, and Output and Watchlist.

Action Blocks

The Action block lists out all the tasks or Action blocks in the action event. If you want to investigate the specific task for the output and the values returned you can add breakpoints to the specific action as well.

Input Section

Now if you select any of the Action Block, its input will be listed out in the Input section. It will show you when the action block will be executed. So in the example, you can see the Input Parameters of that action, as well as the Executes When which in this case is when the condition is true. It also lists out the Environments it is allowed to execute in and the current environment that you are debugging in.

Output block

Depending upon the action block you would have some output. In this example, the value is the RowID being returned hence the output block shows output data accordingly. It will vary depending upon each action.


Watchlist allows you to add a control or variable for which you can then inspect the values through the different steps.

Simply click + (add) to add the items from the list of variables and controls.

After you have added the breakpoints in the Action flows of any of your apps, they would persist even during the next time you take a preview or run the app. So you need not have to go through the same process over and over again.

The Action Flow Debugging is a very easy and handy method to investigate and debug your apps to make them error-free and functioning as expected.