App Lifecycle Events

For an app to refresh its data at the right time, the parent application emits an app.activated() event. The event timing differs depending on the app’s location. The app should register to listen for an app.activated event when the page containing the app is loaded for the first time, which is denoted by the app.initialized() event.

app.initialized()

This method is invoked 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 events. As the app renders within an IFrame, all communication (Data API, Interface API, Events API) 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 event 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), the core logic of the app should not be within the app.initialized() callback. It should be within the app.activated() callback to ensure that the app can react whenever the page context changes. For example, on the Lead Details page, when you navigate from one lead to another, app.activated() is triggered and the corresponding callback is executed.

app.activated()

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

Location When the event is triggered?
Lead Details page, Contact Details page, Deal Details page, Account Details page Apps in these locations are in a minimized state when the page is loaded. When you click the app icon for the first time to display the app, the app.activated event is triggered.
CTI, Chat The app.activated event is triggered after app.initialized once the page has loaded.

Note:
In addition, the app.activated() event is triggered and the corresponding callback is executed when you navigate from one module to another on the respective module 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 event is triggered when the app is taken out of scope. The app.deactivated event can also be used to clean stale data. In addition, this event is triggered when an agent moves from one module entity to the next and from one module page to the next.

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