Debugging Data Events and Calculation Fields
We've all been there. Here are some best practices on debugging your code
Vince Lauffer avatar
Written by Vince Lauffer
Updated over a week ago

Data events and calculation fields are a great way to extend the functionality of Fulcrum. However, with great power comes great responsibility.

There are a wide range of issues that can arise from misusing data events, like

  • Not being able to save a record

  • On screen error messages

  • App crashes

  • And more!

When your code is not doing what it is supposed to, then it is time to debug πŸ›

The first step is to hover over any read lines in your script and read the error message. In the case below, we can see that texts is not actually a variable name. In this case you would need to correct the spelling of your field, or double check that the field still exists in your app.

The second step in debugging your code will be to open up the developer tools console for your browser. To get there on most browsers, right click anywhere on the page, and then select Inspect. A new sub-window should open up. In that new sub-window, click on Console. If you don't see this option, you may have to click the More option, also labeled as >> on some browsers.

You may see many errors and warnings on your screen, but these likely do not have anything to do with the code you've written. You can clear those by clicking the grey 🚫

Try previewing the code and keep your eye on the console for any errors that reference the variable names.

If you don't see any errors, you will need to add logs to your code. For the main variables in your data events script or calculation expression, add console.log(variable_name); for the main variables involved in your code. Then try previewing the app again and try to reproduce the error. Once you have done so, take a look at the developer tools console you opened up and check for what the values were at that time.

If you have many console.log statements, you may want to add a string of the variable name to the console log: console.log("string_variable_name", variable_name)

ON("change", "text" , function(){
console.log($text);
var textCopyVar = $text;
console.log('textCopyVar', textCopyVar);
SETVALUE("text_copy", textCopyVar);
});

There's a lot more we haven't covered here, so if you have any questions, please reach out to support through the little red chat bubble in the bottom right!

Did this answer your question?