22 Test and Debug Applications

As your work on your application, it's important to test and debug it to ensure a smooth end-to-end experience for your users.

You have several options to ensure your application's code is error-free:
  • Browser tools: Because Visual Builder applications are essentially client-side HTML applications written in JavaScript, you can use your browser's development tools for debugging. When you view your Visual Builder application in Chrome (for example), you can use the Developer tools option to diagnose problems quickly:
    • Network tab: Use this tab to view network traffic between the client's browser and your REST data sources.
    • Console tab: Use this tab to track error messages and notifications from your application. Visual Builder apps output info-level log messages to the console by default. Other log levels are error, warn, fine, and finer. See Change an Application's Log Level to change the log level.

      Console log messages are color coded to make the output more readable. By default, error messages are red-magenta, warnings are yellow, info messages are blue-purple, while fine and finer are varying shades of gray, as shown here:
      Description of logs-default-colors.png follows
      Description of the illustration logs-default-colors.png

      Further, info messages from particular modules use different colors as a way to differentiate them from other console messages. For example, action chain messages are in dark purple, fragments in coral, and REST in yellow, as shown here:
      Description of logs-info-colors.png follows
      Description of the illustration logs-info-colors.png

      Console colors cannot be customized, but you can turn them off by setting window.vbInitConfig.LOG.mode = 'simple' in the app's index.html file:
      <script type="application/javascript">
        window.vbInitConfig = window.vbInitConfig || {};
        window.vbInitConfig.LOG = {
          mode: 'simple'
        };
      </script>
  • Audits pane: Use an audit framework to make sure your application's code is error free. See Audit Application Code.
  • Debug Preview mode: Use this mode to troubleshoot issues with the Visual Builder runtime and Oracle JET libraries—runtime dependencies that make sure your application works as intended. See Preview an App in Debug Mode.