docs/pwa-features/web-share.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />

    <title>Web Share Demo</title>
  </head>
  <body>
    <h1>
      Web Share API
    </h1>

    <p>
      More details can be found in the
      <a
        href="https://docs.microsoft.com/en-us/microsoft-edge/devtools-guide-chromium/open/?tabs=cmd-Windows"
        >browsers devtools console</a
      >
    </p>

    <button onclick="shareText()">
      Share Text / URLs
    </button>

    <button onclick="shareFile()">
      Share a File
    </button>

    <script>
      async function shareText() {
        if (navigator.share) {
          try {
            await navigator.share({
              title: 'Sharing!',
              text: 'Check this out',
              url: 'https://www.pwabuilder.com',
            });
          }
          catch (err) {
            console.log('Error sharing', error);
          }
        }
      }

      async function shareFile() {
        const test_file = new File(["some text..."], "filename.txt", {type: "text/plain"});
        
        if (navigator.canShare && navigator.canShare({ files: [test_file] })) {
          try {
            await navigator.share({
              files: [test_file],
              title: 'Sharing a File',
              text: 'Just sharing a file (:',
            })
          }
          catch (err) {
            console.log('Error sharing', error);
          }
        } else {
          console.log(`Your system doesn't support sharing files.`);
        }
      }
    </script>
  </body>
</html>