node.jspuppeteer

Extracting link from navigator.share dialog using Puppeteer in an Angular website


I am working on a website that contains multiple cards, each featuring a button that triggers navigator.share, opening a dialog with a link inside. I need to extract that link using Puppeteer for nodejs, but I am unable to share the website’s link, as it is not my property. The website is built with Angular, and I am struggling to identify the call that opens the sharing dialog. Is there a way to achieve this?

Update

I understand the difficulty of my request. Unfortunately, it's a relatively complex site, and to reproduce a working version, I wouldn't even know what to do. I'm attaching a file that might be able to handle navigator.share.

File link

UPDATE

This is the butto to raise the event:

<a _ngcontent-chr-c5="" class="btn btn-whatsapp w-100 ng-star-inserted">
        <i _ngcontent-chr-c5="" class="fas fa-share"></i>&nbsp;SHARE LINK
      </a>

Solution

  • Puppeteer offers no function that waits for a sharing dialog to appear.

    But this Node.js program illustrates how puppeteer can intercept the first request that loads the website and inject Javascript which redefines navigator.share so that it writes its argument into a global variable interceptedShare. Puppeteer then waits for this global variable to appear and logs it in the console.

    const browser = await puppeteer.launch({
      headless: "new"
    });
    const page = await browser.newPage();
    await page.setRequestInterception(true);
    page.on("request", async function (request) {
      if (request.url() === URL) {
        const response = await fetch(request.url());
        request.respond({
          status: response.status,
          body: (await response.text()).replace(
              "<html>",
              `<html><script>
    navigator.share = function(options) {
      window.interceptedShare = options;
    };
    </script>`
          )
        });
      } else request.continue();
    });
    await page.goto(URL, {
      waitUntil: "networkidle2"
    });
    page
      .waitForFunction(function () {
        return window.interceptedShare;
      })
      .then((_) => _.jsonValue())
      .then(console.log);
    /* Interact with the page */
    await page.click("body");
    

    I tested this with the following page

    <!doctype html>
    <html>
      <body onclick='navigator.share({url: "http://secret.url"})'>
        Click to share a URL
      </body>
    </html>
    

    where sharing happens after a click. Your case may of course require a different interaction.