I am currently facing an issue while implementing Web Share API (Level 2) in Vue 3 using it to share/download images on iOS 14 (as experimental feature) and iOS 15 in a Progressive Web App context.
Observation: When the application is running directly in the Browser (not in the PWA Context - which is a local PWA accesible through the homescreen Bookmark on iOS), it also works as expected without any errors.
Installed as a PWA, however, sharing works as expected THE FIRST time, but AFTER saving the image, it refuses to trigger the native sharing mecanism with the error message (note it ALWAYS works once):
Unhandled Promise Rejection: NotAllowedError: The request is not allowed by the user agent or the platform in the current context, possibly because the user denied permission.
The navigator.share is triggered directly by a click event, the resource is also loaded in advance and sharing.
It seems to work fine on Android Devices as expected but on IOS
This seems to be (again) a regression of an old WebKit bug. In the past, this was repeatedly reported, for example as WebKit bug #216913 or WebKit bug #218156.
Please report this to the WebKit team, providing the exact iOS and Safari version you encountered this on. Feel free to use this demo app that I have prepared, it's an installable PWA and showcases the Web Share API.