ionic-team / ionic-team/ionic-framework
bug: ActionSheet button handlers do not execute in user-gesture, blocking Web APIs (share, clipboard, etc)
- Lingua principale
- TypeScript
- Stelle
- 52.7k
- Fork
- 13.3k
- Merge medio
- 1g 15h
- PR unite (30g)
- 51
Descrizione
# Bug Report
**Ionic version:**
[ ] **4.x**
[x] **5.x**
**Current behavior:**
Button handlers in ActionSheets do not allow user-gestures to successfully invoke Share, Clipboard or other Web APIs in PWA mode on iOS/Safari.
The browser does not appear to think that the event occurred because of a user gesture, and results in: `NotAllowedError: The request is not allowed by the user agent or the platform in the current context, possibly because the user denied permission.`
**Expected behavior:**
The handler should execute in the same promise chain as the user gesture, so that native APIs and browser functionality can be used. Safari is apparently more strict about this.
**Steps to reproduce:**
Use the following code in an ActionSheet handler in an installed PWA on iOS:
```
return navigator.share({
text: 'How to implement the Web Share API and a fallback',
url: 'https://www.apple.com'
});
```
The same code works fine when executed directly from a button click in the page template, or other source.
**Related code:**
```
const actionSheet = await this.actionCtrl.create({
buttons: [{
text: 'Share',
icon: 'share',
handler: () => {
return navigator.share({
text: 'How to implement the Web Share API and a fallback',
url: 'https://www.apple.com'
});
}
}]
});
await actionSheet.present();
```
(Any chance we could get an updated stackblitz template for ionic 5? The above is for Ionic 4 :) )
```
insert short code snippets here
```
**Other information:**
Tested on several iOS devices/versions. All tested behaved the same way.
**Ionic info:**
```
sharktop:topdecked-unified lincoln$ ionic info
Ionic:
Ionic CLI : 6.9.2 (/usr/local/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/angular 5.2.2
@angular-devkit/build-angular : 0.1000.0-rc.5
@angular-devkit/schematics : 10.0.0-rc.5
@angular/cli : 10.0.0-rc.5
@ionic/angular-toolkit : 2.2.0
Cordova:
Cordova CLI : 8.1.2 (cordova-lib@8.1.1)
Cordova Platforms : not available
Cordova Plugins : not available
Utility:
cordova-res : not installed
native-run : not installed
System:
Android SDK Tools : 26.1.1 (/Users/lincoln/Library/Android/sdk)
NodeJS : v12.13.0 (/usr/local/lib/node_modules/node/bin/node)
npm : 6.14.4
OS : macOS Catalina
Xcode : Xcode 11.5 Build version 11E608c
```
Guida per i contributori
Apri la guida per i contributori
Direzione di ricerca
Start at the ActionSheet button-handler entry point and reproduce the navigator.share example in an installed iOS PWA. Trace how the handler is invoked relative to the original user gesture, then verify completion with the reported Share or Clipboard Web API scenario without breaking normal ActionSheet handlers.
Scritto dal modello di indicizzazione a partire dal testo della issue.
Valutazione
- Stack tecnologico
- typescript
- Ambito
- frontend, mobile-dev
- Tipo di issue
- Bug
- Difficoltà
- 4/5
- Tempo stimato
- 3-5 giorni
- Stato di attività
- Ferma
- Chiarezza
- Abbastanza chiara
- Idoneità per principianti
- 35/100