Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to access current value in a text input field with puppeteer

I'm trying to automate retrieving form values from an already filled out form with puppeteer and xpath.

I've already automated FILLING a text input field as follows, but doing the reverse with .evaluate() doesn't work:

[fieldHandle] = await page.$x("//label[text() = 'My Label']/../following-sibling::td[1]//input")
await page.evaluate((x, y) => x.value = y, fieldHandle, 'newValue')

This is my most recent attempt - still no success...

let [fieldHandle] = await page.$x("//label[text() = 'My Label']/../following-sibling::td[1]//input")
let fieldRaw = await fieldHandle.getProperty('textContent')
let fieldValue = await fieldRaw.jsonValue()

Hopefully someone out there knows how to achieve this!

like image 929
remed.io Avatar asked Sep 04 '19 21:09

remed.io


People also ask

How do you find the element by name in puppeteer?

puppeteer find element by text You have to form XPath based on the text so that you can find the element. Once you form the XPath then you can use the $x method to find the element.

How to set <input> value in puppeteer?

How to set <input> value in Puppeteer. Use this snippet to set the value of an HTML <input> element in Puppeteer: Remember to replace '.search-form-input' by whatever CSS selector is suitable to select your <input>. Examples include 'input [name="username"]' or '.username > input'. Note that this method will work for any simple <input>, ...

How to display the value of inputtext in a button?

On clicking the button, it shows an alert that shows the value of inputText. If you run this, it will show one input component with a button. You can enter anything in the input box and click on the button.

How to display alert when input is entered in the input?

You can enter anything in the input box and click on the button. It will show an alert with the text that is entered in the input box. We can also use hooks to do the same.

How do I get the current value of the text field?

After supplying the TextEditingController to the text field, begin reading values. Use the text () method provided by the TextEditingController to retrieve the String that the user has entered into the text field. The following code displays an alert dialog with the current value of the text field when the user taps a floating action button.


1 Answers

Using evaluate should work:

console.log(await page.evaluate(x => x.value, fieldHandle)));
like image 181
hardkoded Avatar answered Sep 29 '22 16:09

hardkoded