Pressing Enter button in puppeteer

Javascriptnode.jsPuppeteer

Javascript Problem Overview


Pressing enter in puppeteer doesn't seem to have any effect. However, when I press other keys, it does what it should. This works:

await page.press('ArrowLeft');

This doesn't:

await page.press('Enter');

This is how the input looks like:

enter image description here

Any ideas?

EDIT: I've also tried page.keyboard.down & page.keyboard.up to be sure.

Javascript Solutions


Solution 1 - Javascript

I've used page.keyboard.press('Enter'); usually :) Works for me.

Have a look at the documentation https://github.com/GoogleChrome/puppeteer/blob/v1.14.0/docs/api.md#keyboardpresskey-options">here</a>;. I think you should use .keyboard before .press for it to work properly.

Solution 2 - Javascript

###page.keyboard.press():

You can use page.keyboard.press() to simulate pressing the enter key. Any of the following options should work:

await page.keyboard.press('Enter'); // Enter Key
await page.keyboard.press('NumpadEnter'); // Numeric Keypad Enter Key
await page.keyboard.press('\n'); // Shortcut for Enter Key
await page.keyboard.press('\r'); // Shortcut for Enter Key

###elementHandle.press():

Additionally, you can use use a combination of page.$() and elementHandle.press() to focus on an element before pressing enter:

await (await page.$('input[type="text"]')).press('Enter'); // Enter Key
await (await page.$('input[type="text"]')).press('NumpadEnter'); // Numeric Keypad Enter Key
await (await page.$('input[type="text"]')).press('\n'); // Shortcut for Enter Key
await (await page.$('input[type="text"]')).press('\r'); // Shortcut for Enter Key

###page.type():

Furthermore, you can use page.type():

await page.type(String.fromCharCode(13));

###page.keyboard.type():

Likewise, you can use page.keyboard.type():

await page.keyboard.type(String.fromCharCode(13));

###page.keyboard.sendCharacter():

Another alternative method would be to use the page.keyboard.sendCharacter() method:

await page.keyboard.sendCharacter(String.fromCharCode(13));

###page.keyboard.down() / page.keyboard.up():

You can also use a combination of page.keyboard.down() and page.keyboard.up():

// Enter Key
await page.keyboard.down('Enter');
await page.keyboard.up('Enter');

// Shortcut for Enter Key
await page.keyboard.down('NumpadEnter');
await page.keyboard.up('NumpadEnter');

// Shortcut for Enter Key
await page.keyboard.down('\n');
await page.keyboard.up('\n');

// Shortcut for Enter Key
await page.keyboard.down('\r');
await page.keyboard.up('\r');

Solution 3 - Javascript

await page.type(String.fromCharCode(13));

Using this site I noticed that page.type dispatches beforeinput and input events, but page.press doesn't. This is probably a bug, but fortunately sending the enter keycode (13) seems to work, so we can work around it for now.

Solution 4 - Javascript

await page.keyboard.press('Enter'); This work for me

Solution 5 - Javascript

short answer it might be a good idea to attach to the input control first :

    await page.type('#inp_srch_box', 'add');
    await page.type('#inp_srch_box',String.fromCharCode(13));

Long answer ...

  cat package.json
  {
    "name": "test-open-login",
    "version": "0.7.9",
    "description": "an example test to test the login of the qto app",
    "main": "test-open-login.test.js",
    "scripts": {
      "test": "mocha --recursive test",
      "server": "http-server src"
    },
    "license": "BSD",
    "devDependencies": {
      "mocha": "5.0.1",
      "puppeteer": "^2.1.0"
    },
    "dependencies": {
      "chai": "^4.2.0",
      "http-server": "^0.12.1",
      "mocha": "5.0.1"
    }
  }

  cat test/test-login.spec.js

  const puppeteer = require('puppeteer');
  async function main(){
    const browser = await puppeteer.launch({headless: false});
    const page = await browser.newPage();
    await page.setViewport({width: 1200, height: 720})
    await page.goto('https://qto.fi/qto/login', { waitUntil: 'networkidle0' }); 
  // wait until
  await page.type('#email', '[email protected]');
  //await page.type('#pass', 'secret');
  // click and wait for navigation


  await page.waitFor(1000);
  //await frame.waitFor(1000);
  await Promise.all([
     page.click('#butLogin'),
     page.waitForNavigation({ waitUntil: 'networkidle0' }),
  ]);

    await page.type('#inp_srch_box', 'add');
    await page.type('#inp_srch_box',String.fromCharCode(13));
  }

  main();

Solution 6 - Javascript

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionelenaView Question on Stackoverflow
Solution 1 - JavascriptkaiakView Answer on Stackoverflow
Solution 2 - JavascriptGrant MillerView Answer on Stackoverflow
Solution 3 - JavascriptBlackCapView Answer on Stackoverflow
Solution 4 - JavascriptAmir SikandarView Answer on Stackoverflow
Solution 5 - JavascriptYordan GeorgievView Answer on Stackoverflow
Solution 6 - JavascripttheBView Answer on Stackoverflow