Interacting with browser using javascript

Question

I'm trying to run a simple javascript file from the terminal (Ubuntu) that clicks a button on a website. However, I haven't been able to find how to do so, since I've learned that you can't interact with the browser in Node (for doing things like running commands such as window.location.href).

(source: ReferenceError : window is not defined at object. <anonymous> Node.js).

For example, I'd like to be able to create a script (let's call it test.js) where when I run ./test.js or node test.js in the terminal, it will:

go to www.google.com
Click on the "Images" button in the top right.

I wrote out how I understand to do that below:

window.location.href = "https://www.google.com"
document.getElementById('the id of the image button').click()

It seems extremely straightforward, but I am a beginner to Javascript and am not aware of its limitations and could most definitely be wrong about Node. Could someone help explain how I should go about doing something as simple as this? Thanks

EDIT: For clarification on the context, this is just a part of me trying to automate form submissions. I also want to be able to enter specified text into input fields and so on.

While node code is javascript, is it completely unrelated to javascript running in your browser. What you are proposing is something you can't directly script in node. — Joe
– Joe, Commented Jul 8, 2020 at 1:53

jbielick · Accepted Answer · 2020-07-08 02:21:23Z

4

Node.js does not include a browser or any browser-like control required to execute the code you posted. Fortunately, this is fairly straightforward with the addition of some extra Node.js software.

What you're looking for is Puppeteer. It's a Node.js library that comes with a small Chrome browser and allows you to remote control that browser from some very easy Node.js functions / methods.

In a directory of your choosing, install puppeteer with npm like so:

npm install -S puppeteer

This will install the library locally into a node_modules/ directory.

Then, you'll need a single javascript file (like test.js in your example) in which you write code like the example in the README (linked above):

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://www.google.com');
  await page.click('the id of the "images" link or some selector');
  await page.screenshot({path: 'example.png'});

  await browser.close();
})();

edited Jul 8, 2020 at 2:21

answered Jul 8, 2020 at 1:54

jbielick

3,1921 gold badge22 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Justin Arenson Over a year ago

thanks. For clarification, could I then run any javascript commands below? Could I also then run that file from the command line? My apologies if these are extremely trivial questions, just trying to make sure I understand your solution before I accept it.

jbielick Over a year ago

To remote control the browser, you'll need to use the functions / commands that Puppeteer provides. Check out their documentation (in the readme) for more info about that and some googling will help as well. The example snippet I posted is a translation of what you were looking for into puppeteer node.js code. The javascript commands you posted will only work within a browser. If you absolutely needed to, you could use await page.evaluate(() => { ... }) and write browser javascript in the place of ....

Justin Arenson Over a year ago

thanks for your help so far. I've tried using your solution and simply copy/pasting your code into vs code gives me this error when I run from Ubuntu: ./test.js: line 1: syntax error near unexpected token `('. Any suggestions?

jbielick Over a year ago

I believe your question was answered. If you need a tutorial on how to use puppeteer and setup a javascript file and run it with node.js, try this guide by google: developers.google.com/web/tools/puppeteer/get-started

Justin Arenson Over a year ago

To anyone who finds this helpful later, I found that another good solution was to use Selenium. Difficult to get running, but far easier than Puppeteer.

Collectives™ on Stack Overflow

Interacting with browser using javascript

1 Answer 1

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related