Playwright 测试库 - 复选框状态

Question

请问如何获取 Playwright E2E 测试库中复选框元素的状态。

Answer 1

您可以使用

jsHandle.evaluate()

：

const checkbox = await page.$('[type=checkbox]');
const checkboxState = await checkbox.evaluate(node => node.checked);

或

page.$eval()

：

const checkboxState = await page.$eval('[type=checkbox]', node => node.checked);

或

page.evaluate()

：

const checkboxState = await page.evaluate(() => {
    const checkbox = document.querySelector('[type=checkbox]');
    return checkbox.checked;
});

如果你有更多，也可以一次性完成：

const checkboxStates = await page.evaluate(() => {
    const checkboxes = document.querySelectorAll('[type=checkbox]');
    return [...checkboxes].map(c => c.checked);
});

Answer 2

page.isChecked()

请检查文件：

https://playwright.dev/docs/api/class-page#page-is-checked

Answer 3

根据剧作家文档，

如果您需要断言复选框已选中，请首选 expect(locator).toBeChecked() 以避免不稳定。

所以：

断言复选框状态

const locator = page.getByLabel('Subscribe to newsletter');
await expect(locator).toBeChecked();

获取复选框状态

const checked = await page.getByRole('checkbox').isChecked();