ionic-team / ionic-team/ionic-framework

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

オープン
#21,607 コメント 7 件 リアクション 0 件 担当者 0 名 GitHub で見る
package: core type: bug
主要言語
TypeScript
スター
52.7k
フォーク
13.3k
平均マージ
1日 15時間
マージ済み PR(30日)
51

説明

# 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

```

コントリビューションガイド

コントリビューションガイドを開く

評価

この issue はまだ評価されていません。

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。