Skip to content
Skillpedia
General coding48k · #3922

puppeteer-skill

Lets your agent create scripts to automate web browsers. It can extract information from websites or generate PDF files. Useful for collecting web data or creating documents.

What it does

This tool generates code to automate tasks in web browsers. It can navigate websites, fill out forms, click buttons, and even take screenshots or save pages as PDFs.

When to use it

  • ✓When you want a bot to visit a website and collect information automatically.
  • ✓To fill out forms in bulk on a website.
  • ✓To turn a web page into a PDF file.

Example of what to ask your AI

“Create a script that opens the Wikipedia website, searches for 'cats', and saves the page as a PDF.”

Want more? Open the sections below.

How to use

The easiest way: copy the message below and paste it into Claude, ChatGPT, Cursor or any AI. It reads the skill and follows the instructions.

Skill link

https://github.com/sickn33/agentic-awesome-skills/blob/main/plugins/agentic-awesome-skills-claude/skills/puppeteer-skill/SKILL.md

Ready-to-paste message

Use this skill to help me: https://github.com/sickn33/agentic-awesome-skills/blob/main/plugins/agentic-awesome-skills-claude/skills/puppeteer-skill/SKILL.md Read the SKILL.md file at that link and follow its instructions for my task.
How it works

You describe the task you want to automate, and the tool generates code using a library called Puppeteer. This code is like a set of instructions for the browser to perform your requested actions.

Installation

Easiest way: copy the skill link and paste it into Claude, ChatGPT or Cursor asking it to follow the instructions.

In the terminal (Claude Code, Codex, Cursor), in your project folder:

npx skills add sickn33/agentic-awesome-skills --skill puppeteer-skill

Or download just the file:

curl -L https://raw.githubusercontent.com/sickn33/agentic-awesome-skills/main/plugins/agentic-awesome-skills-claude/skills/puppeteer-skill/SKILL.md -o SKILL.md
Technical content (original SKILL.md)

Original text by the author, straight from GitHub.

Puppeteer Automation Skill

When to Use

Use this skill when you need generates Puppeteer scripts for browser automation, scraping, and PDF generation. Triggers on: "Puppeteer", "headless Chrome", "page.goto", "scrape", "PDF generation".

Core Patterns

Basic Script

const puppeteer = require('puppeteer');

(async () => {
    const browser = await puppeteer.launch({ headless: 'new' });
    const page = await browser.newPage();
    await page.setViewport({ width: 1280, height: 720 });

    await page.goto('https://example.com', { waitUntil: 'networkidle0' });
    await page.type('#username', 'user@test.com');
    await page.type('#password', 'password123');
    await page.click('button[type="submit"]');
    await page.waitForNavigation({ waitUntil: 'networkidle0' });

    const title = await page.title();
    console.log('Title:', title);

    await browser.close();
})();

Wait Strategies

// Wait for selector
await page.waitForSelector('.result', { visible: true, timeout: 10000 });

// Wait for navigation
await Promise.all([
    page.waitForNavigation({ waitUntil: 'networkidle0' }),
    page.click('a.nav-link'),
]);

// Wait for function
await page.waitForFunction('document.querySelector(".count").innerText === "5"');

// Wait for network request
const response = await page.waitForResponse(resp =>
    resp.url().includes('/api/data') && resp.status() === 200
);

Screenshot & PDF

await page.screenshot({ path: 'screenshot.png', fullPage: true });
await page.pdf({ path: 'page.pdf', format: 'A4', printBackground: true });

Network Interception

await page.setRequestInterception(true);
page.on('request', request => {
    if (request.resourceType() === 'image') request.abort();
    else request.continue();
});

// Mock API
page.on('request', request => {
    if (request.url().includes('/api/data')) {
        request.respond({
            status: 200,
            contentType: 'application/json',
            body: JSON.stringify({ items: [] }),
        });
    } else request.continue();
});

TestMu AI Cloud

For full setup, capabilities, and shared capability reference, see reference/cloud-integration.md.

const capabilities = {
    browserName: 'Chrome', browserVersion: 'latest',
    'LT:Options': {
        platform: 'Windows 11', build: 'Puppeteer Build',
        user: process.env.LT_USERNAME, accessKey: process.env.LT_ACCESS_KEY,
    },
};

const browser = await puppeteer.connect({
    browserWSEndpoint: `wss://cdp.lambdatest.com/puppeteer?capabilities=${encodeURIComponent(JSON.stringify(capabilities))}`,
});

Quick Reference

Task Code
Launch headed puppeteer.launch({ headless: false })
Evaluate JS await page.evaluate(() => document.title)
Extract text await page.$eval('.el', el => el.textContent)
Extract all await page.$$eval('.items', els => els.map(e => e.textContent))
Set cookie await page.setCookie({ name: 'token', value: 'abc' })
Emulate device await page.emulate(puppeteer.devices['iPhone 12'])

Deep Patterns → reference/playbook.md

§ Section Lines
1 Production Setup & Configuration Launch options, Jest integration
2 Page Object Pattern BasePage, LoginPage, DashboardPage
3 Network Interception & Mocking Request mock, response capture
4 Wait Strategies DOM, network, custom conditions
5 Screenshots, PDF & Media Full page, clip, PDF, video
6 Authentication & Cookies API login, session save/restore
7 iFrame, Dialog & File Operations Upload, download, dialogs
8 Performance & Metrics Web Vitals, Lighthouse, coverage
9 Accessibility Testing axe-core integration
10 CI/CD Integration GitHub Actions, Docker
11 Debugging Quick-Reference 11 common problems
12 Best Practices Checklist 13 items

Limitations

  • Use this skill only when the task clearly matches its upstream source and local project context.
  • Verify commands, generated code, dependencies, credentials, and external service behavior before applying changes.
  • Do not treat examples as a substitute for environment-specific tests, security review, or user approval for destructive or costly actions.
FAQ

What is 'headless Chrome'?

It's a Chrome browser that runs without displaying a window on the screen, perfect for automation.

What does 'scraping' mean?

It's the process of automatically extracting data from websites.

Can I use this to log into websites?

Yes, the generated code can include steps to fill in usernames and passwords.

Details

Original description by the author

Generates Puppeteer scripts for browser automation, scraping, and PDF generation. Triggers on: "Puppeteer", "headless Chrome", "page.goto", "scrape", "PDF generation".

repo: sickn33/agentic-awesome-skills

Popularity

GitHub stars
48k
Ranking position
#3922
License
MIT
Updated
10/15/2026

Is this skill useful?

0

Sign in to vote.

Comments

  • …

More skills from this repository

Similar skills