Не удается нажать на кнопку с помощью кукловода

#javascript #node.js #automation #puppeteer #webautomation

Вопрос:

Я использую кукольника.

 await page.type('#guestEmail', email);
await page.click("#checkoutGuest");

итак, как работает сайт, пользователю нужно будет ввести адрес электронной почты 1-го, затем будет доступна кнопка для выбора. Странно, что приведенный выше код не работает. Я попытался использовать тайм-аут в пару секунд, чтобы дождаться, пока кнопка будет доступна, но нет.
Вот ссылка на страницу. Кто-нибудь может помочь?

Ответ №1:

Вы можете попробовать это сделать.

 let browser, page;
let pageUrl = 'https://www.jdsports.com.sg/checkout/login/';
let email = 'testing@gmail.com';

try {
  browser = await puppeteer.launch({ headless: true });
  page = await browser.newPage();
  await page.goto(pageUrl, { waitUntil: 'domcontentloaded', timeout: 60000 });
  await page.type('#guestEmail', email);
  await page.waitForSelector('button#checkoutGuest:not([disabled])');
  await page.click("#checkoutGuest");

} catch (err) {
  console.log(err.message);
} finally {
  if (browser) {
    await browser.close();
    console.log('closing browser');
  }
}

Или вы можете попробовать страницу.оценить.

 let browser, page;
let pageUrl = 'https://www.jdsports.com.sg/checkout/login/';
let email = 'testing@gmail.com';

try {
  browser = await puppeteer.launch({ headless: true });
  page = await browser.newPage();
  await page.goto(pageUrl, { waitUntil: 'domcontentloaded', timeout: 60000 });
  await page.type('#guestEmail', email);            
  await page.evaluate(() => {
    if (!document.getElementById('checkoutGuest').disabled) {
      await page.click("#checkoutGuest");
    }
  });
        
} catch (err) {
  console.log(err.message);
} finally {
  if (browser) {
    await browser.close();
    console.log('closing browser');
  }
}

Или вы можете попробовать использовать функцию ожидания.

 let browser, page;
let pageUrl = 'https://www.jdsports.com.sg/checkout/login/';
let email = 'testing@gmail.com';

try {
  browser = await puppeteer.launch({ headless: true });
  page = await browser.newPage();
  await page.goto(pageUrl, { waitUntil: 'domcontentloaded', timeout: 60000 });
  await page.type('#guestEmail', email);            
  await page.waitForFunction('document.getElementById("checkoutGuest").className != "btn btn-level1 large disabled"');
        
} catch (err) {
  console.log(err.message);
} finally {
  if (browser) {
    await browser.close();
    console.log('closing browser');
  }
}

1. спасибо, я попробовал ваше решение, и оно работает. Понял свою ошибку теперь, ха-ха, страница еще не загрузила кнопку, поэтому она не смогла ее найти.

2. У меня действительно есть вопрос, как вы получили это значение селектора await page.waitForSelector('button#checkoutGuest:not([disabled])')

3. Я использовал инструменты разработчика Chrome для просмотра элементов.

4. Если вам нужна помощь в использовании селекторов, вы можете прочитать документы для кукольника по адресу: pptr.dev

Ответ №2:

Может быть, твоя проблема была в всплывающем окне. Вы всегда можете отладить сеанс кукловода, запустив кукловода в головном режиме или сделав скриншоты. Конечно, есть лучший способ сделать это с всплывающим окном, но вы поняли идею.

 const checkForPopup = () => {
    const item = myPage.$('.countryselector');
    if(item) {
        myPage.click('.close');
    }
}

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

    // visit page with product
    await myPage.goto('https://www.jdsports.com.sg/product/white-nike-waffle-one/16139953_jdsportssg/');

    // select product
    await myPage.click("button[title="Select Size 6.5"]");
    checkForPopup();
    await myPage.click("#addToBasket");
    checkForPopup();

    // add product to cart
    await myPage.waitForSelector('.addToCatPopupDesignCheckout');
    checkForPopup();
    await myPage.click(".addToCatPopupDesignCheckout");
    checkForPopup();

    // type email and checkout
    await myPage.waitForSelector('#guestEmail');
    checkForPopup();
    await myPage.click('#guestEmail');
    checkForPopup();
    await myPage.keyboard.type('someEmail');
    checkForPopup();
    await myPage.click("#checkoutGuest");
}