Jak zaznamenat akce na obrazovce jako loutkářský scénář

Puppeteer je bezhlavý Chrome s programovým rozhraním API a je to užitečný nástroj pro automatizaci chování uživatelů a komplexní testování.

Chrome můžete spustit a automatizovat pomocí několika řádků JavaScriptu (Node.js). Zahrnout puppeteer v závislostech vašeho projektu a použijte jej následovně.

// index.js
const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://www.stefanjudis.com');
  await page.screenshot({path: 'screenshot.png'});
  await browser.close();
})();

Těchto pár řádků spustí Chrome bez hlavy, přejděte na můj web a udělejte si snímek obrazovky. Někteří lidé si možná pamatují, jak bolestivé to bývalo automatizovat bezhlavý prohlížeč. Jsem ohromen, jak daleko jsme se dostali!

Můžete nahrávat skripty Puppeteer dodávané s Chrome 89! 🎉

Psaní scénářů je již vynikající, ale nechci nutně neustále sedět a psát vlastní scénář. DevTools Changelog pro Chrome 89 obsahoval vzrušující nový doplněk, díky kterému bude psaní skriptu Puppeteer snadnější. Vývojářské nástroje pro Chrome (od verze 89) budou zahrnovat experiment, který umožňuje tlačítko nahrávání skriptu Puppeteer! Můžete ji aktivovat v nastavení DevTools pod Experiments .

Po aktivaci najdete novou funkci nahrávání pod Sources v levé části panelu.

Níže si prohlédněte příklad ukazující, jak zaznamenat skript Puppeteer v Chrome Canary. 👇

Z této nové funkce jsem velmi nadšený, protože umožňuje hladké procesy zajišťování kvality. Lidé, kteří najdou chyby, vám nyní mohou poslat video a skript k reprodukci chyby. Skvělé!