Установить текст в поле ввода

У меня есть строка, значение которой изменяется, и мне нужно поместить эту строку в поле ввода.

(async () => {
  let pageNum = 1004327;

  let browser = await puppeteer.launch({
    headless: true,
  });

  let page = await browser.newPage();
    
  while (1) {
      await page.goto(`${link}${pageNum}`);
      page.setDefaultTimeout(0);
      let html = await page.evaluate(async () => {
        let mail = document.getElementById(
          "ctl00_phWorkZone_DbLabel8"
        ).innerText;
        let obj = {
          email: mail,
          link: window.location.href,
        };
        return obj;
      });
      if (Object.values(html)[0]) {
        await staff.type(
          "textarea[name=mail_address]",
          Object.values(html).join("\n"),
          {
            delay: 0,
          }
        );
        console.info(pageNum);
        pageNum++;
        staff.click("input[name=save]", { delay: 0 });
      }
  }
})();

Я использовал метод .type(), и он работает, но мне нужно что-то более быстрое.

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
2
0
90
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Ответ принят как подходящий

.type() метод позволит вам вводить данные, как если бы вы печатали вручную. Вместо этого просто попробуйте метод .keyboard.sendCharacter() (источник). Это позволит вам мгновенно вводить данные, не печатая их.

Пример использования:

const puppeteer=require('puppeteer');
const browser=await puppeteer.launch({ headless: false });

const page=await browser.newPage()
await page.goto("https://stackoverflow.com/q/75395199/12715723")

let input=await page.$('input[name = "q"]');
await input.click();
await page.keyboard.sendCharacter('test');

Привет, похоже, я действительно не знаю, как его использовать. Не могли бы вы поделиться примером того, как я могу поместить текст во ввод с помощью этого метода, пожалуйста?

Muxa 09.02.2023 12:59

Я не уверен, как ввод работает на странице, поскольку для этого требуется авторизация, но во многих случаях (в зависимости от того, как сайт прослушивает изменения в элементе) вы можете установить значение с помощью браузера JS:

staff.$eval(
  'textarea[name = "mail_address"]',
  (el, value) => el.value = value,
  evalObject.values(html).join("\n")
);

Запускаемый, минимальный пример:

const puppeteer = require("puppeteer"); // ^19.6.3

const html = `<!DOCTYPE html><html><body>
<textarea name = "mail_address"></textarea></body></html>`;

let browser;
(async () => {
  browser = await puppeteer.launch();
  const [page] = await browser.pages();
  await page.setContent(html);
  const sel = 'textarea[name = "mail_address"]';
  await page.$eval(
    sel,
    (el, value) => el.value = value,
    "testing"
  );
  console.info(await page.$eval(sel, el => el.value)); // => testing
})()
  .catch(err => console.error(err))
  .finally(() => browser?.close());

Если это не сработает, вы можете попробовать вызвать обработчик изменений элемента с помощью доверенного действия клавиатуры Puppeteer или вручную с помощью ненадежного события браузера JS. Вы также можете использовать keyboard.sendCharacter, когда фокус находится на элементе, как указано в этом ответе:

await page.focus(selector);
await page.keyboard.sendCharacter("foobar");

Обратите внимание, что в исходном коде .setDefaultTimeout(0); рискованно, потому что это может привести к зависанию скрипта навсегда, не вызывая ошибки. staff.click и page.authenticate нужно ждать, так как они возвращают обещания.

Другие вопросы по теме