Updates from: 03/30/2022 01:54:14
Service Microsoft Docs article Related commit history on GitHub Change details
platform Teams Developer Portal https://github.com/MicrosoftDocs/msteams-docs/commits/main/msteams-platform/concepts/build-and-test/teams-developer-portal.md
The <a href="https://dev.teams.microsoft.com" target="_blank">Developer Portal f
:::image type="content" source="../../assets/images/tdp/tdp_home_1.png" alt-text="Screenshot showing the home page of the Developer Portal for Teams."::: > [!NOTE]
-> Currently, Developer Portal is not available for Government Community Cloud (GCC), GCC-High, or Department of Defense (DOD) tenants.
+>
+> * Currently, Developer Portal is not available for Government Community Cloud (GCC), GCC-High, or Department of Defense (DOD) tenants.
+> * However, you can use a regular tenant to build an app in the Developer Portal, download the app, and upload the app using [Microsoft Graph](/graph/api/teamsapp-publish?view=graph-rest-1.0&tabs=http&preserve-view=true) to a national cloud. For more information, see [National cloud deployments](/graph/deployments).
## Register an app
platform Teams Store Validation Guidelines https://github.com/MicrosoftDocs/msteams-docs/commits/main/msteams-platform/concepts/deploy-and-publish/appsource/prepare/teams-store-validation-guidelines.md
Following these guidelines increases the chances of your app to pass the Microso
## Value proposition
-> [!NOTE]
-> This section is inline with [Microsoft commercial certification policy number 1140.1](/legal/marketplace/certification-policies#11401-value-proposition-and-offer-requirements) and provides additional guidance to developers of Microsoft Teams apps on their offerΓÇÖs value proposition.
### App name [*Mandatory Fix*]
-> [!NOTE]
-> This section is inline with Microsoft [commercial certification policy number 1140.1.1](/legal/marketplace/certification-policies#114011-app-name) and provides additional guidance to developers on naming their apps.
An app's name plays a critical role in how users discover it in the store. Use the following guidelines to name an app:
An app's name plays a critical role in how users discover it in the store. Use t
[*Mandatory Fix*]
-> [!NOTE]
-> This section is inline with Microsoft commercial certification policy number [1140.1.2](/legal/marketplace/certification-policies#114012-workplace-appropriateness), [100.8](/legal/marketplace/certification-policies#1008-significant-value), and [100.10](/legal/marketplace/certification-policies#10010-inappropriate-content) and provides additional guidance to developers on building workplace appropriate apps.
App content must be suitable for general workplace consumption and follow all restrictions listed in the commercial marketplace certification policies. Content related to religion, politics, gambling, and prolonged entertainment is prohibited.
Your app must enable group collaboration, improve an individual's productivity,
[*Mandatory Fix*]
-> [!NOTE]
-> This section is inline with [Microsoft commercial certification policy number 1140.1.3](/legal/marketplace/certification-policies#114013-other-platforms-and-services).
Apps must focus on the Teams experience and not include the names, icons, or imagery of other similar chat-based collaboration platforms or services within the app content or in the appΓÇÖs metadata unless the app provides specific interoperability.
App feature names in buttons and other UI text must not duplicate with terminolo
[*Mandatory Fix*]
-> [!NOTE]
-> This section is inline with [Microsoft commercial certification policy number 1140.1.4](/legal/marketplace/certification-policies#114014-access-to-services) and provides guidance to developers on authenticating their apps with external services.
For more information on how to implement app authentication, see [authentication in Teams](~/concepts/authentication/authentication.md). #### Authenticating with external services
- If your app authenticates users with an external service, follow these guidelines:
+If your app authenticates users with an external service, follow these guidelines:
* **Sign in, sign out, and sign up experiences**: * Apps that depend on external accounts or services must provide clear and simple sign in, sign out, and sign up experience.
For more information on how to implement app authentication, see [authentication
## Security
-> [!NOTE]
-> This section is inline with [Microsoft commercial certification policy number 1140.3](/legal/marketplace/certification-policies#11403-security).
+ ### Financial information [*Mandatory Fix*]
-> [!NOTE]
-> This section is inline with [Microsoft commercial certification policy number 1140.3.1](/legal/marketplace/certification-policies#114031-financial-transactions) and provides guidance on transmission of financial information within the Teams interface and notifies developers of restricted payment scenarios on the mobile (Android and iOS) version of their Teams app.
Apps must not ask users to make payments within the Teams interface and transmit financial information to users through a bot interface.
Apps running on the iOS or Android version of Teams must adhere to the following
[*Mandatory Fix*]
-> [!NOTE]
-> This section is inline with [Microsoft commercial marketplace policy number 1140.3.2](/legal/marketplace/certification-policies#114032-bots-and-messaging-extension).
For apps that use the Microsoft Azure Bot Service (such as bots and messaging extensions), you must follow all requirements defined in the Microsoft [Online Services Terms](https://www.microsoftvolumelicensing.com/DocumentSearch.aspx?Mode=3&DocumentTypeId=46).
Bots must always ask permission to upload a file and display a confirmation mess
[*Mandatory Fix*]
-> [!NOTE]
-> This section is inline with [Microsoft commercial marketplace policy number 1140.3.3](/legal/marketplace/certification-policies#114033-external-domains) and provides developer guidance on usage of restricted domains in the `validDomains` manifest property.
Don't include domains outside of your organization's control (including wildcards) and tunneling services in your app's domain configurations. The following exceptions include:
App must warn users before downloading any files or executables (.exe) into the
## General functionality and performance
-> [!NOTE]
-> This section is inline with [Microsoft commercial marketplace policy number 1140.4](/legal/marketplace/certification-policies#11404-functionality).
### Launching external functionality
If setup of your app for testing purposes is complex, provide an end-to-end func
## Tabs
-> [!NOTE]
-> This section is inline with [Microsoft commercial marketplace policy number 1140.4.2](/legal/marketplace/certification-policies#114042-tabs).
If your app includes a tab, ensure it adheres to these guidelines. > [!TIP] > For more information on creating a high-quality app experience, see [Teams tab design guidelines](~/tabs/design/tabs.md).
Design your app with [basic](~/concepts/design/design-teams-app-basic-ui-compone
## Bots
-> [!NOTE]
-> This section is inline with [Microsoft commercial marketplace policy number 1140.4.3](/legal/marketplace/certification-policies#114043-bots).
If your app includes a bot, ensure it adheres to these guidelines.
Apps that provide only notifications with content such as **You have a new notif
## Messaging extensions
-> [!NOTE]
-> This section is inline with [Microsoft commercial marketplace policy number 1140.4.4](/legal/marketplace/certification-policies#114044-messaging-extensions).
If your app includes a messaging extension, ensure it adheres to these guidelines.
Link unfurling only apps don't provide significant value within Teams. Consider
## Task modules
-> [!NOTE]
-> This section is inline with [Microsoft commercial marketplace policy number 1140.4.5](/legal/marketplace/certification-policies#114045-task-modules).
A task module must include an icon and the short name of the app it's associated with. Task modules must not embed an entire app and only display the components required to complete a specific action. [*Mandatory Fix*]
For more information, see [Teams task module design guidelines](~\task-modules-a
## Meeting extensions
-> [!NOTE]
-> This section is inline with [Microsoft commercial marketplace policy number 1140.4.6](/legal/marketplace/certification-policies#114046-meeting-extensions).
> [!TIP] > For more information on creating a high-quality app experience, see the [Teams meeting extension design guidelines](~/apps-in-teams-meetings/design/designing-apps-in-meetings.md).
Use the following guidelines for meeting extensions:
## Notifications
-> [!NOTE]
-> This section is inline with [Microsoft commercial marketplace policy number 1140.4.7](/legal/marketplace/certification-policies#114047-notification-apis).
If your app uses the [activity feed APIs provided by Microsoft Graph](/graph/teams-send-activityfeednotifications), ensure it adheres to the following guidelines.
If your app uses the [activity feed APIs provided by Microsoft Graph](/graph/tea
## Microsoft 365 App Compliance Program
-> [!NOTE]
-> This section is inline with [Microsoft commercial marketplace policy number 1140.6](/legal/marketplace/certification-policies#11406-publisher-attestation).
The Microsoft 365 App Compliance Program is intended to help organizations assess and manage risk by evaluating security and compliance information about your app. If you're publishing an app to the Teams store, you must complete the following tiers of the program:
The Microsoft 365 App Compliance Program is intended to help organizations asses
* **Publisher Attestation**: A process in which you share general, data handling, and security and compliance information to help potential customers make informed decisions about using your app.
-> [!NOTE]
-> If you're submitting an app that hasn't been listed previously, you can't officially complete Publisher Attestation until your app is in the Teams store. If you're updating a listed app, complete Publisher Attestation before you submit the latest version of the app.
## Advertising
-> [!NOTE]
-> This section is in line with [Microsoft commercial marketplace policy number 1140.7](/legal/marketplace/certification-policies#11407-advertising).
Apps must not display advertising, including dynamic ads, banner ads, and ads in message.
platform People Picker Capability https://github.com/MicrosoftDocs/msteams-docs/commits/main/msteams-platform/concepts/device-capabilities/people-picker-capability.md
Title: Integrate People Picker -
+ Title: Integrate People Picker
description: How to use Teams JavaScript client SDK to integrate People Picker control keywords: people picker control
+ms.localizationpriority: high
-# Integrate People Picker
+# Integrate People Picker
-People Picker is a control to search and select people. This is a native capability available in Teams platform. You can integrate Teams native People Picker input control with your web apps. You can select between single or multi selection, and configurations, such as limiting search within a chat, channels, or across the entire organization.
+People Picker is an input control in Teams that allows users to search and select people. You can integrate People Picker input control in a web app, which allows end users to perform different functions such as, search and select people in a chat, channel, or across the organization within Teams. The People Picker control is available across all Teams clients, such as web, desktop, and mobile.
-You can use [Microsoft Teams JavaScript client SDK](/javascript/api/overview/msteams-client?view=msteams-client-js-latest&preserve-view=true), which provides `selectPeople` API to integrate the People Picker within your web app.
+You can use [Microsoft Teams JavaScript client SDK](/javascript/api/overview/msteams-client?view=msteams-client-js-latest&preserve-view=true), which provides the `selectPeople` API to integrate the People Picker input control in your web app.
-## Advantages of integrating the native People Picker
+## Advantages of using People Picker
-* People Picker control works in all of Teams surfaces, such as task module, a chat, channel, meeting tab, and personal app.
-* This control allows you to search for and select users within a chat, channel, or the entire organization.
-* People Picker helps with scenarios involving task assignment, tagging, notifying a user.
-* You can use this readily available control in your web app. It saves the effort and time significantly to build such a control on your own.
+* Works on all Teams capabilities, such as task module, chat, channel, meeting tab, and personal app.
+* Allows the user to search and select people in a chat, channel, or the entire organization within Teams.
+* Helps in scenarios involving task assignment, tagging, and notifying user.
+* Saves significant time and effort in comparison to building any similar control.
-You must call the `selectPeople` API to integrate People Picker control in your Teams app. For effective integration, you must have an understanding of [code snippet](#code-snippet) for calling the API.
-It is important to familiarize yourself with the [API response errors](#error-handling) to handle the errors in your web app.
-
-> [!NOTE]
-> Currently, Microsoft Teams support for People Picker is available for mobile clients only.
+To integrate People Picker input control in your Teams app, use the [`selectPeople`](#selectpeople-api) API. To integrate and call the API, you must have a good understanding of accompanying [code snippet](#code-snippet). You also need familiarity with [API response errors](#error-handling).
## `selectPeople` API
-`selectPeople` API enables you to add Teams native `People Picker input control` to your web apps.
-The API description is as follows:
+The `selectPeople` API enables you to add Teams People Picker input control to the web apps and also helps you with the following:
+
+* Allows the user to search and select one or more people from the list.
+* Returns the ID, name, and email address of selected users to the web app.
-| API | Description |
-| | |
-|**selectPeople**|Launches a People Picker and allows the user to search and select one or more people from the list.<br/><br/>This API returns the ID, name and email address of selected users to the calling web app.<br/><br/>In case of a personal app, the control searches across the organization. If the app is added to a chat or channel, then the search context is configured depending on the scenario. The search is restricted within the members of that chat, channel, or made available across the organization.|
+In case of a personal app, the control searches for name or email ID across the organization within Teams. If the app is added to a chat or channel, then the search context is configured based on the scenario. The search is restricted within the members of that chat or channel.
-The `selectPeople` API comes along with following input configurations:
+The `selectPeople` API comes with the following input configurations:
|Configuration parameter|Type|Description| Default value| |--||--||
-|`title`| String| It is an optional parameter. It sets title for the People Picker control. | Select people|
-|`setSelected`|String| It is an optional parameter. You must pass Microsoft Azure Active Directory (Azure AD) IDs of the people to be preselected. This parameter preselects people while launching the People Picker control. In case of single selection, only the first valid user is prepopulated ignoring the rest. |Null|
-|`openOrgWideSearchInChatOrChannel`|Boolean | It is an optional parameter. When it is set to true, it launches the People Picker in organization wide scope even if the app is added to a chat or channel. |False|
-|`singleSelect`|Boolean|It is an optional parameter. When it is set to true, it launches the People Picker restricting the selection to one user only. |False|
+|`title`|String| It's an optional parameter and sets the title for the People Picker control.|`selectPeople`|
+|`setSelected`|String| It's an optional parameter. You must pass Microsoft Azure Active Directory (Azure AD) IDs of the people to be preselected. This parameter preselects people while launching the People Picker input control. In case of a single selection, only the first valid user is pre-populated ignoring the rest.|**Null**|
+|`openOrgWideSearchInChatOrChannel`|Boolean| It's an optional parameter and when set to true, it launches the People Picker in organization wide scope even if the app is added to a chat or channel.|**False**|
+|`singleSelect`|Boolean|It's an optional parameter and when set to true, it launches the People Picker and restricts the selection to only one user.|**False**|
+
+The following image displays the experience of People Picker on mobile and desktop:
+
+# [Mobile](#tab/Samplemobileapp)
+
+The People Picker input control allows the user to search and add people using the following steps:
+
+1. Type the name of the required person. The list appears with name suggestions.
+1. Select the name of the required person from the list.
-The following image depicts the experience of People Picker in a sample web app:
+ :::image type="content" source="../../assets/images/tabs/people-picker-control-capability-mobile-updated.png" alt-text="Picker Picker mobile" border="true":::
-![Web app experience of People Picker](../../assets/images/tabs/people-picker-control-capability.png)
+# [Desktop](#tab/Sampledesktop)
+
+The People Picker control on web or desktop is launched in a modal window on top of your web app and to add people use the following steps:
+
+1. Type the name of the required person. The list appears with name suggestions.
+1. Select the name of the required person from the list.
+
+ :::image type="content" source="../../assets/images/tabs/select-people-picker-byname.png" alt-text="People picker by name desktop" border="true":::
++
-### Code snippet
+## Code snippet
-**Calling `selectPeople` API** to select people from a list:
+The following code snippet displays use of the `selectPeople` API people from a list:
```javascript microsoftTeams.people.selectPeople((error: microsoftTeams.SdkError, people: microsoftTeams.people.PeoplePickerResult[]) =>
The following image depicts the experience of People Picker in a sample web app:
## Error handling
-You must ensure to handle the errors appropriately in your web app. The following table lists the error codes and the conditions under which the errors are generated:
+The following table lists the error codes and their descriptions:
-|Error code | Error name | Condition|
-| | | -- |
+|Error code | Error name | Description|
+| | | |
| **100** | NOT_SUPPORTED_ON_PLATFORM | API is not supported on the current platform.|
-| **500** | INTERNAL_ERROR | Internal error is encountered while launching People Picker.|
+| **500** | INTERNAL_ERROR | Internal error encountered while launching People Picker.|
| **4000** | INVALID_ARGUMENTS | API is invoked with wrong or insufficient mandatory arguments.| | **8000** | USER_ABORT |User cancelled the operation.|
-| **9000** | OLD_PLATFORM | User is on old platform build where implementation of the API is not present. Upgrading the build resolves the issue.|
+| **9000** | OLD_PLATFORM | User is on an old platform build where implementation of the API is unavailable. Upgrade to the latest version of the build to resolve the issue.|
## See also
platform Developer Tools https://github.com/MicrosoftDocs/msteams-docs/commits/main/msteams-platform/tabs/how-to/developer-tools.md
While the web version and the desktop version of Teams are almost the same, ther
1. Ensure you have enabled [developer preview](~/resources/dev-preview/developer-preview-intro.md). 1. Open up a tab so you have something to inspect with the DevTools. 1. Open the DevTools one of the following ways:
- * On Windows, you open DevTools via the Microsoft Teams icon in the desktop tray:<br>
- ![Right-click to open DevTools](~/assets/images/dev-preview/devtools-right-click.png)
- * On MacOS, click on the Microsoft Teams icon in the Dock.
+ * On Windows, you open DevTools via the Microsoft Teams icon in the desktop tray.
+
+ :::image type="content" source="../../assets/images/dev-preview/devtools-right-click.png" alt-text="developer-tool-windows":::
+
+ * On MacOS, select the Microsoft Teams icon in the Dock.
+
+ :::image type="content" source="../../assets/images/dev-preview/mac-os-developer-tools.PNG" alt-text="mac-os-dev-tools":::
The following example shows DevTools open and inspecting a tab configuration dialog:
platform Whats New https://github.com/MicrosoftDocs/msteams-docs/commits/main/msteams-platform/whats-new.md
Discover Microsoft Teams platform features that are generally available (GA) and
| Date | Update | Find here | | | | |
+|03/29/2022 | Integrate People Picker | Integrate with Teams > [Integrate People Picker](concepts/device-capabilities/people-picker-capability.md)|
|03/23/2022| Introduced step-by-step guide to unfurl links in Teams using bot | Build messaging extensions > Add link unfurling > [Unfurl links in Teams using bot](sbs-botbuilder-linkunfurling.yml)|
+|03/22/2022| Updated the Get started with Blazor app for Teams | ΓÇó Get started > [Build your first app using Blazor](sbs-gs-blazorapp.yml)|
|03/22/2022| Updated the Get started with Blazor app for Teams | Get started > [Build your first app using Blazor](sbs-gs-blazorapp.yml)| |03/22/2022| Added information on debug process| ΓÇó Tools and SDKs> Teams Toolkit for Visual Studio Code > [Debug your Teams app locally](toolkit/debug-local.md) </br> ΓÇó Tools and SDKs> Teams Toolkit for Visual Studio Code > [Debug background process](toolkit/debug-background-process.md)| |03/14/2022| Introduced step-by-step guide to build and test a connector in Microsoft Teams | Build webhooks and connectors > Create Office 365 Connectors > [Build Teams connectors](sbs-teams-connectors.yml)| |03/10/2022| Added information on Moodle LMS and Microsoft 365 plugins | Integrate with Teams > Moodle LMS > [Moodle learning management system](resources/moodle-overview.md)| |03/03/2022 | How to add authentication using external OAuth provider| Add authentication > Tabs > [Use external OAuth providers](tabs/how-to/authentication/auth-oauth-provider.md) |
-|02/25/2022| Introduced step-by-step guide to invoke task modules in Teams| Build cards and task modules > Build task modules > Use task modules from bots > [Invoke task module from Teams](sbs-botbuilder-taskmodule.yml)|
-|02/24/2022| Introduced step-by-step guide to build action based messaging extension | Build Messaging Extensions > Action commands > Define action commands > [Build action based messaging extension](sbs-meetingextension-action.yml)|
-|02/24/2022| Introduced step-by-step guide to build search based messaging extension | Build messaging extensions > Search commands > Define search commands > [Build search based messaging extension](sbs-messagingextension-searchcommand.yml)|
-|02/24/2022| Introduced step-by-step guide to create Outgoing Webhooks | Build webhooks and connectors > Create Outgoing Webhooks > [Create Outgoing Webhooks](sbs-outgoing-webhooks.yml)|
-| 02/23/2022 |Microsoft Teams store ranking parameters| Distribute your app > Publish to the Teams store > [Microsoft Teams store ranking parameters](concepts/deploy-and-publish/appsource/post-publish/teams-store-ranking-parameters.md)|
-| 02/18/2022 | Introduced extensive Glossary for the Microsoft Teams Developer Documentation to help you find the definition about a term quickly | [Glossary](~/get-started/glossary.md) |
-| 02/18/2022 | Updated the Overview module for mapping Teams app to organizational goals, user story, and exploring Teams app features | [Overview > Teams app that fits](overview.md) |
-| 02/18/2022 | Updated the App fundamentals module to Plan your app to include mapping use cases to Teams features, and app planning checklist | [Plan your app > Overview](~/concepts/app-fundamentals-overview.md) |
-|02/17/2022| What to expect after you submit your app?| Distribute your app > Publish to the Teams store > [Overview](concepts/deploy-and-publish/appsource/publish.md)|
-|02/15/2022| Introduced step-by-step guide how to upload files to Teams from a bot | Build bots > Send and receive files > [Step-by-step guide how to upload files to Teams from a bot](sbs-file-handling-in-bot.yml) |
-|02/11/2022| Shared meeting stage| ΓÇó Build apps for Teams meetings > [Shared meeting stage](apps-in-teams-meetings/enable-and-configure-your-app-for-teams-meetings.md#shared-meeting-stage) </br> ΓÇó Build apps for Teams meetings > [Meeting apps API references](apps-in-teams-meetings/API-references.md) </br> ΓÇó App manifest > Public developer preview > [Developer preview manifest schema](resources/schem)|
-|02/08/2022| Introduced step-by-step guide to create Calling and Meeting bot| Build bots > Calls and meetings bots > Register calls and meetings bot > [Step-by-step guide to create Calling and Meeting bot](sbs-calling-and-meeting.yml) |
-|02/07/2022| Tools and SDKs |Teams Toolkit for Visual Studio Code > </br> ΓÇó Add capabilities to Teams app> [Add capabilities to your Teams apps](toolkit/add-capability.md) </br> ΓÇó Add cloud resources to Teams app> [Add cloud resources to your Teams app](toolkit/add-resource.md) |
-|02/03/2022| Introduced app manifest version 1.12 | ΓÇó App manifest > [App manifest schema](resources/schem) |
- ## GA features
Microsoft Teams platform features that are available to all app developers.
<summary><b>2022</b></summary> | **Date** | **Update** | **Find here** |
-| -- | | -|
-|03/23/2022| Introduced step-by-step guide to unfurl links in Teams using bot | Build messaging extensions > Add link unfurling > [Unfurl links in Teams using bot](sbs-botbuilder-linkunfurling.yml)|
+| -- | --| --|
+|03/29/2022 |Integrate People Picker | Integrate with Teams > [Integrate People Picker](concepts/device-capabilities/people-picker-capability.md)
+|03/23/2022| Introduced step-by-step guide to unfurl links in Teams using bot | Build messaging extensions > Add link unfurling > [Unfurl links in Teams using bot](sbs-botbuilder-linkunfurling.yml)|
+|03/22/2022| Updated the Get started with Blazor app for Teams| ΓÇó Get started > [Build your first app using Blazor](sbs-gs-blazorapp.yml)|
|03/22/2022| Updated the Get started with Blazor app for Teams| Get started > [Build your first app using Blazor](sbs-gs-blazorapp.yml)| |03/22/2022| Added information on debug process| ΓÇó Tools and SDKs> Teams Toolkit for Visual Studio Code > [Debug your Teams app locally](toolkit/debug-local.md) </br> ΓÇó Tools and SDKs> Teams Toolkit for Visual Studio Code > [Debug background process](toolkit/debug-background-process.md)| |03/14/2022| Introduced step-by-step guide to build and test a connector in Microsoft Teams | Build webhooks and connectors > Create Office 365 Connectors > [Build Teams connectors](sbs-teams-connectors.yml)|