Connect to Headless With NodeJS Function Stack

In this section you will find the required scripts to connect to headless using the NodeJS function stack with a browser automation library of your preference:

Puppeteer

Using Puppeteer Without SmartBrowz

copy
import puppeteer from 'puppeteer';
(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('http://example.com/');
  await page.screenshot({‘path’:’example.png’})  
  await browser.close();
})();

Using Puppeteer With SmartBrowz

copy
// From inside your Node application
const puppeteer = require("puppeteer-core");

// Replace puppeteer.launch with puppeteer.connect const browser = await puppeteer.connect({ browserWSEndpoint: ‘YOUR_CDP_ENDPOINT’ });

// The rest of your script remains the same const page = await browser.newPage(); await page.goto(‘https://example.com/'); await page.screenshot({ path: ‘screenshot.png’ }); page.close();

Note: Copy the CDP Endpoint from the console and paste it in line "6" when you implement this code.

Playwright

Using Playwright Without SmartBrowz

copy
import { test } from '@playwright/test';
test('Page Screenshot', async ({ page }) => {
  await page.goto('http://example.com/‘);
  await page.screenshot({ path: `example.png` });
});

Using Playwright With SmartBrowz

copy
// From inside your Node application
const pw = require('playwright-core'); 
// Replace pw.chromium.launch with connectOverCDP
const browser = await pw.chromium.connectOverCDP({
wsEndpoint: 'YOUR_CDP_ENDPOINT'
});

// The rest of your script remains the same const page = await browser.newPage(); await page.goto(‘https://www.example.com/'); await page.screenshot({ path: ’example.png’ }); await browser.close();

Note: Copy the CDP Endpoint from the console and paste it in line "5" when you implement this code.

Selenium

Using Selenium Without SmartBrowz

copy
require("chromedriver");
require("selenium-webdriver")

let webdriver = require(“selenium-webdriver”); var By = require(“selenium-webdriver”).By; let browser = new webdriver.Builder(); let driver = browser.forBrowser(“chrome”).build();

driver.get(‘https://example.com/');

driver.takeScreenshot().then( function(image) { require(‘fs’).writeFileSync(‘captured_image_3.png’, image, ‘base64’); } );

driver.quit();

Using Selenium With SmartBrowz

copy
// From inside your Node application
const webdriver = require('selenium-webdriver'),
chrome = require('selenium-webdriver/chrome'); 
const chromeCapabilities = webdriver.Capabilities.chrome();
var options = new chrome.Options();
options.addArguments("--no-sandbox");
options.addArguments('--headless') 
options.addArguments('--disable-dev-shm-usage')
const driver = new webdriver.Builder()
  .forBrowser('chrome') 
  .setChromeOptions(options)
  .withCapabilities(chromeCapabilities)
  .usingServer('YOUR_WEBDRIVER_ENDPOINT')
  .build();

// The rest of your script remains the same await driver.get(‘https://www.example.com/'); const base64png = await driver.takeScreenshot(); fs.writeFileSync(’/tmp/screenshot.png’,new Buffer(base64png, ‘base64’)); driver.quit();

Note: Copy the Webdriver Endpoint from the console and paste it in line "13" when you implement this code.

Last Updated 2023-05-08 11:50:17 +0530 IST