Practical Puppeteer: Doing currency converter with Google search result
Tags: puppeteer, currencyconverter, automation, javascript
Published: 2019-12-09 07:29:03

---
title: Practical Puppeteer: Doing currency converter with Google search result
published: true
description: This time we will try to do currency converter in Google search result with Puppeteer
tags: puppeteer, currency converter, automation, javascript
cover_image: https://thepracticaldev.s3.amazonaws.com/i/fo9p86a99slbk5fz9p2z.jpg
---

Today fun web scraping will scrap the Google search result of currency converter. Basically it will scrape the result of this Google search URL.

```
https://www.google.com/search?hl=en&q=BTC+to+USD
```

Above URL will convert 1 BTC to USD and Google will display the result in knowledge card form like below.

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/bqrds1m71spnwhz9ibkt.png)

We will create a small Javascript code to scrap the currency converter result with the help of Puppeteer.

Puppeteer is a Node library which provides a high-level API to control Chrome or Chromium over the DevTools Protocol. Puppeteer runs headless by default, but can be configured to run full (non-headless) Chrome or Chromium. You can read more info about it at https://pptr.dev.

Let's start.

## Preparation
Install Puppeteer
```
npm i puppeteer
```

## The code
This code will try to convert from 1 BTC to USD. You can adjust with your own currency code on the source code.

File `google_currency_converter.js`

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

(async () => {
	let launchOptions = { headless: false, 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');
	
	// prepare source and target currency
	let currencyCodeSource = 'BTC', currencyCodeTarget = 'USD';

	// use Google to do currency exchange
	// currently data in Google provided by Morningstar for Currency and Coinbase for Cryptocurrency
	await page.goto(`https://www.google.com/search?hl=en&q=${currencyCodeSource}+to+${currencyCodeTarget}`);
	
	// wait until the knowledge about currency is ready on DOM
	await page.waitForSelector('#knowledge-currency__updatable-data-column');
	await page.waitFor(2000);

	// get the currency exchange data
	const currencyExchange = await page.evaluate(() => {
		return {
			    'currency_source_value': parseFloat(document.getElementById('knowledge-currency__updatable-data-column').querySelectorAll('input')[0].getAttribute('value')),
			    'currency_source_freebase_id': document.getElementById('knowledge-currency__updatable-data-column').querySelectorAll('select')[0].options[document.getElementById('knowledge-currency__updatable-data-column').querySelectorAll('select')[0].selectedIndex].getAttribute('value'),
			    'currency_source_name': document.getElementById('knowledge-currency__updatable-data-column').querySelectorAll('select')[0].options[document.getElementById('knowledge-currency__updatable-data-column').querySelectorAll('select')[0].selectedIndex].text,
			    'currency_target_value': parseFloat(document.getElementById('knowledge-currency__updatable-data-column').querySelectorAll('input')[1].getAttribute('value')),
			    'currency_target_freebase_id': document.getElementById('knowledge-currency__updatable-data-column').querySelectorAll('select')[1].options[document.getElementById('knowledge-currency__updatable-data-column').querySelectorAll('select')[1].selectedIndex].getAttribute('value'),
			    'currency_target_name': document.getElementById('knowledge-currency__updatable-data-column').querySelectorAll('select')[1].options[document.getElementById('knowledge-currency__updatable-data-column').querySelectorAll('select')[1].selectedIndex].text
			   }
	});

	// show the results
	console.log(currencyExchange);

	await page.waitFor(1000);
	await browser.close();
})();
```

## Run it
```
node google_currency_converter.js
```

If everything OK then it will run the Chrome browser and will display the result on console like below.

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/mddhqmgerpth1hp1flye.png)

Ow nice, 1 BTC equal 7483.75 USD at the time of writing.

I hope you enjoy it. Thank you very much.

Repository of this sample is available at https://github.com/sonyarianto/currency-converter-using-google-search-result-and-puppeteer

## Reference
- https://pptr.dev
- https://www.google.com/search?hl=en&q=BTC+to+USD