We wrote in March that Microsoft is planning to help make PWAs indistinguishable from regular apps by letting developers modify the title bar of the window, allowing them to create a title bar like below for example.

Now, writing on web.dev, Microsoft and the Chromium team have confirmed the plans, saying:

The title bar area refers to the space to the left or right of the window controls (that is, the buttons to minimize, maximize, close, etc.) and often contains the title of the application. Window Controls Overlay lets progressive web applications (PWAs) provide a more app-like feel by swapping the existing full-width title bar for a small overlay containing the window controls. This allows developers to place custom content in what was previously the browser-controlled title bar area.

Microsoft has announced an origin trial for the feature. Window Controls Overlay will be available as an origin trial starting in Chrome 92. The origin trial is expected to end in Chrome 94 (expected in July 2021).

Current mockups are not quite as fancy as the first example, but presumably better developers can do a lot more.

Developers can experiment with Window Controls Overlay locally, by enabling #enable-desktop-pwas-window-controls-overlay flag in chrome://flags.

Read more about the technology here.

Comments