Question

我试图从puppeteer e2e测试中的div中获取值。 html和js的pice看起来有点像这样。问题是结果。当我使用id运行此代码时，其结果实际上是＆＃39; ＆＃39;只是控制台中的空行。

但是，如果我将},'[data-testid="TestID10"]')与注释的代码行交换，我会得到正确的答案＆＃39; Hello World＆＃39;在控制台中。（注意：使用Full html选择器路径在使用木偶操作时不是一个好习惯）

有人能告诉我为什么这不能与ID合作吗？以及如何使用HTML选择器来解决这个问题实际上是一种不好的做法。

亲切的问候！

＆＃13;

const value1 = await page
        .waitForSelector('[data-testid="TestID10"]')
        .then(() => {
            return Promise.resolve(
                page.evaluate((path) => {
                    return window.document
                        .querySelector(path)
                        .value;
                },'[data-testid="TestID10"]')
            )
        });
    console.log(value1);
    
    //  },'#0-row-0 > div > div.TableCell.row-0.col-0.TextInputCell > div')

＆＃13;

<div class="TextInputCell" data-testid="TestID10">
  <span class="value">Hello Word</span>
</div

＆＃13;

Answer 1

以下内容对我来说很好。请注意，我将selector放入variable而不是使用字符串。此外，我将按照您的示例返回innerText而不是value。 HTH

const puppeteer = require('puppeteer'); 

async function run() { 

const htmlStr = '<!doctype html><html><head></head>' +
  '<body><div class="TextInputCell" data-testid="TestID10">' +
  '<span class="value">Hello Word</span></div></body></html>';

  const browser = await puppeteer.launch({
      headless: false
  });
  const page = await browser.newPage();
  await page.setContent(htmlStr);    

  const selector = '[data-testid="TestID10"]';
  await page.waitForSelector(selector);

  var innerText = await page.evaluate((sel) => {
        return document.querySelector(sel).innerText;
  }, selector);

  console.log(innerText);

  browser.close();

};

run();

puppeteer page.evaluate path vs test-ID

1 个答案: