Botframework-webchat: Blocked: Web Chat rendering huge buttons

Created on 23 Oct 2018  路  9Comments  路  Source: microsoft/BotFramework-WebChat

I can provide a repro. The issue seems to be this property is being added to the button flex: 0 1 100%; when I change it to flex: 0 1 auto; the issue goes away

relater PR in adaptive cards repo https://github.com/Microsoft/AdaptiveCards/pull/1795/files

Webchat is rendering my signin card like this:
image

Notes for @corinagum :

ac-pushButton

#bot > div > div > div.wc-message-pane > div.wc-message-groups > div > div:nth-child(4) > div.wc-message.wc-message-from-bot > div > div > div > div > div > div > div:nth-child(3) > div:nth-child(1) > div > button: {
  flex-shrink: auto;
}
Bug Adaptive Cards blocked front-burner
Source
picture JasonSowers

All 9 comments

Thanks Jason. I'll look into this. :)

corinagum picture corinagum on 23 Oct 2018

Seems to be repro of #933

corinagum picture corinagum on 24 Oct 2018

Steps to do:

  • Bump Adaptive Cards to a version that contains the fix
  • Verify Adaptive Cards in Web Chat
compulim picture compulim on 24 Oct 2018

@JasonSowers I tried to bump to Adaptive Cards 1.1 (in this PR #1231), which I believe they should have this fix (AC 1.1 released just weeks ago, and their fix to this issue released in August).

But unfortunately, looks like they didn't fix it yet (or they didn't fixing our problem). I have commented on their PR and ask them to review it.

So I need them to verify if they really fixed it or not.

compulim picture compulim on 24 Oct 2018

We are blocked until the following AC bug is fixed:
https://github.com/Microsoft/AdaptiveCards/issues/1794

Once fixed, we can pick up that version of AC, and push out an updated WebChat

sgellock picture sgellock on 30 Oct 2018

@JasonSowers @corinagum Could you help me to verify one thing?

On your web page that you got this problem, can you check if you have <!DOCTYPE html> specified? If no, can you add it and see if it workaround the problem?

It seems rendering in HTML5 might workaround it.

compulim picture compulim on 31 Oct 2018
👍1

<!DOCTYPE html> Fixed it 馃憤

JasonSowers picture JasonSowers on 31 Oct 2018

馃嵕 馃帀馃檶

Will keep this bug open. I think Adaptive Cards team would love to know/fix this HTML 4 problem.

compulim picture compulim on 31 Oct 2018
❤1

The tracked bug https://github.com/Microsoft/AdaptiveCards/issues/1794 is still open.

compulim picture compulim on 27 Nov 2018
Was this page helpful?
0 / 5 - 0 ratings

Related issues

compulim picture compulim  路  3Comments
stevengum picture stevengum  路  4Comments
GewoonMaarten picture GewoonMaarten  路  3Comments
compulim picture compulim  路  3Comments
AndreMantas picture AndreMantas  路  4Comments