microsoft/botbuilder-js

Adaptive card reverting back after reacting to it in Teams

qinezh opened this issue · 1 comments

Versions

SDK version: 4.22.1
Platform: Teams

Describe the bug

I have created a Teams bot that supports:

  1. return an adaptive card when command received.
  2. return another adaptive card as invoke response when Action.Execute action is executed.

However, the card (step 2) reverted back to the previous one (step 1) after reacting to it. The issue occurs both in classic Teams and new Teams.

To Reproduce

Below's the test code with botbuilder SDK
import {
  ActivityTypes,
  CardFactory,
  MessageFactory,
  StatusCodes,
  TeamsActivityHandler,
  TurnContext,
} from "botbuilder";

export class TeamsBot extends TeamsActivityHandler {
  constructor() {
    super();

    this.onMessage(async (context, next) => {
      console.log("Running with Message Activity.");
      const card = CardFactory.adaptiveCard({
        "type": "AdaptiveCard",
        "body": [
          {
            "type": "TextBlock",
            "size": "Medium",
            "weight": "Bolder",
            "text": "Click button"
          },
          {
            "type": "ActionSet",
            "actions": [
              {
                "type": "Action.Execute",
                "verb": "doStuff",
                "title": "DoStuff"
              }
            ]
          }
        ],
        "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
        "version": "1.4"
      });

      const message = MessageFactory.attachment(card)
      await context.sendActivity(message);

      await next();
    });

    this.onTurn(async (context: TurnContext, next: () => Promise<void>) => {
      if (context.activity.name === "adaptiveCard/action") {
        const action = context.activity.value.action;
        const actionVerb = action.verb;

        if (actionVerb?.toLowerCase() === "dostuff") {
          const card = {
            "type": "AdaptiveCard",
            "body": [
              {
                "type": "TextBlock",
                "size": "Medium",
                "weight": "Bolder",
                "text": "✅[ACK]"
              },
              {
                "type": "TextBlock",
                "text": "Congratulations! Your task is processed successfully.",
                "wrap": true
              }
            ],
            "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
            "version": "1.4"
          };

          const response = {
            status: StatusCodes.OK,
            body: {
              statusCode: StatusCodes.OK,
              type: "application/vnd.microsoft.card.adaptive",
              value: card,
            },
          };
          await context.sendActivity({
            type: ActivityTypes.InvokeResponse,
            value: response,
          });
        }
      }

      await next();
    })
  }
}

Expected behavior

The adaptive cards won't be reverted after reactions.

Screenshots

ACCard-issue-on-reaction.mp4

This is a Teams question, and the linked issue would be the one to monitor.