4

I've used App Maker for several small projects since the launch of the EAP. Coming from TDD with PHP and hot reloading with Node, I'm frustrated by how long it takes to see changes and debug. I'm now wondering if I'm missing some critical piece of knowledge, because it seems too tedious.

Here's an example:

I have a form field that's bound to a client-side function. The function returns a calculated number based on the value of other form fields (some of which are also calculated). When I click preview and fill out the form, of course, there's going to be a console error or the calculation will be off. So I tweak the function, hit preview, and try again - repeatedly, until I get the expected output.

Since it takes 10-15 seconds for my preview to render each time, I'm spending a ton of dev time staring at a rotating circle.

I've had some success composing and debugging some of the scripts in another environment (Google Apps Scripts, local IDE, etc), then cutting and pasting them into App Maker. That doesn't work well when the function references App Maker models and widgets though.

Is there something I'm missing here, or is repetitive previewing really the only way to design and debug within App Maker?

Matt
  • 795
  • 1
  • 6
  • 20
  • I use the Chrome developer tools console to test tweaks in the code before refreshing. It saves a little time... – The Support Group Aug 30 '18 at 12:54
  • Thanks - I hadn't thought of that. However, I can't find my scripts in dev tools. Everything seems obfuscated by App Maker. Where are the client scripts located? – Matt Aug 30 '18 at 15:24
  • You won't have access to editing or viewing scripts. You can run the functions defined in the scripts, and perhaps more useful, is the ability to run arbitrary javascript and access the App Maker API, to test it out before assigning it to widgets. – The Support Group Sep 04 '18 at 12:44

1 Answers1

2

A quick and dirty method I use a lot is adding this line to any function I want to look at closely. AppMaker shows a warning for every debugger call so there's no risk of forgetting it in the code as well. 

debugger;

Of course, this only works for client-side scripts.

Tushar G
  • 36
  • 4