Skip to contentSkip to navigationSkip to topbar
Rate this page:
On this page

Migration Guide: JavaScript 0.11.0


(error)

Danger

Programmable Chat has been deprecated and is no longer supported. Instead, we'll be focusing on the next generation of chat: Twilio Conversations. Find out more about the EOL process here(link takes you to an external page).

If you're starting a new project, please visit the Conversations Docs to begin. If you've already built on Programmable Chat, please visit our Migration Guide to learn about how to switch.


Client Instantiation

client-instantiation page anchor

AccessManager is no longer a required, direct dependency. This changes the way you init your Chat client:

The old way:


_10
let accessManager = new Twilio.Common.AccessManager(token);
_10
let chatClient = new Twilio.Chat.Client(accessManager);

The new way just requires the token to be passed:


_10
let chatClient = new Twilio.Chat.Client(token);

This does also mean that you have to call the chatClient.updateToken(token) method when needed, rather than using the old AccessManager.

If you still wish to use the convenience AccessManager to help track token lifecycle events, you can use an AccessManager to track a token lifetime if needed. The AccessManager is still found in the Twilio Common library.

The new version of AccessManager would be used as follows:


_11
let accessManager = new Twilio.AccessManager(token);
_11
let chatClient = new Twilio.Chat.Client(token);
_11
_11
accessManager.on('tokenUpdated', () => {
_11
chatClient.updateToken(accessManager.token);
_11
});
_11
_11
accessManager.on('tokenExpired', () => {
_11
let newToken = obtainNewToken();
_11
accessManager.updateToken(newToken);
_11
});


  • client.identity : Now you can access this with client.userInfo.identity . Note that you may access any properties only after the client.initialize() call has succeeded
  • channel.messages : In previous versions you could access the list of fetched messages for the channel through the synchronous property channel.messages .
  • With the new version you will need to always call channel.getMessages() . Don't worry, we will cache messages for you, so it won't make the performance of your app any worse.

Separated Public and User Channel Lists

separated-public-and-user-channel-lists page anchor

In the previous version to get a user channels list, you had to do something like the following:


_10
chatClient.getChannels()
_10
.filter(channel => (channel.status === 'joined' || channel.status === 'invited'))
_10
.then(result => doSomething);

That approach had multiple issues related to client initialization latency, consumed traffic, etc., so we made a couple of changes:

  • User channels (ones which you joined, invited, and your private channels), and public channels lists are separated
  • Public channels list consists of special "channelDescriptor" objects, which are much more lightweight so handling a huge catalogue of public channels will be much easier
  • We have added a pagination to load channels bit-by-bit

Let's see how it works:

Just populate a list of my channels:


_10
// Function accepts a channels page, which has an array of items and a method `nextPage` to proceed
_10
// to next page, if it exists
_10
function populateChannels(channelsPage) {
_10
channelsPage.items.forEach(channel => drawChannelSomehow);
_10
if(channelsPage.hasNextPage) {
_10
channelsPage.nextPage().then(populateChannels);
_10
}
_10
}
_10
_10
chatClient.getUserChannels().then(populateChannels);

Get a public channels list:


_10
chatClient.getPublicChannels().then(channelDescriptorPage => {
_10
// First page of channel descriptor
_10
// Paging works the same way as for user channels
_10
channelDescriptorPage.items.forEach(descriptor => {
_10
console.log('Descriptor for a channel:', descriptor.friendlyName, descriptor.sid);
_10
})
_10
});

Join to the channel from public list


_10
channelDescriptor.getChannel()
_10
.then(channel => channel.join())
_10
.then(channel => { console.log('Joined to the channel', channel.friendlyName);

Also note, that "channelAdded" and "channelRemoved" will be fired only for channels from "User channels" list, not for the public one

Channel getMessages Now Returns a Paginator Rather Than an Array

channel-getmessages-now-returns-a-paginator-rather-than-an-array page anchor

We have standarized paging and as such paged resource (currently Message) lists will return a Paginator, not an array as previously.

This now looks as follows:


_10
// Get Messages for a previously created channel
_10
myChannel.getMessages()
_10
.then(function(messagesPage) {
_10
messagesPage.items.forEach(message => {
_10
console.log('Author:' + message.author);
_10
});
_10
if (messagesPage.hasNextPage) {
_10
return messagesPage.nextPage();
_10
}
_10
});

Anchor for Message Paging Changed Type

anchor-for-message-paging-changed-type page anchor

The anchor argument for getMessages has changed from a String representing a Message sid, to an integer representing the Message index


New Count Methods for Messages and Members

new-count-methods-for-messages-and-members page anchor

One of the most significant new features is an a set of counter methods: channel.getMembersCount(), channel.getMessagesCount() and channel.getUnconsumedMessagesCount().

Note: These new methods are currently semi-realtime. This means that this data will be eventually correct, but will also possibly be incorrect for a few seconds. The Chat system does not provide real time events for counter values changes.

So this is quite useful for any "unread messages count" badges, but we would not recommend any core application logic based on these counters being accurate in real time.


Rate this page: