erstelle Screenshots von Webseiten mit puppeteer

puppeteer ist ein mächtiges Tool zur Automatisierung vom Chrome-Browser.

Die meisten Dinge, die du im Browser erledigst, kannst du mit diesem Tool realisieren.

Dazu gehören z.B.:

  • Screenshots/PDFs von Webseiten erstellen
  • Informationen von Webseiten auslesen und abspeichern
  • Eingaben per Maus oder Tastatur senden
  • umfangreiche Tests der Benutzeroberfläche
  • und vieles mehr

Ich greife auf dieses Tool zurück, um automatisiert Screenshots von meinen PWA’s für Google Play oder den Microsoft Store zu erstellen.

Dazu habe ich bereits ein Projekt auf Github veröffentlicht.

Auf dieses gehe ich hier näher ein.

Voraussetzungen

  • Node.js
    • puppeteer
    • fs
    • del

Installation

Installiere Node.js (https://nodejs.org)

Umgebung

git clone https://github.com/robertsaupe/node-screenshots.git
cd node-screenshots/
npm i

Einstieg

Editiere die Datei example.js oder erstelle eine neue.

Anschließend kannst du die Datei starten:

node example.js

Die Screenshots befinden sich anschließend im Ordner ./screenshots

Fazit

Um eine PWA in einen Store zu bringen, ist einiges nötig.

Ich werde bestimmt in naher Zukunft einen Artikel dazu schreiben.

Ein wichtiger Teil sind die Screenshots.

Dabei werden Dateiformate und Dimensionen teils vorgeschrieben.

Diese per Hand zu erstellen ist sehr aufwändig und eine Automatisierung liegt nahe und nimmt einen diese Arbeit ab.