#DevHack: Dismiss messaging extension dialog in MS Teams

Currently, I am developing my first “real” Microsoft Teams app with SharePoint Framework. In this app, I am making use of the new messaging extension capability.

{{< blockquote type="info" text="what are messaging extensions?

While developing a form in my extension, I wanted to cancel and submit a button. When I started implementing the cancel button, its onClick event, I was lost in how to close the dialog.

While going through the documentation, I found that you can do this by calling microsoftTeams.tasks.submitTask(). It was a bit hidden away on this page: task modules.

In your SharePoint Framework code, it looks as follows:

1
if (this.context.sdks.microsoftTeams) {
2
  // Close the current dialog
3
  this.context.sdks.microsoftTeams.teamsJs.tasks.submitTask();
4
}

Happy MS Teams development