web-dev-qa-db-ja.com

Puppeteer-checkbox.checkedは未定義です-なぜですか?

私は操り人形師と冗談を使用して、フロントエンドのいくつかのものをテストしていますが、小さな問題が発生しています-見当たらない概念があると思います。

_test("Assert that when checkbox isn't checked, dropdown menu is visible", async () => {
    let checkbox = await page.$('input[ng-model="user.managed.timezone"]');
    console.log("Checking if checkbox checked");
    console.log("CHECKED: ", checkbox.checked);
  });
_

人形遣いのドキュメントによると、page。$はdocument.querySelectorを実行します。ブラウザで次のコマンドを実行すると、必要なものが得られます。

let m = document.querySelector('input[ng-model="user.managed.timezone"]') console.log(m.checked) // results in true or false

しかしjestのコードはCHECKED:undefinedになります

なぜこれが当てはまるのですか->どの概念が欠けていますか?

9
Asool

ElementHandle の値を読み込もうとしていますが、純粋な JS Element と同じではありません。

checked値を取得するには、次の構文を使用する必要があります。

await (await checkbox.getProperty('checked')).jsonValue()

これが実際の例です:

const puppeteer = require('puppeteer');

const html = `
    <html>
        <body>
            <input ng-model="user.managed.timezone" type="checkbox" />
        </body>
    </html>`;

(async () => {
    const browser = await puppeteer.launch();
    const page = await browser.newPage();
    await page.goto(`data:text/html,${html}`);

    const checkbox = await page.$('input[ng-model="user.managed.timezone"]');

    console.log(await (await checkbox.getProperty('checked')).jsonValue());
    await checkbox.click();
    console.log(await (await checkbox.getProperty('checked')).jsonValue());

    await browser.close();
})();
19
Everettss