The AI Agent Inspector panel in Chrome DevTools

Plan requirement

App	pluscloud AI Agent Preview
Subscription	Suite Team or higher, Support Team or higher

The AI Agent Inspector tab in Chrome DevTools has the raw data of the AI agent preview or the Web Widget inspector, with timings and a zE console. It is meant for whoever builds or debugs the widget and the AI agent.

Open the panel

Open Chrome DevTools, for example with the right mouse button and Inspect, and choose the tab AI Agent Inspector. It may be under the double arrow when the tabs do not fit. The panel connects by itself when one of these runs on the page:

AI agent preview: the preview in the AI agents dashboard. See Getting started with AI Agent Preview.
Web Widget inspector: the inspector on a website you switched it on for. See Getting started with the Web Widget inspector.

The source shows at the top of the panel. Next to it are Preserve log, which keeps the data when the page navigates, as in the Network panel, and Pause, which holds new data until you resume.

Timeline

The Timeline puts everything in one list, oldest first: messages, zE commands and refused commands, widget events, realtime and streaming events, network responses, the widget's analytics calls, console lines, socket events of the preview and conversation log entries. Each row has its time and the time since the previous row.

Click a kind to show only that kind. Ctrl-click or Cmd-click combines kinds.
Issues only shows errors and warnings only. The search also looks inside the data.
Select a row to see its JSON on the right, with Copy JSON. The arrow keys move through the list.

The AI Agent Inspector panel in Chrome DevTools on the Timeline, for the Web Widget inspector on a fictional bike shop. The list shows customer messages, typing indicators, stream events, messenger:on events, a task identification, a knowledge search and an API integration, each with its time and the time since the previous row. An AI agent reply from Ava is selected and its JSON is on the right.

Data and widget state

Data has the raw data per section as collapsible JSON, with Filter, Expand, Collapse and Copy JSON.

Widget state works on websites only. It is a read-only copy of the widget's internal state: the screen, open or closed, the larger view, the conversation, unread messages and streaming, with the last 50 changes. It holds no message text or personal data. The names are the widget's own and can change with any widget update.

Timings

Timings measures every reply of the AI agent from the customer's message: to the typing indicator, to the first answer, which is the first streamed text or message, and to the full reply. Above the table are the medians, the slowest reply and the number of slow replies. A reply slower than Slow after, 8 seconds by default, is marked Slow; you choose whether that is measured on the first answer or the full reply. Click a row to see it in the Timeline.

The Timings view with three replies of the AI agent: typing, first answer, full reply and number of messages per customer message, each with a bar. The third reply took 9.36 seconds to its first answer and is marked Slow. Above the table are the medians and the slowest reply.

When a phase cannot be measured, the view says why. In the preview, the test widget shows typing as soon as you send, so there is no typing time. A conversation the preview rebuilt from the test widget's page has no timings; start a new test with the panel open. On a website, reload the page with the inspector on to capture the widget's realtime connection.

zE console

The zE console works on websites with the Web Widget inspector on. It runs Web Widget commands on the page through the site's own widget, in your browser. Type a command as in Zendesk's documentation, such as zE('messenger', 'open'), or short, such as messenger:set locale nl. Tab completes it, and the arrow up brings back earlier commands.

Open, Close, Show, Hide and Locale are quick buttons. Customization… builds a customisation call and checks it before it runs.
Commands carry badges: Undocumented, Differs from the docs, sends data for commands that write to Zendesk, such as sendMessage, and Extension · Experimental.
Help lists the undocumented commands and events, the differences from the documentation and the extension's own commands: pcw:openArticle, pcw:openTicketForm, pcw:openContactForm, pcw:expand and pcw:prefill. These are the experimental tools of Experimental and undocumented Web Widget features.
Commands that need a function, such as messenger:on and loginUser, cannot run from the console. The Timeline already shows every widget event.

The zE console with the Help panel open, listing undocumented commands such as typingIndicator and isHideButtonVisible with an Undocumented badge. Below it are three commands that ran: messenger open, messenger:set locale with the badges Differs from the docs and sends data, and pcw:openArticle with the badge Extension · Experimental.

The AI agent preview has no zE console and no widget state, because the test widget of the dashboard is not a Web Widget.

Debug report

Debug report sums up the page in Markdown and in JSON: the account, the checks, the configuration, the conversation, timings, zE commands and errors, failed requests and a summary of the conversation log. Tokens, passwords, secrets and email addresses are left out. The report is in English. Copy it with Copy Markdown or Copy JSON for a colleague, or send it to us with your question.

The panel keeps its view settings and the commands you ran in the zE console in this browser; the data itself it does not keep.

Comments

0 comments

Please sign in to leave a comment.