Forum Discussion

PabloAubeleDeepL's avatar
PabloAubeleDeepL
Copper Contributor
Mar 11, 2024

Problems with MS Teams app for videocalls

Hello, everybody!

 

I am trying to build an app (webview) for MS Teams. It should show up on the right hand side of video calls.

 

I am basing on this repo: https://github.com/pnp/generator-teams/tree/main/packages/generator-teams

During development, I am using NGrok (which is the way that is documented), and uploading the ZIP file directly (via "Manage Apps" -> "Upload").

 

Everything was working great until March the 1st, where, in the version for Work or School, I started getting, when adding the app to the call (after uploading the ZIP file), the following error:

"Something went wrong when loading tab configuration dialog, please try again later" (screenshot attached).

 

A few considerations:
- I have checked my server logs, and there is no request made to the configuration tab URL
- If I open the configuration tab URL on my browser, it works
- I have tried disabling CORS, but nothing
- I have tried replacing the NGrok based URL with a "live" one. Also no luck

- It all stopped working suddenly for everybody in my team, without us having changed anything in the code base.

- I tried removing the "bots" and "staticTabs" sections in the manifest. No luck.

 

Could anybody help pointing me in the right direction? Thanks a lot in advance!

 

Here is the manifest.json file:

 

{
  "$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.13/MicrosoftTeams.schema.json",
  "manifestVersion": "1.13",
  "id": "<ID_OF_THE_APP>",
  "version": "0.0.1",
  "packageName": "teams-voice",
  "developer": {
    "name": "Test Dev",
    "websiteUrl": "https://teams-voice-app.ngrok.io",
    "privacyUrl": "https://teams-voice-app.ngrok.io/privacy.html",
    "termsOfUseUrl": "https://teams-voice-app.ngrok.io/tou.html"
  },
  "name": {
    "short": "teams-voice",
    "full": "teams-voice"
  },
  "description": {
    "short": "TODO: add short description here",
    "full": "TODO: add full description here"
  },
  "icons": {
    "outline": "icon-outline.png",
    "color": "icon-color.png"
  },
  "accentColor": "#D85028",
  "configurableTabs": [
    {
      "configurationUrl": "https://teams-voice-app.ngrok.io/voiceTab/config.html?name={loginHint}&tenant={tid}&group={groupId}&theme={theme}",
      "canUpdateConfiguration": true,
      "context": [
        "channelTab",
        "privateChatTab",
        "meetingChatTab",
        "meetingDetailsTab",
        "meetingSidePanel",
        "meetingStage"
      ],
      "scopes": ["team", "groupchat"]
    }
  ],
  "staticTabs": [
    {
      "entityId": "<ID_HERE>",
      "name": "test",
      "contentUrl": "https://teams-voice-app.ngrok.io/Bot/test.html",
      "scopes": ["personal", "team"]
    }
  ],
  "bots": [
    {
      "botId": "<ID_HERE>",
      "needsChannelSelector": true,
      "isNotificationOnly": false,
      "scopes": ["team", "personal", "groupchat"],
      "supportsCalling": true,
      "supportsVideo": true,
      "commandLists": [
        {
          "scopes": ["team", "personal"],
          "commands": [
            {
              "title": "Help",
              "description": "Shows help information"
            },
            {
              "title": "Who am I?",
              "description": "Shows information about your Teams user"
            },
            {
              "title": "Mention me",
              "description": "Let the bot @mention you"
            }
          ]
        }
      ]
    }
  ],
  "connectors": [],
  "composeExtensions": [],
  "permissions": ["identity", "messageTeamMembers"],
  "validDomains": ["teams-voice-app.ngrok.io"],
  "showLoadingIndicator": false,
  "isFullScreen": false
}

 

  • Hi PabloAubeleDeepL ,
    Sorry for the delay in response. Can you please share the deployed zip package so that we can test it from our end and also let us know are you facing this in which Teams version are you facing this error?

Resources