Practical Puppeteer: Playing with Puppeteer Core package
Tags: puppeteer, puppeteercore, automation
Published: 2019-12-22 05:25:05

If you used to play with Puppetter, you must be already know that when installing Puppeteer (with `npm i puppeteer`) it will install recent version of Chromium browser. So it's quite big download size and usually takes long time during installation.

As stated on the documentation below.

> Note: When you install Puppeteer, it downloads a recent version of Chromium (~170MB Mac, ~282MB Linux, ~280MB Win) that is guaranteed to work with the API.

Today we will try to use Puppeteer Core (package name `puppeteer-core`), a version of Puppeteer that doesn't download Chromium by default. It available since Puppeteer version `1.7.0`.

What does it means? It means you can use existing Chrome or Chromium browser for browsing automation with Puppeteer. And again according to documentation said below.

> Be sure that the version of puppeteer-core you install is compatible with the browser you intend to connect to.

Okay, no problem we will try first. I am sure for general use case it will work.

The difference between `puppeteer` and `puppeteer-core` in the term of launch settings is we have to define the Chrome or Chromium browser executable path. Technically we have to define `executablePath` option that contains the Chrome or Chromium browser path. We will show this later on the source code.

Let's start.

## Scenario

I am using Ubuntu 19.10 eoan and I already have Google Chrome installed and now I want to try `puppeteer-core`. I don't know what current version of Google Chrome installed. I will create the script that use `puppeteer-core` to show my Google Chrome version. It's pretty simple.

## Preparation

Install Puppeteer Core (`puppetter-core`) package.

```
npm i puppeteer-core
```

Get the executable path for Chrome or Chromium browser.

On my Ubuntu machine, I just type this.

```bash
whereis google-chrome-stable
```

It will print like below.

```
google-chrome-stable: /usr/bin/google-chrome-stable /usr/share/man/man1/google-chrome-stable.1.gz
```

OK, it means the Google Chrome available at `/usr/bin/google-chrome-stable`.

So far we are ready to go.

## The code

File `puppeteer_core.js`

```js
const puppeteer = require('puppeteer-core');

(async () => {
	// set some options (set headless to false so we can see 
	// this automated browsing experience)
	let launchOptions = { headless: false, 
						  executablePath: '/usr/bin/google-chrome-stable', // because we are using puppeteer-core so we must define this option
		                  args: ['--start-maximized'] };
	
	const browser = await puppeteer.launch(launchOptions);
	const page = await browser.newPage();

	// set viewport and user agent (just in case for nice viewing)
	await page.setViewport({width: 1366, height: 768});
	await page.setUserAgent('Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.108 Safari/537.36');

	// go to the target web
	await page.goto('https://google.com');

	console.log(await browser.version());

	// close the browser
	await browser.close();
})();
```

## Run it

```
node puppeteer_core.js
```

On my Ubuntu system it will return below in the console.

```
Chrome/79.0.3945.88
```

Oh yeah, now I know my existing Chrome browser exact version.

The source code in this post also available on my GitHub repository at https://github.com/sonyarianto/puppeteer-core-package-example

Thank you and I hope you enjoy it.

## Reference
- https://pptr.dev
- https://github.com/puppeteer/puppeteer
- https://github.com/puppeteer/puppeteer/blob/master/docs/api.md#puppeteer-vs-puppeteer-core

## Credits
- Cover image by Christina Morillo https://www.pexels.com/photo/photography-of-person-typing-1181675/