Skip to content
-
NPM Puppeteer
Last Updated :
23 Jul, 2025
Puppeteer, a Node.js library, offers a robust high-level API for controlling Chrome/Chromium browsers through the DevTools Protocol. It excels in automating browser tasks and interactions, making it a go-to choice for developers seeking efficient automation solutions.
Puppeteer operates seamlessly with Chrome/Chromium, providing developers with the ability to manage browser instances programmatically. It can run in headless mode by default, allowing automated tasks without a graphical user interface. Alternatively, it can be configured to operate in full ("headful") mode for debugging and interactive purposes.
Key Features of Puppeteer
- Automation: Puppeteer simplifies browser automation tasks such as navigation, form submission, and data extraction.
- Headless Mode: Default mode for Puppeteer, enabling automated tasks without a visible UI.
- Full Browser Mode: Can be configured to run with a graphical interface for debugging and interactive purposes.
- DevTools Protocol: Puppeteer leverages the DevTools Protocol to communicate with Chrome/Chromium browsers.
Use Cases
Puppeteer finds applications in various scenarios, including:
- Web Scraping: Extracting data from websites efficiently and programmatically.
- Automated Testing: Running automated tests and scripts to validate web applications.
- Screenshot Generation: Capturing screenshots of web pages for monitoring or reporting purposes.
Installing Node.js and npm
Node.js Installation:
- Visit the official Node.js website (Download Node.js).
- Download the recommended LTS (Long Term Support) version for your operating system (Windows, macOS, Linux).
- Run the installer and follow the installation instructions.
- Verify the installation by opening a terminal (command prompt on Windows) and running:
node --version
npm --version
This will display the installed Node.js and npm versions.
Installing the library via npm:
First, Create the application using the following command:
npm init -y
Install the required dependencies using the following command:
npm install puppeteer
The Updated dependencies in your package.json file is:
"dependencies":{
"puppeteer": "^22.8.1",
}Once installed, puppeteer can be initialized within a Node.js script to launch a browser instance and perform various operations.
Example: Here's a simple Puppeteer script demonstrating browser automation:
JavaScript
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
// Navigate to the URL you want to screenshot
console.log("Navigating to the webpage...");
await page.goto('https://example.com');
console.log("Page loaded successfully.");
// Take a screenshot and save it as 'example.png' in the current directory
console.log("Taking screenshot...");
await page.screenshot({ path: 'example.png' });
console.log("Screenshot saved as 'example.png'.");
await browser.close();
})();
Output:
npm puppeteer
Similar Reads
Node.js Puppeteer Puppeteer is an open-source library for Node.js that helps in automating and simplifying development by providing control over the Developers tools. It allows developers to write and maintain simple and automated tests. Most of the things that were done in the browser manually can be done by using p
5 min read
Cypress vs Puppeteer There are two distinct approach for interfacing with web browsers in the field of automated testing: Cypress and Puppeteer. Although they are meant to make web application testing easier, the two tools have different functions and are better suited for various kinds of testing situations.In this art
2 min read
Cypress vs Puppeteer There are two distinct approach for interfacing with web browsers in the field of automated testing: Cypress and Puppeteer. Although they are meant to make web application testing easier, the two tools have different functions and are better suited for various kinds of testing situations.In this art
2 min read
pnpm vs npm In JavaScript, package managers are crucial in managing project dependencies efficiently. Two of the most popular package managers are npm (Node Package Manager) and pnpm (Performant npm). While both serve the same fundamental purpose of installing and managing packages they differ significantly in
4 min read
What is NPM? NPM-Node Package Manager is the tool used by most developers within the JavaScript ecosystem. It manages packages and dependencies on behalf of an application in Node.js. It provides a lightweight way of installing, upgrading, configuring, and removing third-party libraries or modules that might be
9 min read
npm run dev When working with Node.js and JavaScript projects, especially those involving frontend frameworks like React, Vue, or Next.js, you often encounter the command npm run dev. This command is pivotal for developers as it initiates the development server, enabling live reloading, hot module replacement,
3 min read
`;
$(commentSectionTemplate).insertBefore(".article--recommended");
}
loadComments();
});
});
function loadComments() {
if ($("iframe[id*='discuss-iframe']").length top_of_element && top_of_screen articleRecommendedTop && top_of_screen articleRecommendedBottom)) {
if (!isfollowingApiCall) {
isfollowingApiCall = true;
setTimeout(function(){
if (loginData && loginData.isLoggedIn) {
if (loginData.userName !== $('#followAuthor').val()) {
is_following();
} else {
$('.profileCard-profile-picture').css('background-color', '#E7E7E7');
}
} else {
$('.follow-btn').removeClass('hideIt');
}
}, 3000);
}
}
});
}
$(".accordion-header").click(function() {
var arrowIcon = $(this).find('.bottom-arrow-icon');
arrowIcon.toggleClass('rotate180');
});
});
window.isReportArticle = false;
function report_article(){
if (!loginData || !loginData.isLoggedIn) {
const loginModalButton = $('.login-modal-btn')
if (loginModalButton.length) {
loginModalButton.click();
}
return;
}
if(!window.isReportArticle){
//to add loader
$('.report-loader').addClass('spinner');
jQuery('#report_modal_content').load(gfgSiteUrl+'wp-content/themes/iconic-one/report-modal.php', {
PRACTICE_API_URL: practiceAPIURL,
PRACTICE_URL:practiceURL
},function(responseTxt, statusTxt, xhr){
if(statusTxt == "error"){
alert("Error: " + xhr.status + ": " + xhr.statusText);
}
});
}else{
window.scrollTo({ top: 0, behavior: 'smooth' });
$("#report_modal_content").show();
}
}
function closeShareModal() {
const shareOption = document.querySelector('[data-gfg-action="share-article"]');
shareOption.classList.remove("hover_share_menu");
let shareModal = document.querySelector(".hover__share-modal-container");
shareModal && shareModal.remove();
}
function openShareModal() {
closeShareModal(); // Remove existing modal if any
let shareModal = document.querySelector(".three_dot_dropdown_share");
shareModal.appendChild(Object.assign(document.createElement("div"), { className: "hover__share-modal-container" }));
document.querySelector(".hover__share-modal-container").append(
Object.assign(document.createElement('div'), { className: "share__modal" }),
);
document.querySelector(".share__modal").append(Object.assign(document.createElement('h1'), { className: "share__modal-heading" }, { textContent: "Share to" }));
const socialOptions = ["LinkedIn", "WhatsApp","Twitter", "Copy Link"];
socialOptions.forEach((socialOption) => {
const socialContainer = Object.assign(document.createElement('div'), { className: "social__container" });
const icon = Object.assign(document.createElement("div"), { className: `share__icon share__${socialOption.split(" ").join("")}-icon` });
const socialText = Object.assign(document.createElement("span"), { className: "share__option-text" }, { textContent: `${socialOption}` });
const shareLink = (socialOption === "Copy Link") ?
Object.assign(document.createElement('div'), { role: "button", className: "link-container CopyLink" }) :
Object.assign(document.createElement('a'), { className: "link-container" });
if (socialOption === "LinkedIn") {
shareLink.setAttribute('href', `https://www.linkedin.com/sharing/share-offsite/?url=${window.location.href}`);
shareLink.setAttribute('target', '_blank');
}
if (socialOption === "WhatsApp") {
shareLink.setAttribute('href', `https://api.whatsapp.com/send?text=${window.location.href}`);
shareLink.setAttribute('target', "_blank");
}
if (socialOption === "Twitter") {
shareLink.setAttribute('href', `https://twitter.com/intent/tweet?url=${window.location.href}`);
shareLink.setAttribute('target', "_blank");
}
shareLink.append(icon, socialText);
socialContainer.append(shareLink);
document.querySelector(".share__modal").appendChild(socialContainer);
//adding copy url functionality
if(socialOption === "Copy Link") {
shareLink.addEventListener("click", function() {
var tempInput = document.createElement("input");
tempInput.value = window.location.href;
document.body.appendChild(tempInput);
tempInput.select();
tempInput.setSelectionRange(0, 99999); // For mobile devices
document.execCommand('copy');
document.body.removeChild(tempInput);
this.querySelector(".share__option-text").textContent = "Copied"
})
}
});
// document.querySelector(".hover__share-modal-container").addEventListener("mouseover", () => document.querySelector('[data-gfg-action="share-article"]').classList.add("hover_share_menu"));
}
function toggleLikeElementVisibility(selector, show) {
document.querySelector(`.${selector}`).style.display = show ? "block" : "none";
}
function closeKebabMenu(){
document.getElementById("myDropdown").classList.toggle("show");
}