剧作家单击下拉菜单中的按钮

Question

这是该对象的 html：

<div class="filter-component filter-component-1">
   <p class="usa-accordion__heading">
     <button aria-selected="false" class="filtered assignment usa-accordion__button filter-dropdown ds-c-button ds-u-padding-left--1 ds-u-padding-right--4 ds-u-padding-y--1" aria-expanded="false" aria-controls="a1">
       <span>Medicare-approved payment: Full Payment </span>
       <div class="filter-arrow down"></div>
     </button>
   </p>
</div>

我的目标是获取类中的 divfilter-component-1并将其存储在变量中

1 单击该 div 2 单击该 div 中的按钮

我觉得我需要做类似的事情

A NOTE: I have altered how we structure these tests so that they run in aws lambda. The normal sytax of test('test description') etc does not work here. Hence the awaits. Please just focus on the playwright syntax line by line.

let dropdowndiv = await this.page.waitForSelector(".filter-component-1");

但然后呢？

抱歉，我对剧作家很陌生，文档几乎没用=( https://playwright.dev/java/docs/selectors#selecting-elements-that-c ​​ontain-other-elements

Answer 1

您不必选择任何内容，只需按照您的计划进行即可：

点击下拉菜单： await page.click(".filter-component-1")

然后点击按钮 await page.click("button")

（请注意，此按钮在该页面上必须是唯一的，如果不是，您可以添加另一个选择器以使其更加具体）

如果你真的想存储该 div 那么：

let dropdowndiv = await this.page.locator(".filter-component-1");

await dropdowndiv.click()

您可以使用此定位器来选择其中的按钮：

await dropdowndiv.locator("button").click()