Hello Zendesk Support Team,
Subject: Persistent ZAF Modal Error: APIUnavailable for instance.data
I am developing a Zendesk app with a ticket sidebar that opens a modal dialog. I am facing a persistent issue where I cannot pass data from the parent sidebar app to the modal.
When the modal app attempts to retrieve the data using client.get('instance.data'), it consistently returns the following error:
APIUnavailable: "ticket.requester.id"
Could not find handler for: "instance.data"
This error occurs immediately upon the modal appearing.
I have extensively troubleshooted this issue by trying the following:
- Using client.on('app.registered'): I placed the data-retrieval logic inside this event handler to ensure the app is fully registered and the API is ready. The error still occurred.
- Passing data via URL query parameters: To bypass the client.get method, I attempted to send the data directly in the modal's URL. This also resulted in errors due to cross-origin security policies.
Here is the relevant code for my two files.
main.js (Sidebar App)
```javascript
async function openInstallModal() {
try {
const data = await client.get(['ticket.requester.id']);
const requesterId = data['ticket.requester.id'];
await client.invoke('instances.create', {
location: 'modal',
url: 'assets/install-dialog.html',
size: { width: '600px', height: '700px' },
data: { requesterId: requesterId }
});
} catch (err) {
console.error('Failed to get ticket info:', err);
}
}
document.getElementById('create-install-request').addEventListener('click', openInstallModal);
install-dialog.js (Modal App)
```javascript
const client = ZAFClient.init();
client.on('app.registered', async function() {
let requesterId = null;
try {
const instanceData = await client.get('instance.data');
requesterId = instanceData['instance.data'].requesterId;
if (!requesterId) {
throw new Error('Requester ID was not passed to the modal.');
}
} catch (err) {
console.error('Error getting requester ID from parent:', err);
}
});
Given that standard solutions are not working, I believe this may be an issue with my local development environment or a bug in the ZAF itself. Any guidance you can provide would be greatly appreciated.
Thank you for your help.
Before passing the data, we want to get the instanceGuid. The object of each new instance is equivalent to the iframe's context and the iframe for the modal isn't created until the modal is visible. Therefore we can't pass data to it until it exists.
Then, you'll need to use:
All cross location communication is event driven so you'll need to listen for the event in order to pass the data.
Here is an example below using a snippet of the code you provided: