Today we will play with Puppeteer to control Google Translate service. The scenario is to translate a text from Bahasa Indonesia to English. Language code for Bahasa Indonesia is id and language code for English is en.
You can adjust the language code with your own.
Technically speaking, I just want to control this URL.
https://translate.google.com/#view=home&op=translate&sl=id&tl=en
sl parameter is language code for source text
tl parameter is language code for translated text
Let's play.
Preparation
Install Puppeteer
npm i puppeteer
Sample code
File google_translate.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');
// define source and target language code
let sourceLang = 'id', targetLang = 'en';
await page.goto(`https://translate.google.com/#view=home&op=translate&sl=${sourceLang}&tl=${targetLang}`);
// detect the source textarea for input data (source string)
await page.waitForSelector('#source');
await page.waitFor(1000);
// string that we want to translate and type it on the textarea
let sourceString = 'Apa kamu sadar kalau muka kamu itu jelek sekali?';
await page.type('#source', sourceString);
// wait for the result container available
await page.waitForSelector('.result-shield-container');
await page.waitFor(3000);
// get the result string (translated text)
const translatedResult = await page.evaluate(() => {
return document.querySelectorAll('.result-shield-container')[0].textContent;
});
// display the source and translated text to console
console.log(`${sourceLang}: ${sourceString}\n${targetLang}: ${translatedResult}`);
await page.waitFor(1000);
await browser.close();
})();
The code are self explanatory. I set the headless option to false, so we can see the browser automation in action.
Run it
node google_translate.js
Sample of result are below
Ow nice.
I hope you enjoy it. Thank you very much.
Repository of this sample is available at https://github.com/sonyarianto/translate-text-with-google-translate-and-puppeteer
Top comments (0)