How to set <input> value in Puppeteer
Use this snippet to set the value of an HTML <input>
element in Puppeteer:
const newInputValue = "test 123";
await page.evaluate(val => document.querySelector('.search-form-input').value = val, newInputValue);amp
Remember to replace '.search-form-input'
by whatever CSS selector is suitable to select your <input>
. Examples include 'input[name="username"]'
or '.username > input'
.
Full example:
// Minimal puppeteer example
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto('https://techoverflow.net', {waitUntil: 'domcontentloaded'});
// Set input value
const newInputValue = "test 123";
await page.evaluate(val => document.querySelector('.search-form-input').value = val, newInputValue);
// Screenshot to verify result
await page.screenshot({path: 'screenshot.png'});
// Cleanup
await browser.close();
})();
Note that this method will work for any simple <input>
, however it might not work for some heavily Javascripted inputs which you can find on some modern websites.