BotFramework-WebChat icon indicating copy to clipboard operation
BotFramework-WebChat copied to clipboard

Text overflowing instead of wrapping in Adaptive Cards in Webchat

Open jiruss opened this issue 4 years ago • 0 comments

Describe the bug

Text is overflowing instead of wrapping in Adaptive Cards when in an unordered list.

Steps to reproduce

  1. Create a simple bot and have it send an adaptive card activity that sends the following card payload
{
    "type": "AdaptiveCard",
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.3",
    "body": [
        {
            "type": "Container",
            "items": [
                {
                    "type": "TextBlock",
                    "text": "This is the heading",
                    "wrap": true
                },
                {
                    "type": "TextBlock",
                    "text": "* This is a test to show how the text is overflowing the container and wrapping is failing it should be in an unordered list.",
                    "wrap": true
                }
            ]
        }
    ]
}

Expected behavior

The contents should not overflow the container ideally

Screenshots

Problem Overflow

How it should appear no overflow

Additional context

We have been able to workaround it by including the following CSS in our stylesheet but we are concerned this may break in the future or not always work.

ul { width: auto !important; }?

Version

botframework-webchat:ui:version" content="4.14.1

[Bug]

jiruss avatar Sep 15 '21 15:09 jiruss