App Lifecycle Methods

To enable an app to refresh its data at the appropriate time, the parent application emits an app.activated() method. The method timing differs based on the app’s location. When the page that contains the app is loaded for the first time (identified by the app.initialized() method), the app needs to register to listen for the app.activated() method.

Note: Apps that reside in the ticket_attachment or ticket_conversation_editor location will be initialized every time the ticket editor is opened.

app.initialized()

This method is triggered when the page containing the app is loaded for the first time. On success, it returns the client object which can be used to register for the app.activated and app.deactivated methods. As the app renders within an IFrame, all communication (Data methods, Interface methods, Events methods) between the app and parent page occurs through the client object.

app.js Copied Copy
1
2
3
4
5
6
7
8
9
10
11
12
13
app.initialized().then( function(client) { //If successful, register the app activated and deactivated method callback. client.events.on("app.activated", onAppActivated); client.events.on("app.deactivated", onAppDeactivated); }, function(error) { //If unsuccessful console.log(); } );
EXPAND ↓

Unless you are building an app that is completely isolated (independent of the data on the page), ensure that the core logic of the app is not within the app.initialized() callback. Place the logic within the app.activated() callback to ensure that the app can react whenever the ticket or contact context changes. For example, on the Ticket Details page, when you navigate from one ticket to another, app.activated() is triggered and the corresponding callback is run.

app.activated()

This method is triggered when the app is brought into scope and the method timing differs based on the location of the app.

Location When the method is triggered?
Ticket Sidebar, Contact Sidebar, Change Sidebar, Ticket Requester Info When an agent clicks the app icon for the first time to open the app (apps are in a minimized state when the page loads). If you are on the same page, subsequent hiding/showing will not trigger any methods.
Ticket Background When the page loads.
Ticket Top Navigation When an agent clicks the app icon.

Note:The app.activated() method is triggered and the corresponding callback is run when you navigate from one ticket to another on the Ticket Details page.

app.js

Copied Copy
1
2
3
4
5
client.events.on("app.activated", onAppActivated); function onAppActivated() { console.log("App Activated"); }
app.deactivated()

This method is triggered when the app is taken out of scope. The app.deactivated method can be used to clean stale data. For apps on the Ticket Details and Contact Details pages, this method is triggered when the agent moves from one ticket or contact to the next.

app.js Copied Copy
1
2
3
4
5
client.events.on("app.deactivated", onAppDeactivated); function onAppDeactivated() { console.log("App Deactivated"); }