Training
Learning path
Use advance techniques in canvas apps to perform custom updates and optimization - Training
Use advance techniques in canvas apps to perform custom updates and optimization
What's New in PWAs
The following are the updates to Progressive Web Apps (PWAs) and Web Apps, from the Microsoft Edge Web Apps team. To try new features, read these announcements. To stay up to date with the latest and greatest features, download the Microsoft Edge preview channels (Beta, Dev, and Canary).
Sections of this document correspond to historical releases of Microsoft Edge, and are not updated over time. For example, references below to "new features" or "origin trials" might become outdated as new versions of Microsoft Edge are released.
Starting with Microsoft Edge 121, in DevTools, you can simulate the Window Controls Overlay feature that Progressive Web Apps (PWAs) have, without having to install the PWA. See Simulate the Window Controls Overlay API without installing your PWA.
Starting with Microsoft Edge 114, you can detect when your PWA runs in the sidebar in Microsoft Edge by using User-Agent Client Hints.
To learn more, check out these resources:
- Detect usage in the sidebar, in Build a PWA for the sidebar in Microsoft Edge.
- Detecting Microsoft Edge from your website.
Starting with Microsoft Edge 112, Progressive Web Apps can experimentally opt-in to be pinned to the sidebar in Microsoft Edge.
The sidebar in Microsoft Edge allows users to easily access popular websites and utilities alongside their browser tabs. The content in the sidebar augments the user's primary task by enabling side-by-side browsing and minimizing the need to switch contexts between browser tabs.
To make your PWA ready for pinning to the sidebar in Microsoft Edge, use the edge_side_panel manifest member.
To learn more, see Build a PWA for the sidebar in Microsoft Edge.
Microsoft Edge 108 introduces experimental support for Progressive Web Apps to define their own widgets in the Widgets Board in Windows 11.
Widgets are defined in your PWA manifest file, by using the widgets manifest member. Widgets are displayed by using Adaptive Cards templates, which makes widgets easy to create, and makes them easy to adapt to various operating system widgets dashboards in the future. Microsoft Edge also makes it possible to handle user actions on PWA widgets from your service worker file.
The following screenshot shows the Windows Widgets Board on the left and the PWAmp demo app on the right. The Widgets Board contains the PWAmp mini player widget, showing the current song that's playing in the PWAmp app:
To learn more, see Display a PWA widget in the Windows Widgets Board.
Microsoft Edge 105 brings the following new features for Progressive Web Apps.
The Window Controls Overlay API is now available by default, starting with Microsoft Edge 105. Use the Window Controls Overlay API to take control of the area that would normally be used by the title bar of an installed PWA window. The PWA code can use this area to render arbitrary web content such as a custom title area, navigation buttons, or a menu bar.
This feature makes PWAs that are installed on desktop operating systems such as Windows, macOS, and Linux, more similar to their native counterparts.
See also:
- Display content in the title bar area using Window Controls Overlay.
- Closing a 30 pixel gap between native and web.
- Window Controls Overlay API on MDN.
In earlier versions, the notifications that were created by PWAs looked like they were emitted by Microsoft Edge.
With Microsoft Edge 105, notifications from a PWA now display the name and icon of the PWA instead of displaying "Microsoft Edge":
Microsoft Edge 101 introduces the sidebar search feature for PWAs. Sidebar search lets users of installed PWAs search for and browse web content in a sidebar located in the PWA window.
To access sidebar search:
Click the Open sidebar search button in the title bar of the installed PWA:
Type a search query, and then press Enter. The search results are displayed, and you can go to a web page from there:
Microsoft Edge Dev and Canary channels moved to version 100 on February 9, 2022. In this milestone, we're testing the following new web app features. We expect to see these new features rolling out to Stable following the testing period.
The sync service that powers features including Favorites, Settings, History, and more has been expanded to include your installed web apps - that is, PWAs and websites installed as apps. The sync service works when you are signed in to your profile and have opted in to syncing.
As we test and gradually release this feature over the coming weeks, users who have opted in to sync will start to see a Your available apps section in the edge://apps page, and a redesigned Apps menu.
The Your available apps section will show any apps you've installed on other devices with the same signed-in profile, that aren't currently installed in the Microsoft Edge instance you're using. The available apps will be shown in their own section with gray icons. Click the Install button on an app to install the app on that device:
App sync is available on desktop devices only, at this stage. To keep your apps in sync across devices, adding an app on one device will add it to the Your available apps section on other devices. Uninstalling an app on one device will remove it from other devices.
In Microsoft Edge, the Apps command in the Settings and more menu is being redesigned:
- The Apps menu icon can be added to the toolbar, for quick access.
- The popup menu can be pinned open as a sidebar to show your apps alongside web content.
- Customizable view and sort options have been added, along with a My available apps section to support the App Sync feature.
Users can show the Apps menu icon on the toolbar, for quick access:
Users can pin the Apps menu open as a sidebar:
Users can choose between a list or grid view:
Users can choose the sort order of their apps:
Microsoft Edge version 96 is scheduled to become the Stable release on November 18, 2021. Microsoft Edge version 97 will move from Dev to Beta preview channel following that date.
Store-installed PWAs that are participating in the URL Handlers origin trial will no longer show the Chrome Custom Tab (CCT) when redirecting from the PWA's domain to a matching domain name with a different top-level domain (TLD). This redirecting often happens in apps with locale-specific domains; for example, redirecting from contoso.com to contoso.ca for users in Canada.
The origin trial has been concluded. The URL Protocol Handlers capability is now shipping in Microsoft Edge 96 Stable.
See also:
- Protocol handlers origin trial
- Handle protocols in a PWA
- URL protocol handler registration for PWAs in Chrome Dev > Web Platform > Best Practices.
Microsoft Edge Canary reached version 96 on October 5, 2021. With a subset of our users, we're testing a new design to better manage your installed web apps. When you go to edge://apps in your browser, it now displays a redesigned hub that lists installed PWAs and websites as apps.
You can sort your apps by any of the following:
- Recently used.
- Alphabetically, based on title.
- Date of installation.
You can arrange apps in a list or grid view, by using the View as dropdown list. In this image, Grid view is selected:
To zoom: right-click > Open image in new tab.
You can easily pin apps to the taskbar or Start menu. You can create a shortcut, and enable apps to run on user login.
There's now an app details page, which provides way to easily access the following:
- Permissions and privacy details for the associated origin.
- More details about the application.
The app details page:
Microsoft Edge version 95 moved to Beta channel on September 28, 2021. The origin trials remain active for the following features:
We expect the protocol handlers origin trial to end on October 21, 2021.
Microsoft Edge version 94 moved to Stable on September 23, 2021. This release cycle was short—just 3 weeks from Microsoft Edge 93 Stable to Microsoft Edge 94 Stable, as we snapped to the new 4-week release cycle. This new release cadence matches the new cadence of Chromium milestones, described in Speeding up Chrome's release cycle.
Due to the shortened release cycle of Microsoft Edge version 94, we focused on stabilizing the release cycle logistics, and we shifted feature development to Microsoft Edge version 95.
The origin trials remain active for the following features:
We expect the protocol handlers origin trial to end with Microsoft Edge version 94 as we take final feedback and get ready to move the protocol handlers feature to Stable. In case you are enrolled in the origin trial for protocol handlers, we plan to end the trial period after Microsoft Edge version 94. We'll then determine when this feature will become Stable.
Microsoft Edge version 93 became the Stable channel of Microsoft Edge on September 2, 2021. This article lists updates we made to Progressive Web Apps (PWAs) from both a developer and consumer point of view.
Microsoft Edge now includes a referrer header with the request for the first navigation of your Microsoft Store-installed PWA.
This feature was first introduced in Microsoft Edge version 91, and we shipped a bug fix in Microsoft Edge version 93.
Learn more in Publish a PWA to the Microsoft Store.
To have more control over the title bar area that's currently displayed in standalone display mode, you may want to experiment with Window Controls Overlay. Window Controls Overlay (WCO) is a set of features that work together to provide just the essential controls needed for the app window. This layout frees up more space for the web content layer. WCO is available for installed desktop PWAs.
See Display content in the title bar area using Window Controls Overlay.
2023 update: This feature is no longer an origin trial, and is available to all users, so the following no longer applies: Register your origin for the Web App Window Controls Overlay trial at Microsoft Edge Origin Trials.
2024 update: Starting with Microsoft Edge 121, in DevTools, you can simulate the Window Controls Overlay feature for a Progressive Web App (PWA), without having to install the PWA. See Simulate the Window Controls Overlay API without installing your PWA.
Developers can now use the experimental feature Web App URL Handlers, in an origin trial. This feature allows the registration of an installed PWA to open links from other apps that refer to its scope.
2023 update: This feature is no longer an origin trial, and has been removed, so the following no longer applies, and the PWA URL Handlers feature was removed from the Chromium browser engine: Register your domain for the Web App URL Handlers trial at Microsoft Edge Origin Trials.
See also:
We have implemented support for the navigator.share API for macOS. The feature is rolling out to stable Microsoft Edge browsers on macOS over the coming weeks.
Learn more about the navigator.share() API.
Microsoft Edge version 92 became the stable channel of Microsoft Edge on July 22, 2021. This article lists updates we made to Progressive Web Apps (PWAs) from both a developer and consumer point of view.
You can now register your PWA to handle specific protocols with the host operating system. Learn more about using protocol handlers with your PWA at Handle protocols in a PWA.
2023 update: This feature is no longer an origin trial, and is available to all users, so the following no longer applies: The Windows trial for protocol handlers is now available. You can register your origin for the Web App Protocol Handler trial at Microsoft Edge Origin Trials.
When a user selects the ellipses (...) button in the app's title bar, the App info menu is displayed. We've updated the App info menu and streamlined the user experience in the following ways, to provide a user experience that's more like a desktop app than a browser UI:
Moved the app Publisher information to the top level and made it the first thing a user sees:
Moved the privacy information and controls into a dedicated 2nd-level Privacy menu:
Moved content-related tools into a dedicated 2nd-level More tools menu:
After a PWA is installed from the Microsoft Edge browser on Windows, users can now select from four options to easily launch their apps:
- Pin to taskbar
- Pin to Start
- Create Desktop shortcut
- Auto-start on device login
For convenience, this flyout dialog is shown the first time the app is launched:
This feature is being rolled out gradually to all users. In the meantime, if you'd like to use this feature, go to edge://flags and enable the flag Web Apps Post Install Dialog.
Installed sites and PWAs that were running before an unexpected shutdown will now restore (that is, they will be restarted) when the system recovers.
An unexpected shutdown can occur due to process failure, system restart, or power outage. Before this change, installed sites and PWAs had indeterminate behavior upon system restore.
Additional resources
Documentation
-
Get started with PWAs - Microsoft Edge Developer documentation
Learn to build your first Progressive Web App.
-
Progressive Web App demos - Microsoft Edge Developer documentation
Sample Progressive Web Apps that demonstrate how to use PWA features.
-
Progressive Web Apps (PWAs) documentation - Microsoft Edge Developer documentation
Develop a web app that can be installed and run on all devices, from one codebase. Provide a native-like UX, or run in the browser.