Introduction to Puppeteer

1. PUPPETEER
Headless Chrome Node API
By @islamzatary

2. What is Puppeteer
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.

3. Terms
DevTools Protocol
The Chrome DevTools Protocol allows for
tools to instrument, inspect, debug and
profile Chromium, Chrome and other
Blink-based browsers
Headless
It's a way to run the Chrome browser in a
headless environment. Essentially,
running Chrome without chrome!

4. What can I
do?
Generate screenshots and PDFs of
pages.
Crawling & generate pre-rendered
content (SSR).
Automate form submission, UI
testing, keyboard input, etc.
Capture a timeline trace of your
site to help diagnose performance
issues.
Test Chrome Extensions
Most things that you can do in the
browser can be done using Puppeteer!

5. Generate screenshots
and PDFs of pages.
Github Screenshots & PDF
Run the following script file:

6. Crawling & generate
pre-rendered content
(SSR).
Github Crawling
Run the following script file:

7. Automate form
submission, UI testing,
keyboard input, etc.
medium.com/datadriveninvestor/chirag-goel-changing-the-world-with-automation-31c7ba718555
Github Automation
Run the following script file:

8. Capture a timeline
trace of your site to
help diagnose
performance issues.
Github Official ChromeLab
Run the following script file:

9. Test Chrome
Extensions

10. My References
Official Website
https://pptr.dev/
https://www.youtube.com/watch?v=MbnATLCuKI4
Chrome DevTools Protocol
https://chromedevtools.github.io/devtools-protocol/
Headless
https://developers.google.com/web/updates/2017/04/headless-chrome
Github
https://github.com/islamzatary/puppeteer-session

11. Thank You
Email
islamzatary@gmail.com
Website
www.islamzatary.com