Dialogflow-fulfillment-nodejs: Suggestion and Payload do not work with new Dialogflow Facebook callback url

[ioannist]

Dialogflow has announced that all Facebook integrations have to switch to a new callback URL of the type:
https://dialogflow.cloud.google.com/v1/integrations/facebook/webhook/####################

Old URLs still work, but they will automatically forward to the new URL at the end of June 2020.

I was testing the new callback URL and I found that my Payload and Suggestion responses do not work.

const { WebhookClient, Payload, Suggestion } = require('dialogflow-fulfillment');
const agent = new WebhookClient({ request, response });
agent.add(new Payload(agent.FACEBOOK, validCarouselObject));

The responses work fine with the old URL (went back and forth multiple times). Any idea what may be causing this?

[ioannist]

Had a chat with Dialogflow support team on this one. Their response:

_Regarding the payload object in the nodejs fulfillment library, I was able to reproduce your issue but have to conduct further investigation to narrow the scope of the issue. At the moment, I can confirm that if you provide the custom payload response in the intent's Response section, it will correctly send the payload and display the roulette. This may be feasible for you if the contents of the roulette are static or fixed._

[ioannist]

Solved this today (last day before the switch)

For Payload, we have to turn on the sendAsMessage flag

    agent.add(
      new Payload(agent.FACEBOOK, carousel, {
        sendAsMessage: true,
        rawPayload: false,
      })
    );

For Suggestions, unfortunately, there is no flag. The only solution I found was to reconstruct the Suggestion as a Quick Reply (for Facebook) and send it as a Payload with the sendAsMessage flag set to true.

    agent.add(
      new Payload(agent.FACEBOOK,
      {
        "text": "Pick a color:",
        "quick_replies": [ ... ] // see https://developers.facebook.com/docs/messenger-platform/reference/buttons/quick-replies
      },
      {
        sendAsMessage: true,
        rawPayload: false,
      })
    );