How can I debug the Zendesk Apps framework (ZAF)?

Question

How can I debug the Zendesk Apps framework (ZAF)?

Answer

The Zendesk Apps framework allows you to build apps with complex functionalities and features. This article provides guidelines on how to approach issues in the most common scenarios.

DISCLAIMER: The Zendesk Support Team can only assist in demonstrating the capabilities and functionalities of the Zendesk Apps framework (ZAF). Any issue concerning custom code or implementations must be discussed with the app developers.

Capture the errors
Use the browser's developer tool

If an app shows unexpected behaviors, gather a list of errors for further research from the developer's tool of the browser.

To access the developer tool in different browsers

• Chrome: Open Chrome DevTools 
• Firefox: Web Console 
• Safari: Use the developer tools in the Develop menu in Safari on Mac 
• Microsoft Edge: Open Microsoft Edge DevTools

The console displays any errors or warning messages. For network request errors, take a look at the network tab of the tool.

Generate a list of installed apps
Use query parameters

Generate a list of all the apps installed in the account.

The API endpoint List App Installations generates a JSON list of installed apps. Properties included can be used for the noapps and app_ids query parameters discussed later:

• enabled: indicates whether or not an app is currently active
• app_id: the ID of the app. This is needed when using the app_ids parameter.
• installation ID: the installation ID of the app. This can optionally be used for the noapps parameter. Apps can be installed multiple times if the app allows it. Each install will have a different installation ID but have the same app ID.

To access the endpoint

• Use curl

  curl https://{subdomain}.zendesk.com/api/v2/apps/installations.json\
  -u{email_address}:{password}

• Or append /api/v2/apps/installations.json to the account's subdomain URL:

  https://your_subdomain.zendesk.com/api/v2/apps/installations.json

You must be an agent in the Zendesk account

Identify the app
Deactivate apps to find the culprit

Selectively activate and deactivate apps.

To deactivate an app

• In Support, follow the instructions in this article: Managing your installed apps. 
• Or, append the ?noapps suffix to the ticket URL:

  https://your_subdomain.zendesk.com/agent/tickets/123456?noapps

Generate a HAR file
Troubleshoot the issue by tracking information

The HAR file is a standard format used to track information and events between a browser and a website. It is always a good idea to record the network events in a HAR file to troubleshoot performance or rendering issues.

To generate a HAR file, see this article: Generating HAR file for troubleshooting.

Use the apps API
Troubleshoot the issue using the apps API

Leverage the API endpoint List App Installations to generate a list of the installed apps. Among the properties contained in the JSON response, use the installation ID as a query parameter for noapps to disable multiple apps at the same time:

https://your_subdomain.zendesk.com/agent/tickets/123456?noapps=11111,22222,44444

reset progress

How to install and use ZAT on macOS, Windows, and Linux:

• Installing and using the Zendesk apps tools

How to build a Support app from scratch:

• Build your first Support app - Part 1: Laying the groundwork
• Build your first Support app - Part 2: Designing the user interface
• Build your first Support app - Part 3: Creating and inserting templates
• Build your first Support app - Part 4: Getting data
• Build your first Support app - Part 5: Installing the app in Zendesk Support

How to build a server-side app

• Building a server-side app - Part 1: Core concepts
• Building a server-side app - Part 2: Display server-side content in a Zendesk app
• Building a server-side app - Part 3: Access external APIs
• Building a server-side app - Part 4: Access framework APIs
• Building a server-side app - Part 5: Deploy the app
• Building a server-side app - Bonus part: Secure the app