microsoft / microsoft/BotFramework-WebChat

Adpative card version 1.5 Table is not rendering in WebChat

Open
#4,626 5 comments 0 reactions 1 assignee View on GitHub

@compulim is already working on this.

Since Feb 27, 2023.

Bot Services bug customer-replied-to customer-reported
Dominant language
HTML
Stars
1.8k
Forks
1.6k
Avg merge
22h 58m
Merged PRs (30d)
2

Description

Is it an issue related to Adaptive Cards?

Yes, this is an Adaptive Card issue, however it only repro on Web Chat.

Is this an accessibility issue?

No

What version of Web Chat are you using?

Latest production

Which distribution are you using Web Chat from?

Bundle (webchat.js)

Which hosting environment does this issue primarily affect?

Web apps

Which browsers and platforms do the issue happened?

No response

Which area does this issue affect?

Attachment: Adaptive Card

What is the public URL for the website?

No response

Please describe the bug

Tables are a feature that surfaced in adaptive card version 1.5. But they are not rendering in WebChat. They also do not work in Test in WebChat, Emulator or Composer.

Below is the sample JSON structure of the adaptive card.

Do you see any errors in console log?

No response

How to reproduce the issue?

Test by sending above adaptive card using type Table.

What do you expect?

To render card and table correctly.

What actually happened?

Web Chat and Test in Web Chat give a friendly error:
image

Emulator and Composer give an empty response:
image

Do you have any screenshots or recordings to repro the issue?

No response

Adaptive Card JSON
{
  "type": "AdaptiveCard",
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "version": "1.5",
  "body": [
    {
      "type": "Table",
      "columns": [
        {
          "width": 1
        },
        {
          "width": 1
        },
        {
          "width": 1
        }
      ],
      "rows": [
        {
          "type": "TableRow",
          "cells": [
            {
              "type": "TableCell",
              "items": [
                {
                  "type": "TextBlock",
                  "text": "11",
                  "wrap": true
                }
              ]
            },
            {
              "type": "TableCell",
              "items": [
                {
                  "type": "TextBlock",
                  "text": "111",
                  "wrap": true
                }
              ]
            },
            {
              "type": "TableCell",
              "items": [
                {
                  "type": "TextBlock",
                  "text": "1111",
                  "wrap": true
                }
              ]
            }
          ]
        },
        {
          "type": "TableRow",
          "cells": [
            {
              "type": "TableCell",
              "items": [
                {
                  "type": "TextBlock",
                  "text": "22",
                  "wrap": true
                }
              ]
            },
            {
              "type": "TableCell",
              "items": [
                {
                  "type": "TextBlock",
                  "text": "222",
                  "wrap": true
                }
              ]
            },
            {
              "type": "TableCell",
              "items": [
                {
                  "type": "TextBlock",
                  "text": "2222",
                  "wrap": true
                }
              ]
            }
          ]
        },
        {
          "type": "TableRow",
          "cells": [
            {
              "type": "TableCell",
              "items": [
                {
                  "type": "TextBlock",
                  "text": "33",
                  "wrap": true
                }
              ]
            },
            {
              "type": "TableCell",
              "items": [
                {
                  "type": "TextBlock",
                  "text": "333",
                  "wrap": true
                }
              ]
            },
            {
              "type": "TableCell",
              "items": [
                {
                  "type": "TextBlock",
                  "text": "3333",
                  "wrap": true
                }
              ]
            }
          ]
        }
      ]
    }
  ]
}
Additional context

Does not reproduce in Adaptive Cards Designer.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.