Edge PWAs will soon have advanced title bars

Microsoft is going to eliminate the visual difference between the Edge PWA title bars and other applications running on Windows. Currently, such PWA have a title bar that replicated the Edge window frame. This will change in the near future. The browser will allow PWA developers to fully customize the look of the window frame.

Advertisement

Take a look at the following screenshot. Here is how the new implementation of the window frame looks for the Edge PWA .

Microsoft Edge PWA

 

Microsoft is about to make the title bar area more customizable for developers. Now it will be possible to put some extra content to that area, e,g, controls or some piece of information, a custom logo or a search box. In addition to those, the title bar will retain its classic controls like minimize, maximize, and close buttons. The user will be able to move a PWA window with such a modern title bar using the drag and drop.

There is a flag that controls this behavior. Here is how you can enable it to test this feature.

Enable advanced title bars for Edge PWAs

  1. Open Microsoft Edge.
  2. Type edge://flags/#enable-desktop-pwas-controls-overlay in the address bar and hit the Enter key.
  3. Select Enabled next to the Desktop PWA Windows Controls Overlay.
  4. Restart the browser when prompted.

This will enable the new look. Now, navigate to a website that provides Progressive Web Apps, e.g. Twitter or YouTube, and see the difference.

However, note that it will take some time before the change will be widely used in PWAs. App developers will have to update their web apps in order to use all the features provided by the new API. The project is already documented on GitHub.

Also, you can expect the something similar will eventually be available in the Chrome browser. That's because both browsers are built on top of the Chromium project, and often share their features.

Thanks to TECHTSP

Support us

Winaero greatly relies on your support. You can help the site keep bringing you interesting and useful content and software by using these options:

Leave a Reply

Your email address will not be published. Required fields are marked *