Botframework-emulator: Since 4.5, Adaptive Card Inputs won't focus

[mdrichardson]

Version

4.5.0

Describe the bug

Unable to use most Adaptive Card input fields. It seems to lose focus as soon as I click in the input field and text immediately disappears. See gif.

To Reproduce

Try this:

{
    "type": "AdaptiveCard",
    "body": [
        {
            "type": "TextBlock",
            "text": "Test Adaptive Card"
        },
        {
            "type": "ColumnSet",
            "columns": [
                {
                    "type": "Column",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "Text:"
                        }
                    ],
                    "width": 20
                },
                {
                    "type": "Column",
                    "items": [
                        {
                            "type": "Input.Text",
                            "id": "userText",
                            "placeholder": "Enter Some Text"
                        }
                    ],
                    "width": 80
                }
            ]
        }
    ],
    "actions": [
        {
            "type": "Action.Submit",
            "title": "Submit"
        }
    ],
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.0"
}

import * as cardJson from './adaptiveCard.json';

this.addDialog(new TextPrompt('textPrompt'));

const card = CardFactory.adaptiveCard(cardJson);
const msg = MessageFactory.text('');
msg.attachments = [card];
await step.context.sendActivity(msg);
return await step.prompt('textPrompt', 'test');

Expected behavior

Able to use Adaptive Card inputs.

Additional context

@tdurnford says WebChat seems to work fine, still.

[bug]

[corinagum]

+1 on Web Chat no-repro; I just verified on 4.5 bits.

[tonyanziano]

Taking a look now

[tonyanziano]

I've confirmed it's an Emulator bug. (I tried it on the same Emulator bits, but one with [email protected] & one with @4.5.0 and they both reprod)

I believe it has something to do with the logic that highlights the selected activity when we click inside of it.

===

UPDATE: Found the issue. Working on a fix.

[tonyanziano]

Workaround for now:

Tabbing into the adaptive card input field and typing works as expected. Clicking into the field is what causes the issue.

[MarcBollmann]

Version

4.5.1

Describe the Bug

Unable to use Adaptive Card input fields. It seems to lose focus as soon as I click in the input field and text immediately disappears. Like above.. If I use right-click to enter value per value it works, but when the Card is out of focus the input gets removed again.

To Reproduce

{
  "type": "AdaptiveCard",
  "version": "1.0",
  "body": [
    {
      "items": [
        {
          "type": "TextBlock",
          "text": "Create Ticket",
          "size": "ExtraLarge"
        },
        {
          "type": "TextBlock",
          "text": "You already entered this information"
        },
        {
          "type": "Container",
          "items": [
            {
              "type": "FactSet",
              "facts": [
              ]
            },
            {
              "type": "TextBlock",
              "text": "What's your problem?*"
            },
            {
              "type": "Input.Text",
              "placeholder": "Describe your problem",
              "isMultiline": true,
              "id": "input_problem"
            },
            {
              "type": "TextBlock",
              "text": "Do you have an error-code?"
            },
            {
              "type": "Input.Text",
              "placeholder": "Paste in your error-code if you have one",
              "isMultiline": true,
              "id": "input_errorcode"
            }
          ]
        }
      ],
      "type": "Container"
    },
    {
      "type": "Container",
      "items": [
        {
          "type": "FactSet",
          "facts": [
            {
              "title": "Submitted By",
              "value": "UserNameHere"
            },
            {
              "title": "Submitted On",
              "value": "DateHere"
            }
          ]
        }
      ]
    }
  ],
  "actions": [
    {
      "type": "Action.Submit",
      "title": "Submit",
      "data": {
        "action": "submit"
      },
      "style": "positive",
      "id": "submit"
    },
    {
      "type": "Action.Submit",
      "title": "Cancel",
      "data": {
        "action": "cancel"
      },
      "style": "destructive",
      "id": "cancel"
    }
  ],
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "lang": "en"
}

[tonyanziano]

I can repro this, and it's because the example you are using is a <textarea> tag and not an <input> tag which is what #1681 fixed.

Today I will work on a fix for all the different inputs within adaptive cards, and I think we will push out a patch as well. I'll keep this thread updated.

[tonyanziano]

This issue has been fixed in the newest release, 4.5.2, available now.