Search code examples
node.jsbotframeworkbotsmicrosoft-teams

Adaptive Card returns undefined in Microsoft Teams but works well in bot emulator


I've created bot that will return an adaptive card when i type a certain command. I've tested it on Bot Framework Emulator and it shows the card.

But when i tested it on Microsoft Teams, it returns undefined :

Bot Framework Emulator

enter image description here

Microsoft Teams

enter image description here App.js

require('dotenv-extended').load();

var util = require('util');
var builder = require('botbuilder');
var restify = require('restify');

// Setup Restify Server
var server = restify.createServer();
server.listen(process.env.port || process.env.PORT || 3978, function () {
    console.log('%s listening to %s', server.name, server.url);
});

// Create chat bot and listen to messages
var connector = new builder.ChatConnector({
    appId: process.env.MICROSOFT_APP_ID,
    appPassword: process.env.MICROSOFT_APP_PASSWORD
});
server.post('/api/messages', connector.listen());

var inMemoryStorage = new builder.MemoryBotStorage();

var bot = new builder.UniversalBot(connector, function (session) {

    if (session.message && session.message.value) {
        // A Card's Submit Action obj was received
        processSubmitAction(session, session.message.value);
        return;
    }
}).set('storage', inMemoryStorage); // Register in memory storage

// Help
bot.dialog('support', require('./support'))
    .triggerAction({
        matches: [/help/i, /support/i, /problem/i]
    });

// log any bot errors into the console
bot.on('error', function (e) {
    console.log('And error ocurred', e);
});

function processSubmitAction(session, value) {
    var defaultErrorMessage = 'Please complete all the field';
    switch (value.type){
        case 'support':
            session.send("Issue Created");
            break;
        default:
            session.send(defaultErrorMessage);
    }
}

Support.js

var builder = require('botbuilder');
module.exports = function (session) {
    var msg = new builder.Message(session)
    .addAttachment({
        contentType: "application/vnd.microsoft.card.adaptive",
        content: {
            type: "AdaptiveCard",
            speak: "<s>Your  meeting about \"Adaptive Card design session\"<break strength='weak'/> is starting at 12:30pm</s><s>Do you want to snooze <break strength='weak'/> or do you want to send a late notification to the attendees?</s>",
               body: [
                {
                    "type": "ColumnSet",
                    "columns": [
                        {
                            "type": "Column",
                            "items": [
                                {
                                    "type": "TextBlock",
                                    "weight": "Bolder",
                                    "text": "Title",
                                    "wrap": true
                                },
                                {
                                    "type": "Input.Text",
                                    "id": "issueName",
                                    "placeholder": "Issue Title"
                                },
                                {
                                    "type": "TextBlock",
                                    "weight": "Bolder",
                                    "text": "Description",
                                    "wrap": true
                                },
                                {
                                    "type": "Input.Text",
                                    "id": "issueDescription",
                                    "placeholder": "Issue Description",
                                    "style": "Email"
                                },
                                {
                                    "type": "TextBlock",
                                    "weight": "Bolder",
                                    "text": "Issue Type"
                                },
                                {
                                    "type": "Input.ChoiceSet",
                                    "id": "issueType",
                                    "placeholder": "Placeholder text",
                                    "choices": [
                                        {
                                            "title": "Bug",
                                            "value": "Bug"
                                        },
                                        {
                                            "title": "Task",
                                            "value": "Task"
                                        },
                                        {
                                            "title": "Improvement",
                                            "value": "Improvement"
                                        },
                                        {
                                            "title": "New Feature",
                                            "value": "New Feature"
                                        }
                                    ],
                                    "style": "expanded"
                                },
                                {
                                    "type": "TextBlock",
                                    "weight": "Bolder",
                                    "text": "Assignee"
                                },
                                {
                                    "type": "Input.Text",
                                    "id": "issueAssignee",
                                    "placeholder": "Assigne Username"
                                }
                            ],
                            "width": 2
                        }
                    ]
                }
            ],
            "actions": [
                {
                    "type": "Action.Submit",
                    "id": "submitBtn",
                    "title": "Submit",
                    "data":{
                        "type":"support"
                    }
                }
            ]
        }
    });
session.send(msg);
session.endDialog();
};

Can you tell me where did i do wrong ? Thanks before.


Solution

  • I've changed the code in support.js to :

    var builder = require('botbuilder');
    module.exports = function (session) {
        // var customMessage = new builder.Message(session)
        // .text("Hello!")
        // .textFormat("plain")
        // .textLocale("en-us");
        var card = {
            'contentType': 'application/vnd.microsoft.card.adaptive',
            'content': {
                "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
                "type": "AdaptiveCard",
                "version": "1.0",
                "body": [
                            {
                                "type": "ColumnSet",
                                "columns": [
                                    {
                                        "type": "Column",
                                        "items": [
                                            {
                                                "type": "TextBlock",
                                                "weight": "Bolder",
                                                "text": "Title",
                                                "wrap": true
                                            },
                                            {
                                                "type": "Input.Text",
                                                "id": "issueName",
                                                "placeholder": "Issue Title"
                                            },
                                            {
                                                "type": "TextBlock",
                                                "weight": "Bolder",
                                                "text": "Description",
                                                "wrap": true
                                            },
                                            {
                                                "type": "Input.Text",
                                                "id": "issueDescription",
                                                "placeholder": "Issue Description",
                                                "style": "Email"
                                            },
                                            {
                                                "type": "TextBlock",
                                                "weight": "Bolder",
                                                "text": "Issue Type"
                                            },
                                            {
                                                "type": "Input.ChoiceSet",
                                                "id": "issueType",
                                                "placeholder": "Placeholder text",
                                                "choices": [
                                                    {
                                                        "title": "Bug",
                                                        "value": "Bug"
                                                    },
                                                    {
                                                        "title": "Task",
                                                        "value": "Task"
                                                    },
                                                    {
                                                        "title": "Improvement",
                                                        "value": "Improvement"
                                                    },
                                                    {
                                                        "title": "New Feature",
                                                        "value": "New Feature"
                                                    }
                                                ],
                                                "style": "expanded"
                                            },
                                            {
                                                "type": "TextBlock",
                                                "weight": "Bolder",
                                                "text": "Assignee"
                                            },
                                            {
                                                "type": "Input.Text",
                                                "id": "issueAssignee",
                                                "placeholder": "Assigne Username"
                                            }
                                        ],
                                        "width": 2
                                    }
                                ]
                            }
                        ],
                        "actions": [
                            {
                                "type": "Action.Submit",
                                "id": "submitBtn",
                                "title": "Submit",
                                "data":{
                                    "type":"support"
                                }
                            }
                        ]
                    }
        };
        var customMessage = new builder.Message(session)
                .addAttachment(card);
    // console.log(session);
    session.send(customMessage);
    session.endDialog();
    };
    

    and it's working now