Playwright - 查找多个元素或类名答案

【问题标题】：Playwright - Find multiple elements or class namesPlaywright - 查找多个元素或类名
【发布时间】：2021-06-16 12:40:24
【问题描述】：

我已经阅读了一些与此相关的不同 QA，但似乎都没有。

我正在尝试使用一个名为 mat-radio-checked 的类来定位一个名为 mat-radio-button 的元素（Angular）。然后选择内部文本。

在 Chrome 中这很容易：

https://i.stack.imgur.com/Ev0iQ.png

https://i.stack.imgur.com/lVoG3.png

要在 Playwright 中找到第一个匹配的元素，我可以执行以下操作：

      let test: any = await page.textContent(
      "mat-radio-button.mat-radio-checked"
    );

    console.log(test);

但如果我试试这个：

      let test: any = await page.$$(
      "mat-radio-button.mat-radio-checked"
    );

    console.log(test);
    console.log(test[0]);
    console.log(test[1]);
  });

它不返回我可以选择内部文本的元素数组。

我需要能够找到该类的所有元素，以便我可以使用 expect 来确保返回的内部文本是正确的，例如：

    expect(test).toBe("Australian Citizen");

【问题讨论】：

这段代码对我有用 gist.github.com/kblok/19b60e76197c4d8aebaba650b2b1af93 有什么不同？
嗨@hardkoded - 你的回应帮助了我。但请参阅我对主要问题的回答。

标签： javascript typescript automation browser-automation playwright

【解决方案1】：

我发现问题是由于页面预先生成并且元素不可用。所以我加了一个waitForSelector：

await page.waitForSelector("mat-radio-button");

const elements = await page.$$("mat-radio-button.mat-radio-checked");
console.log(elements.length);
console.log(await elements[0].innerText());
console.log(await elements[1].innerText());
console.log(await elements[2].innerText());

【讨论】：