Selecting an href element in Puppeteer JS gives invalid error is not a valid selector

I have the following element:

<a href="javascript:void(0)" class="compareItemsExpand" data-id="5338408">text this link</a>

this appears multiple times on the page and I get it like this:

    const hrefs = await page.$$eval(
    ".title a",
    els => els.map(el => el.href)
    );

I then loop over the elements like so:

   for (const href of hrefs) {
            await page.click(href);
    }

// href = 'javascript:void(0)';
This gives me the error:

DOMException: Failed to execute 'querySelectorAll' on 'Document': 'javascript:void(0)' is not a valid selector.

This is because you are actually trying to click javascript:void(0) which is indeed not the right selector here.

The correct solution would be to get element handles, and then looping over them,

const elementHandles = await page.$$(".title a");

for (const elementHandle of elementHandles) {
  await elementHandle.click();
}