I have a checkbox I need to click on a webpage, and I am attempting this using Puppeteer. I can click the checkbox, but the 'checked' state never changes. The checkbox enables another button on page that I need to click once enabled:
I took a look at this example, and while the click seems to work (there's no error) and I verified the selector does indeed select the correct checkbox, it's still not checked.
Here is my code:
await page.$eval("input[name='Checkbox']", check => check.click())
const checkbox = await page.$("input[name='Checkbox']")
console.log("Checked = " + await (await checkbox.getProperty('checked')).jsonValue());
await page.$eval("input[name='Checkbox']", el => el.checked) // This is also false
Where the log always shows "Checked = false". The checkbox is unchecked when I first click it.
If I change it a bit and try:
await page.$eval("input[name='Checkbox']", el => el.checked = true)
const checkbox = await page.$("input[name='Checkbox']")
console.log("Checked = " + await (await checkbox.getProperty('checked')).jsonValue());
Then the 'checked' property is true, but the box is not visibly checked in debug mode in Chromium, and the elements that should be enabled by checking the box are not.
This is the HTML I am working with:
<input type="checkbox" value="1" name="Checkbox">
If I open up Dev Tools in Chrome, I can check the box like:
$("input[name='Checkbox']").click()