Debugging Jitterbit App Builder queries with web browser developer tools

Introduction

Modern browsers have developer tools (devtools) built into them. You can use these to diagnose issues in App Builder with requests that aren't getting answered or handled correctly, record a HAR file that can be used for further troubleshooting, and help pinpoint issues with page load times. You can also capture screenshots, emulate a mobile user's experience, and analyze requests being made by the page as it loads to identify specific areas impacting page load time.

This page explains these options using Google's Chrome DevTools as an example.

Identify HTTP error codes

HTTP response status codes indicate whether a specific HTTP request has been successfully completed. You can use the devtools to view and filter these to help isolate and identify an error with an App Builder app request that isn't getting answered or handled correctly.

From the Network tab, filter the results by clicking on the column headers. For example, you can click on Status to view HTTP code results and identify any tasks that don't return a 200 OK result:

In this example, the app page is throwing a 500 Internal Server Error and 504 Gateway Timeout error messages. The information contained in the Name column of this result helps define where in App Builder this error is being initiated.

These are common HTTP error code results in App Builder:

Generate a .har file

A .har file (HAR) is a JSON-formatted archive file format for recording a web browser's interaction with a site. You can share these files with App Builder support to help with troubleshooting.

To generate a HAR file, follow these steps:

1. Open your browser and go to the App Builder page where you're having problems.

2. Open your browser's devtools, then select the Network tab.

3. Clear any existing logs, then click the record button.

4. Try to reproduce the issue. As you do, all network requests are being recorded:

   

5. If you manage to reproduce the issue, stop recording, and look for an option to save the log as a HAR file.

Identify performance issues with requests

You can use the Network tab in your browser's devtools to find long running requests. To do this, sort on the Time column. The corresponding Name and Initiator columns give you additional information about the request originating from the App Builder app.

Requests named filter? that are taking up most of the page load time indicate you may need to optimize the corresponding business object.