Skip to main content

Now natively open files with Google Chrome, Microsoft Edge PWAs on Windows 10

Google Chrome web apps can soon express their ability to read and edit files from Windows 10’s native file system. Therefore, in addition to native apps, users can choose to open and edit certain file types with progressive web apps (PWAs) installed on Windows 10 computers. This has been made possible with the help of an upcoming feature called File Handling, Techtsp has learned.

Now, similar to native apps, Google specifically wants web apps to declare their ability to handle files with given MIME file types and extensions. This way, Google says it wants to increase transparency between web apps and native apps by providing users with a more consistent user experience across both.

“The goal for this project is to implement an API that will allow Chrome progressive web apps (PWAs) to 'handle' (read) files in the host OS's file system, in much the same way as a native app would,” said Google engineer Darwin Huang in a design document seen by Techtsp. “This dovetails with the larger objective of increasing transparency between web apps and native apps, enabling a more consistent user experience across both per the Progressive Web App (PWA) paradigm”

Thanks to this feature, a native file handler on Windows 10 will represent a web application’s ability to handle a file with one of a given set of MIME types and/or file extensions. An image editor, for example, will support displaying several distinct image formats. It should be possible to open files in one of these file types from within the file browser on Windows 10.

Initially, this feature will be experiemented under Origin Trials in the upcoming versions of Google Chrome. It will be compatible with all desktop platforms including Windows, ChromeOS, macOS, and Linux.

File Handling in Google Chrome: How it works

An installed web application can open a file using a PWA by selecting the PWA in the Windows 10 file manager’s “Open With” menu, or by simply double-clicking if the PWA is the default/only opener for the file type.

Techtsp has also obtained some early UX mockups of write permissions in web applications.

To ensure user safety and privacy when file handling is used to open a file, a permission prompt will be shown before a PWA can view a file. This permission prompt will be shown right after:

  1. The user selects the PWA to open a file so that the permission is tightly coupled to the action of opening a file using the PWA, making it more understandable and relevant.
  2. The site loads without the file, so that the user has an expectation of what the PWA is and why it would like to view the file.

This permission will show every time until the user either clicks to “Allow” or “Block” file handling for the site, after which the user-selected setting will persist across the PWA closing and reopening.

In the past, we have seen Google allowing developers to build websites or progressive web apps that can interact with native apps via the device’s file system. This upcoming feature can be considered an extension of the File System Access (formerly Native File System) API that allows web applications to read or save changes to offline files.

Another related permission that interacts with file handling is the File System Access, which can ask for write permission in a separate prompt if the site would later like to write to the file opened via file handling. A prompt will show up every time for write permission, regardless of the file handling permission status.

Progressive web apps to replace Chrome bookmark apps

This File Handling feature is essentially part of Google’s larger focus to move desktop PWAs out of Chrome extensions, and into operating systems, the search giant has confirmed in the same design document seen by Techtsp.

Initially, Google implemented both PWAs and Shortcuts (to launch a website in a Chrome tab) on top of the Extensions stack. This way, Google leveraged the existing Extensions infrastructure to ensure web shortcuts (also called Bookmark Apps) can be installed, launched, updated, and synced across all the desktop devices.

As time has passed, Google says it has realized the need to separate Bookmark Apps and Extensions due to a lack of clarity around code ownership and technical debt, among other issues.

For now, the APIs for Bookmark Apps exist in parallel with new progressive web apps. However, Google has confirmed its plans to transition from Bookmark Apps installed through Chrome Web Store to Progressive Web Apps that can be installed directly from Chrome’s address bar.

Putting Google Chrome’s File Handling via PWA to test

File Handling support in Google Chrome is currently limited to developer trial behind chrome://flags. Here’s how you can enable the File System API feature flag in Chrome:

  1. Make sure your Google Chrome is up-to-date
  2. Open chrome://flags
  3. Locate File Handling API
  4. Set to Enable using the drop-down menu
  5. Relaunch Chrome

Afterward, we installed a demo web app that works File Handling API with support for the following file types:

  • text/plain (MIME)
  • .txt (Extension)
  • .csv (Extension)
  • .md (Extension)

As for the demonstration purpose, we created .TXT notepad file and we could see an option in the right-click menu to open files with ‘File Handling Demo’ (sample web application installed through Google Chrome). We were also able to view and make changes to this .TXT notepad file stored offline directly in the web application using Windows 10’s native file manager.

Apparently, Windows 10’s default apps settings still provide users with the ability to choose a web application as a default app for a specific file type. However, this could change in the future. Although we did not specifically try this on Edge, we see no reason why it shouldn't work since the File Handling API is also supported behind the Edge feature flag.

Also Read

Microsoft Edge PWAs will soon be visually indistinguishable from native apps

Google Chrome users can soon mute mic, turn off camera, end video calls with picture-in-picture