如何检查从 page.evaluateHandle 返回的 jsHandle 是否为空/null？

Question

setversionNumber = async (index, page) => {
const input = await page.evaluateHandle((i) => {
    const versionView = document.getElementsByClassName("mx-dataview mx-name-dataView9")[0]; 
    const inputfield =  versionView.getElementsByTagName('input')[i]; 
    if (inputfield.value === null || inputfield.value === '' ) {
            console.info('returning input');
            return inputfield;
        } 
    console.info('returning null');
    return null;
}, index);

if (await input !== null) {
    console.info('input is filled');
    const content = await page.evaluate((i) => i.value, input);
    console.log(content);
    await input.type('1');
} else {
    console.info('input is empty');
}

我得到了这段代码，它需要获取一个输入字段，如果输入的值为空，则输入“1”。当我在浏览器中运行它时，控制台会记录“reruning null”，这是预期的，因为输入值为空。

但是，当检查返回的输入是否实际上为空时，它会记录“输入已填充”。之后会抛出错误，提示“无法读取 null 的属性“值””。这意味着输入实际上为空。所以我认为我只是没有使用正确的检查来查看这个输入对象是否实际上为空。

是否有其他方法来检查 page.evaluateHandle 返回的对象是否为空/null？

Answer 1

\n

1. page.evaluateHandle()alwais 总是返回 jsHandle 作为页内 JS 值。当该值为null时，该值的jsHandle本身不为null。

   \n
\n

2. 当您提供 jsHandle 时，page.evaluate()它​​会自动转换为值本身，因此这就是为什么await input !== null和\'cannot read property "value" of null\'frompage.evaluate((i) => i.value, input);可以同时为 true。

   \n
\n

\n

要检查 null，请使用 \xe2\x80\x94 返回的值page.evaluate()或使用jsHandle.jsonValue()after page.evaluateHandle()：

\n

import puppeteer from \'puppeteer\';\n\nconst browser = await puppeteer.launch(/* { headless: false, defaultViewport: null } */);\n\ntry {\n  const [page] = await browser.pages();\n\n  await page.goto(\'https://example.org/\');\n\n  const data = await page.evaluate(() => null);\n  console.log(data === null); // true\n\n  const dataHandle = await page.evaluateHandle(() => null);\n  console.log(dataHandle === null); // false\n  console.log(await dataHandle.jsonValue() === null); // true\n\n} catch(err) { console.error(err); } finally { await browser.close(); }\n

\n