Javascript Puppeteer Error: Node is either not clickable or not an HTMLElement

Question

If I try to click an element like this I get an error:

const handle = await page.$('.days-label.col-md-12.desktop div:nth-child(1)');
await handle.click();

However if I click it like this it works:

await page.$eval('.days-label.col-md-12.desktop div:nth-child(1)', el => el.click()); 

I tried fixing it by waiting for selector and navigation, but it's still the same error:

await page.waitForSelector('.days-label.col-md-12.desktop div:nth-child(1)');
const handle = await page.$('.days-label.col-md-12.desktop div:nth-child(1)');
await Promise.all([
    page.waitForNavigation(),
    handle.click(),
]);

Answer 1

waitForSelector() returns <Promise<?ElementHandle>>:

const handle = await page.waitForSelector(
  '.days-label.col-md-12.desktop div:nth-child(1)'
)
await Promise.all([
    page.waitForNavigation(),
    handle.click(),
])

Answer 2

To fire a "true" js click event, use this..

handle.evaluate((h)=>{h.click()})

.. instead of ..

handle.click()

..wghich launches 'pupeteer's click' so to speak, which performers several actions to, probably, simulate user behavior, but seems less reliable.