microsoft-teamsteams-toolkitmicrosoft-teams-jsdevcontainer

Developing a Microsoft Teams Tab App inside of a DevContainer


We want to develop a Microsoft Teams tab app inside a DevContainer without using the Teams Toolkit Plugin for VSCode. To accomplish this, we are setting up a Teams Tab App using teamsapp.yml, teamsapp.local.yml, and manifest.json. We are not using launch.json or tasks.json since these are specific to VSCode.

To set up a development environment that sideloads the app into Teams, we plan to use the teamsfx CLI. By running the commands teamsfx account login m365, teamsfx provision --env local, and teamsfx deploy --env local, the teamsapp.local.yml gets executed and we can publish a private app within our organization.

The challenge we're facing is that we cannot use these commands inside our DevContainer because they open a browser window for the login process. We have deactivated MFA to enable a non-interactive login process, as suggested in the documentation for the GitHub action here. Additionally, we are providing credentials via the environment variables M365_ACCOUNT_NAME, M365_ACCOUNT_PASSWORD, and M365_TENANT_ID.

We read the documentation and issues of the TeamsFx repository and tried to solve the problem through trial and error. We also examined the documentation, issues, and code of the teamsfx-cli-action repository. It appears that developing Teams Apps in DevContainers is not yet widely supported, and it may be impossible with the current state of the TeamsFX-CLI, despite our initial expectations.


Solution

  • To log in to M365 in a non-interactive process, you need to set CI_ENABLED=true in your environment variables, along with M365_ACCOUNT_NAME, M365_ACCOUNT_PASSWORD, and M365_TENANT_ID. This will eliminate the need to run teamsfx account login m365, as teamsfx provision will automatically utilize the provided credentials.

    I think CI_ENABLED flag has already been set by the teamsfx-cli-action in CD environment, so you did not find it in the documentation.