CODEWITHSUNDEEP
puppeteer
miran80
miran80

Reputation: 1095

Trouble passing variable to puppeteer's page.$eval

I am trying to pass an object with login information to puppeteers page.$eval but the object is undefined in the function context. Here is my snippet:

const loginData = {
    user: "[email protected]",
    password: "mypassword"
};

await page.$eval("input[type='email']", el => {
    el.value = loginData.user
}, loginData);
await page.$eval("input[type='password']", el => {
    el.value = loginData.password
}, loginData);

But it works if I pass string literal instead of loginData.user and loginData.password I don’t understand the instructions: https://github.com/puppeteer/puppeteer/blob/master/docs/api.md#pageevalselector-pagefunction-args on how to properly pass additional arguments.

Alternatively, page.evaluate works fine:

    await page.evaluate((loginData) => {
        document.querySelector("input[type='email']").value = loginData.user;
    },loginData);

Upvotes: 0

Views: 679

Answers (1)

Edi Imanto
Edi Imanto

Reputation: 2499

You're mistakenly wrong in understanding the page.$eval method in your code.

const searchValue = await page.$eval('#search', el => el.value);

Line above is extracting the value of a selector with id search, and not the opposite way - write to #search input.

So to make your code passing an argument to be written in an input element selector, your code should be like this.


await page.type('input[type="email"]', loginData.user, {delay: 100}); // Types slower, like a user
await page.type('input[type="password"]', loginData.password, {delay: 10}); // Types faster, just like robot

Or, alternatively, if you want to use await page.evaluate


await page.evaluate((loginData) => {
    document.querySelector("input[type='email']").value = loginData.user;
    document.querySelector("input[type='password']").value = loginData.password;
},loginData);

Upvotes: 1

Related Questions