puppeteer.js нажмите гиперссылку с классом

Question

async function main() {
    const browser = await puppeteer.launch({ headless: false});
    const page = await browser.newPage();

    await page.goto(url);
    console.log(await page.title());

await page.click('a.search-name');

}

<div class="search-results-content-container">
                    <div class="search-results-image-container">
                    </div>
                    <div class="search-results-details-container">
                         <h4 class="search-name"><a href="http://yahoo.com">Doe, Johm</a></h4>
                              <p class="search-title">
                                  center of art
                              </p>
                    </div>

Привет! Я использую кукловода, чтобы автоматизировать некоторые задачи, и я двигаюсь вперед, пока не пришло время щелкнуть ссылку h4, у которой есть класс с именем 'search-name». Я попытался добавить await page.click ('a.search-name'), но это не работает. Я также попробовал await page.click ('h4.search-name'), но тоже не повезло. Может кто-нибудь сказать мне, как заставить его щелкнуть ссылку со сменным URL. По этой причине я хочу специально щелкнуть h4 с помощью класса search-name.

Answer 1

Код ниже - это то, что работает!

await page.waitForSelector('.search-name')
await page.click('.search-name');

Answer 2

Из вашего теста - await page.click('a.search-name'); a ссылка не имеет класса search-name, поэтому селектор не может быть найден и ничего не нажано.

Если вы хотите оставить класс search-name на h4 Я предлагаю добавить атрибут data-test к ссылке <a href="http://yahoo.com" data-test='search-name'> и изменить тест на: await page.click('a[data-test="search-name"]');

HTML

<div class="search-results-content-container">
  <div class="search-results-image-container">
  </div>
  <div class="search-results-details-container">
    <h4 class="search-name">
      <a href="http://yahoo.com" data-test='search-name'>Doe, Johm</a>
    </h4>
    <p class="search-title">
      center of art
    </p>
  </div>
</div>

Теперь await page.click('a.search-name'); должно работать!

Хорошая схема - при выборе селекторов атрибутов ' data-test ' при выбореэлементы.