[Rendering] Teams rendering Dates incorrectly in Adaptive Cards on iOS

sznorbert07 commented 1 year ago

I am developing MS Teams app which with the user can search in and send cards from an internal system. The card contains Date and Time values, which are rendered incorrectly only on iOS.

I figured out that the issue only occurs if I am using a specific Date Format. I have the following settings in iPhone: Settings -> General -> Language & Region

Region -> select Hungary
Date Format -> select first option, for me its 2022. 08. 29

I have tried it with few other settings, but those are all working, and the card looks good on other platforms (Android, Desktop, Browser).

This is how it looks like on iPhone 12 Mini and iPhone 14 (both iOS 16 and the latest Teams):

The bot creates the following Adaptive Card:

{
  "type": "AdaptiveCard",
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "version": "1.4",
  "verticalContentAlignment": "Top",
  "body": [
    {
      "type": "ColumnSet",
      "spacing": "None",
      "horizontalAlignment": "Left",
      "columns": [
        {
          "type": "Column",
          "width": 1,
          "items": [
            {
              "type": "Image",
              "url": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAIAAAAlC+aJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAABbSURBVGhD7c8BCQAwDMCwmZjny76MMCjEQObNnlZAK6AV0ApoBbQCWgGtgFZAK6AV0ApoBbQCWgGtgFZAK6AV0ApoBbQCWgGtgFZAK6AV0ApoBbQCWgHteGD2A0Bh0IgCvu/vAAAAAElFTkSuQmCC",
              "size": "Medium",
              "isVisible": true,
              "horizontalAlignment": "Center"
            }
          ]
        },
        {
          "type": "Column",
          "width": 4,
          "items": [
            {
              "type": "TextBlock",
              "text": "Just a sample title",
              "wrap": true,
              "fontType": "Default",
              "size": "Large",
              "weight": "Bolder",
              "spacing": "None",
              "separator": true
            },
            {
              "type": "ColumnSet",
              "columns": [
                {
                  "type": "Column",
                  "width": 1,
                  "items": [
                    {
                      "type": "TextBlock",
                      "text": "Start",
                      "wrap": true,
                      "isSubtle": true,
                      "weight": "Bolder"
                    },
                    {
                      "type": "TextBlock",
                      "text": "{{DATE(2022-12-20T00:00:00Z)}} {{TIME(2022-12-20T00:00:00Z)}}",
                      "wrap": true,
                      "spacing": "None"
                    }
                  ]
                },
                {
                  "type": "Column",
                  "width": 1,
                  "items": [
                    {
                      "type": "TextBlock",
                      "text": "End",
                      "wrap": true,
                      "isSubtle": true,
                      "weight": "Bolder"
                    },
                    {
                      "type": "TextBlock",
                      "text": "{{DATE(2022-12-21T00:00:00Z)}} {{TIME(2022-12-21T00:00:00Z)}}",
                      "wrap": true,
                      "spacing": "None"
                    }
                  ]
                }
              ]
            }
          ]
        }
      ]
    }
  ]
}

It is a crucial feature of our App, so I hope you can find a solution for the bug as soon as possible.

ghost commented 1 year ago

Hi sznorbert07! Thank you for bringing this issue to our attention. We will investigate and if we require further information we will reach out in one business day. Please use this link to escalate if you don't get replies.

Best regards, Teams Platform