| <!DOCTYPE html> |
| <meta charset="utf-8" /> |
| <meta viewport="width=device-width, initial-scale=1.0" /> |
| <style> |
| html { |
| height: 100%; |
| margin: 0; |
| padding: 0; |
| } |
| body { |
| margin: 0; |
| padding: 0; |
| display: grid; |
| } |
| button { |
| height: 100vh; |
| width: 100%; |
| border: 1px solid black; |
| } |
| </style> |
| <body> |
| <button id="share-button">SHARE!</button> |
| <script> |
| window.addEventListener( |
| "message", |
| async (event) => { |
| const shareButton = document.getElementById("share-button"); |
| const { action } = event.data; |
| let result = null; |
| let exceptionMessage; |
| let exceptionName; |
| switch (action) { |
| case "call canShare()": |
| try { |
| result = navigator.canShare({ text: "some text" }); |
| } catch (e) { |
| exceptionMessage = e.message; |
| exceptionName = e.name; |
| } |
| break; |
| case "call share()": |
| await userActivationFromParent(shareButton, event); |
| try { |
| await navigator.share({ text: "some text" }); |
| result = "share completed"; |
| } catch (e) { |
| result = "threw"; |
| exceptionMessage = e.message; |
| exceptionName = e.name; |
| } |
| break; |
| default: |
| throw new Error(`Unknown action: ${action}`); |
| } |
| event.source.postMessage( |
| { action, result, exceptionMessage, exceptionName }, |
| event.origin |
| ); |
| }, |
| { once: true } |
| ); |
| |
| function userActivationFromParent(shareButton, event) { |
| return new Promise((resolve) => { |
| shareButton.addEventListener("click", resolve, { once: true }); |
| event.source.postMessage("activate me!", event.origin); |
| }); |
| } |
| </script> |
| </body> |
