ionic-team / ionic-team/ionic-framework

bug: ActionSheet button handlers do not execute in user-gesture, blocking Web APIs (share, clipboard, etc)

Aperta
#21,607 7 commenti 0 reazioni 0 assegnatari Vedi su GitHub
package: core type: bug
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

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.