What is Puppeteer?

Short overview of Chrome team developed Node library which provides a high-level API to control headless Chrome over the DevTools Protocol
17 October 2017   4821

Puppeteer is a Node library which provides a high-level API to control headless Chrome over the DevTools Protocol. It can also be configured to use full (non-headless) Chrome.

What can it do? 

Most things that you can do manually in the browser can be done using Puppeteer! Here are a few examples to get you started:

  • Generate screenshots and PDFs of pages.
  • Crawl a SPA and generate pre-rendered content (i.e. "SSR").
  • Scrape content from websites.
  • Automate form submission, UI testing, keyboard input, etc.
  • Create an up-to-date, automated testing environment. Run your tests directly in the latest version of Chrome using the latest JavaScript and browser features.
  • Capture a timeline trace of your site to help diagnose performance issues. 

The goals of the project are simple:

  • Provide a slim, canonical library that highlights the capabilities of the DevTools Protocol.
  • Provide a reference implementation for similar testing libraries. Eventually, these other frameworks could adopt Puppeteer as their foundational layer.
  • Grow the adoption of headless/automated browser testing.
  • Help dogfood new DevTools Protocol features...and catch bugs!
  • Learn more about the pain points of automated browser testing and help fill those gaps.

Project is maintained by Chrome DevTools team. Learn more at GitHub and try it out on official website.  

Frontend News Digest 14 - 20.09

20 September 2019   140

Greetings! I hope your week went great! Here's new Frontend news digest.

In this digest, beginners can learn about CSS Grid, skilled coders may learn about, for example, what's new in Chrome 77 for developers, difference between axion and fetch() API and many other stuff.

Guides

Good overview on grips with Grid.

  • How to Easily Reuse Components Across Projects and Repositories

A tutorial on building, collaborating and distributing over components to create different projects.

  • Preview your Vue or React components using JSDoc

Guide on creating and publishing your Vue app documents

Article

It’ll only be a couple of years before we reach Chrome 100 and it seems Firefox wants a piece of the action :-) Firefox’s release cadence will be moving from approx 6-8 weeks per version to just 4 from Firefox 71 onward.

Chrome 77 is rolling out to users now. Here, Pete LePage dives in to what’s new for developers in this latest version.

  • Javascript Overcomes Java as The Most Popular Programming Language of 2019

Well, cool news for all frontenders, is suppose =)

  • CSV & Excel to JSON in JavaScript

Ajax & Fetch can help you with that, learn how exactly.

  • Source-maps could be revealing your private project files

Article on a possible vulnerability, beware!

  • Axios or fetch(): Which should you use?

Article, which is written to give you the better understanding of both APIs.