Generare in automatico gli script per Puppeteer? Con un'estensione di Chrome!
Attraverso un'estensione di Google Chrome, è possibile registrare gli eventi del browser e convertirli in uno script per Puppeteer. Scopri come!
L'utilizzo di Puppeteer implica la conoscenza delle basi di sviluppo in Node.JS. Tuttavia, esiste un'estensione di Google Chrome che offre un supporto molto interessante.
L'estensione in questione è Headless Recorder, la quale permette di registrare gli eventi del browser convertendoli automaticamente in uno script utilizzabile su Puppeteer.
Nel video che segue faccio vedere un esempio in cui apro la homepage di Amazon, clicco su "Accetta i cookie" ed utilizzo lo script generato dall'estensione direttamente nella console attraverso Puppeteer.
Come vedi, aggiungo l'esecuzione di due screenshot (uno della pagina completa e l'altro dell'area Above The Fold) nello script per generare un output visualizzabile.
La seguente riga di codice produce uno screenshot della pagina completa all'interno di una directory specifica.
await page.screenshot({ path: 'ss/ss-2.png', fullPage: true });
L'estensione permette, comunque, di generare anche il codice relativo allo screenshot della pagina completa o di un'area, aggiungendo due voci al menù contestuale di Chrome (con relativi shortcut):
- Take a Screenshot
- Take a Screenshot Clipped
Conclusioni
Headless Recorder non ti permetterà di utilizzare Puppeteer in tutte le sue funzionalità senza saper sviluppare (fortunatamente), ma facilita la generazione della struttura di base e il tracciamento dei selettori.
Oltre allo script per la browser automation con Puppeteer, l'estensione fa lo stesso anche per Playwright, un'altra libreria (sempre in Node.JS) utile ad automatizzare Chromium, Firefox e WebKit via API.