{"id":22172,"date":"2024-10-23T15:52:13","date_gmt":"2024-10-23T22:52:13","guid":{"rendered":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/?p=22172"},"modified":"2024-11-12T10:20:05","modified_gmt":"2024-11-12T18:20:05","slug":"specify-runtime-requirements-in-app-manifest-your-key-to-success-across-microsoft-365","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/specify-runtime-requirements-in-app-manifest-your-key-to-success-across-microsoft-365\/","title":{"rendered":"Specify runtime requirements in app manifest: Your key to success across Microsoft 365"},"content":{"rendered":"<p>Through extensive user research, we&#8217;ve identified what Microsoft 365 users value most for boosting productivity. They want uninterrupted workflows, an all-in-one workspace, and minimal context switching. With this insight, we evolved Microsoft 365 into a unified platform across Microsoft Teams, Outlook, Microsoft 365 app (formerly Office.com), and more. For you as a developer, this means broader user reach without needing to rewrite code for each host. For IT admins, it\u2019s about centralized app management. That&#8217;s why with manifest version v1.13+, apps will now <a href=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/build-once-deploy-efficiently-connect-across-microsoft-365\/\">automatically appear across multiple Microsoft 365 hosts<\/a>, making development smoother and more impactful.<\/p>\n<p><figure id=\"attachment_23261\" aria-labelledby=\"figcaption_attachment_23261\" class=\"wp-caption aligncenter\" ><a href=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/BuildOnce.jpg\"><img decoding=\"async\" class=\"wp-image-23261 size-full\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/BuildOnce.jpg\" alt=\"Image BuildOnce\" width=\"952\" height=\"533\" srcset=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/BuildOnce.jpg 952w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/BuildOnce-300x168.jpg 300w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/BuildOnce-768x430.jpg 768w\" sizes=\"(max-width: 952px) 100vw, 952px\" \/><\/a><figcaption id=\"figcaption_attachment_23261\" class=\"wp-caption-text\"><em>With the manifest version 1.13+ your app works across Microsoft 365<\/em><\/figcaption><\/figure><\/p>\n<p>Here&#8217;s an example of how this new app experience would work: Picture two users, Kat and Daniela, working on a project in a collaborative design app called Relecloud. They kick things off during a Teams meeting, using Relecloud\u2019s <a href=\"https:\/\/learn.microsoft.com\/en-us\/microsoftteams\/platform\/apps-in-teams-meetings\/build-tabs-for-meeting?tabs=desktop%2Cmeeting-chat-view-desktop%2Cmeeting-side-panel%2Cmeeting-stage-view-desktop%2Cchannel-meeting-desktop\"><strong>configurable tab<\/strong><\/a> app capability. After the meeting, they keep the conversation going asynchronously via email in Outlook. Whenever they need to make changes to the project, they can simply open Relecloud\u2019s <a href=\"https:\/\/learn.microsoft.com\/en-us\/microsoftteams\/platform\/m365-apps\/extend-m365-teams-personal-tab?tabs=manifest-teams-toolkit\"><strong>static tab<\/strong><\/a> directly within Outlook. Finally, when Kat feels the project is ready, she leaves a comment in Relecloud, and the app\u2019s <a href=\"https:\/\/learn.microsoft.com\/en-us\/microsoftteams\/platform\/bots\/what-are-bots\"><strong>bot<\/strong><\/a> automatically notifies Daniela in Teams.<\/p>\n<p>This new app experience requires a shift in how developers think. Instead of building for individual hosts, developers now create for the unified Microsoft 365 platform\u2014using modular app elements like static tabs, message extensions, configurable tab and bots. These elements adapt across hosts, delivering a seamless, consistent experience for users.<\/p>\n<p>To streamline building apps for Microsoft 365, we are improving developer documents, tooling and automated testing to facilitate the mindset shift from specific products to platform. At the core of this evolution is the new ability to <strong>specify runtime requirements in your app manifest<\/strong>\u2014a key feature that optimizes functionality across hosts.<\/p>\n<h2>Feature overview<\/h2>\n<p>So how does it work? The ability to specify runtime requirements in your manifest enables you to build apps that only show the relevant components supported by the host. Here&#8217;s a sneak peek of how this feature can enhance your app\u2019s versatility:<\/p>\n<ul>\n<li><strong>Functionality Support<\/strong>: Maintain the unified app package for Microsoft 365 platform and only show the app capabilities whose functionalities are fully supported by Microsoft 365 suites including Teams, Outlook, Microsoft 365 app and Copilot. For instance, a static tab that relies on HTML-based dialogs will only be available on hosts that support this functionality.<\/li>\n<li><strong>Element Dependencies<\/strong>: Ensure dependencies between different parts of your app are respected, in order to deliver the full user scenario. For example, imagine you&#8217;re building an app with a <strong>static tab<\/strong> that depends on a <strong>message extension<\/strong>. Being able to specify these requirements in manifest allows you to ensure that the static tab will only appear if the message extension is supported on the host.<\/li>\n<\/ul>\n<p><em>\u201cThis new ability to specify runtime requirements in app manifest will allow us to seamlessly expand our app from Teams to Outlook, Microsoft 365 app and beyond, without sacrificing any functionality or user experience.\u201d<\/em> \u2013 <em>Microsoft 365 Copilot for Sales<\/em>, <em>early preview user<\/em>.<\/p>\n<p>With this new ability, you&#8217;re not just future-proofing your app\u2014you\u2019re ensuring it\u2019s optimized for each and every user interaction, no matter which host they\u2019re in. This type of intelligent control improves user experience and reduces unnecessary debugging or host-specific issues.<\/p>\n<h2>Dive into the feature highlights<\/h2>\n<p>Now, let\u2019s explore some of the key components of this new feature, designed to provide greater flexibility and ease of development:<\/p>\n<ol>\n<li><strong>hostMustSupportFunctionalities Property<\/strong><\/li>\n<\/ol>\n<p><div style=\"width: 640px;\" class=\"wp-video\"><video class=\"wp-video-shortcode\" id=\"video-22172-1\" width=\"640\" height=\"360\" preload=\"metadata\" controls=\"controls\"><source type=\"video\/mp4\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/demo-hostsupport.mp4?_=1\" \/><a href=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/demo-hostsupport.mp4\">https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/demo-hostsupport.mp4<\/a><\/video><\/div><\/p>\n<p>&nbsp;<\/p>\n<p>This property enables developers to specify the capabilities their app elements rely on. For example, if a static tab requires a specific TeamsJS capability to function, you can ensure that the tab won\u2019t appear on a host where that capability isn\u2019t available.<\/p>\n<p><img decoding=\"async\" width=\"448\" height=\"308\" class=\"wp-image-23216\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/a-computer-screen-shot-of-a-computer-code-descript-1.png\" alt=\"A computer screen shot of a computer code Description automatically generated\" srcset=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/a-computer-screen-shot-of-a-computer-code-descript-1.png 448w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/a-computer-screen-shot-of-a-computer-code-descript-1-300x206.png 300w\" sizes=\"(max-width: 448px) 100vw, 448px\" \/><\/p>\n<ol>\n<li><strong>elementRelationshipSet Property<\/strong><\/li>\n<\/ol>\n<p>Sometimes, your app\u2019s elements depend on each other to create a cohesive experience. The elementRelationshipSet property allows you to define dependencies between these elements, ensuring that they either all appear together or not at all\u2014avoiding fragmented user experiences.<\/p>\n<ul>\n<li style=\"list-style-type: none;\">\n<ul>\n<li><strong>oneWayDependencies<\/strong>: Ideal when one element relies on another. For instance, a static tab that serves as a settings page for a message extension will only show up when both are supported on the host.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p><div style=\"width: 640px;\" class=\"wp-video\"><video class=\"wp-video-shortcode\" id=\"video-22172-2\" width=\"640\" height=\"360\" preload=\"metadata\" controls=\"controls\"><source type=\"video\/mp4\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/rtblog-oneway-demo-small.mp4?_=2\" \/><a href=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/rtblog-oneway-demo-small.mp4\">https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/rtblog-oneway-demo-small.mp4<\/a><\/video><\/div><\/p>\n<p>&nbsp;<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/OneWay.png\"><img decoding=\"async\" class=\"alignnone size-full wp-image-23248\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/OneWay.png\" alt=\"Image OneWay\" width=\"624\" height=\"289\" srcset=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/OneWay.png 624w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/OneWay-300x139.png 300w\" sizes=\"(max-width: 624px) 100vw, 624px\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<ul>\n<li style=\"list-style-type: none;\">\n<ul>\n<li><strong>mutualDependencies<\/strong>: When multiple elements depend on one another, this new property ensures that if one element isn\u2019t supported, none of them will appear.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p><div style=\"width: 640px;\" class=\"wp-video\"><video class=\"wp-video-shortcode\" id=\"video-22172-3\" width=\"640\" height=\"360\" preload=\"metadata\" controls=\"controls\"><source type=\"video\/mp4\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/rt-mutualdepend-demo.mp4?_=3\" \/><a href=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/rt-mutualdepend-demo.mp4\">https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/rt-mutualdepend-demo.mp4<\/a><\/video><\/div><\/p>\n<p>&nbsp;<\/p>\n<p><img decoding=\"async\" width=\"786\" height=\"482\" class=\"wp-image-23220\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/a-screen-shot-of-a-computer-screen-description-aut-1.png\" alt=\"A screen shot of a computer screen Description automatically generated\" srcset=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/a-screen-shot-of-a-computer-screen-description-aut-1.png 786w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/a-screen-shot-of-a-computer-screen-description-aut-1-300x184.png 300w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/10\/a-screen-shot-of-a-computer-screen-description-aut-1-768x471.png 768w\" sizes=\"(max-width: 786px) 100vw, 786px\" \/><\/p>\n<h2><strong>Start building today<\/strong><\/h2>\n<p>The best part? You can start leveraging this new ability <strong>today<\/strong>! The ability to specify runtime requirements is now available in the devPreview manifest schema for public preview. By adding those properties to your app, you&#8217;re setting yourself up for success, ensuring a seamless experience for your users, no matter where they engage with your app. It brings you the future of productivity apps\u2014where flexibility meets functionality, and your app thrives on the unified Microsoft 365 platform. Ready to dive in?<\/p>\n<ul>\n<li><strong>Step-by-Step Implementation<\/strong>: Integrate this feature into your app using our detailed dev <a href=\"https:\/\/learn.microsoft.com\/en-us\/microsoftteams\/platform\/m365-apps\/specify-runtime-requirements\">documentation<\/a>. Start by adding the hostMustSupportFunctionalities and elementRelationshipSet properties to your manifest.<\/li>\n<li><strong>Interested in sharing your feedback?<\/strong> We\u2019re eager to hear from you! Your feedback is invaluable to us as we continue to fine-tune and enhance this feature.\u00a0Fill out this <a href=\"https:\/\/forms.office.com\/r\/gCF2L3jKxb\">form<\/a> to leave your contact information and we&#8217;ll reach out to collect feedback on how this new feature is working for you.<\/li>\n<\/ul>\n<p>Take the leap and start developing apps that are smarter, more adaptable, and ready for the cross-host future of Microsoft 365. The platform is evolving, and with it, so are the possibilities for your apps. Let\u2019s build together!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>To streamline building apps for Microsoft 365, we are rolling out the ability to specify runtime requirements in your app manifest\u2014a key feature that optimizes functionality across hosts.<\/p>\n","protected":false},"author":165128,"featured_media":23407,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[1,128],"tags":[375,225,376],"class_list":["post-22172","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-microsoft-365-developer","category-microsoft-teams","tag-app-manifest","tag-microsoft-365","tag-runtime-requirements"],"acf":[],"blog_post_summary":"<p>To streamline building apps for Microsoft 365, we are rolling out the ability to specify runtime requirements in your app manifest\u2014a key feature that optimizes functionality across hosts.<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/posts\/22172","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/users\/165128"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/comments?post=22172"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/posts\/22172\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/media\/23407"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/media?parent=22172"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/categories?post=22172"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/tags?post=22172"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}