I'm trying to use Pupeteer to respond to a popup dialog box, but can't find a way to click the OK button which is just an image inside a <span>
This is what I've tried so far:
const [button] = await frame.$x('/html/body/div/div[4]/div[2]/div/span[1]');
if (button) {
await button.click()
}
But the button is not found.
This is the pertinent section of the html:
<div class="vtm_text vtm_exportDialog"><input type="hidden" value="save">
...
<span class="vtmBtn" style="min-width: 60px; padding: 3px;">OK</span>
<span class="vtmBtn" style="min-width: 60px; padding: 3px;">Cancel</span>
</div>
This is what the page looks like when inspected in Chrome:
const [button] = await frame.$x("/html/body/div/div[4]/div[2]/div/span[1]");
async function pop_up() {
if (button) {
await button.click();
}
}
document.getElementsByClassName("vtmBtn").addEventListener("click", (e) => {
var img = document.createElement("img");
img.setAttribute("src", "");
// in the empty string put the path of the image you want
e.target.appendChild(img);
});
I was able to solve this by using $eval as follows:
await frame.$eval('span[class=vtmBtn]', el => el.click());