I am trying to send horizontally scrollable carousel message on Facebook workplace platform using the generic template as described in the messenger platform documentation(Ref: https://developers.facebook.com/docs/messenger-platform/reference/template/generic)
The template that I am using looking something like this:
[
{
"text": "Hi!!!!"
},
{
"attachment": {
"type": "template",
"payload": {
"template_type": "generic",
"elements": [
{
"title": "Some Title 1",
"image_url": "some image url",
"buttons": [
{
"title": "button_title1",
"type": "postback",
"payload": "Title 1"
}
]
},
{
"title": "Some Title 2",
"image_url": "some image url",
"buttons": [
{
"title": "button_title2",
"type": "postback",
"payload": "Title 2"
}
]
},{
"title": "Some Title 3",
"image_url": "some image url",
"buttons": [
{
"title": "button_title3",
"type": "postback",
"payload": "Title 3"
}
]
},
]
}
}
}
]
Everything worked as I expected but, from the past 2 weeks or so, the order of carousel elements(cards in my case) isn't what I am expecting(i.e., Title1, Title2, Title3). The elements in the carousel are shown in a different order every time I use it. I just want to know if anyone else has the same issue or it has something to do with my code?
The code that I have used to send the message in the end is:
return new Promise((resolve, reject) => {
//(async ref:https://www.npmjs.com/package/async)
async.eachSeries(
//facebookMessages is the message template that I am using(posted above)
facebookMessages,
(msg, callback) => {
//sendFBSenderAction sends the message to FB using api(https://graph.facebook.com/v2.6/me/messages?access_token=<PAGE_ACCESS_TOKEN>)
this.sendFBSenderAction(sender, 'typing_on')
.then(() => this.sleep(this.messagesDelay))
.then(() => {
facebookMessages.attachment ? this.sendFbAttachment(msg) : this.sendFBMessage(sender, msg);
facebookMessages.attachment = false;
})
.then(() => callback())
.catch(callback);
},
err => {
if (err) {
console.error(err);
reject(err);
} else {
console.log('Messages sent');
resolve();
}
}
);
});
