Using Puppeteer to get a handle to the new page after "_blank" click?

Question

Looking at this simple code :

const browser = await puppeteer.launch({headless: false});
const page: Page = await browser.newPage();
await page.evaluate((a) =>
                        {

                             //This will  open a new page :  
                            ([...document.querySelectorAll("a")][0] as HTMLElement).click();
                        });

If the clicked A(anchor) element has target="_blank" , then the page would be opened as a new page.

It's not the original page object.

Question:

How can I get the new page object after a user has clicked on <a target="_blank" ?

Did you check [this ticket](https://stackoverflow.com/questions/45806684/puppeteer-how-to-handle-multiple-tabs)? — Andersson, Nov 19 '18 at 12:30
@Andersson Thanks for response. Before I delete it as a dup , I didn't see in the answers there , How can I get a handle to the new page that was opened ( without scanning pages[]) — Royi Namir, Nov 19 '18 at 12:37
Unfortunately I don't know another way to identify last opened tab except handling list of tabs... — Andersson, Nov 19 '18 at 12:47
You could probably save yourself a headache by using fetch() instead of clicking those if you're only after the page contents. — pguardiario, Nov 19 '18 at 22:52

score 2 · Accepted Answer · answered Nov 20 '18 at 02:42

This can be done like this:

const [newTarget] = await Promise.all([
  // Await new target to be created with the proper opener
  new Promise(x => browser.on('targetcreated', target => {
    if (target.opener() !== page.target())
      return;
    browser.removeListener('targetcreated', arguments.callee);
    x();
  })),
  page.click('link'),
])
// Attach to the newly opened page.
const newPage = await newTarget.page();

Using Puppeteer to get a handle to the new page after "_blank" click?

1 Answers1

Linked