Puppeteer je knihovna uzlů js s otevřeným zdrojovým kódem, kterou lze použít pro nástroje pro škrábání webu. Lze jej také použít k provedení automatizace testů ve webových aplikacích. V dnešní době se využití Puppeteeru v automatizovaném prostoru pro testování softwaru rychle zvyšuje. Pro pochopení tutoriálu loutkáře jsou nutné základní znalosti příkazového řádku, Javascriptu a struktury HTML DOM. Celý výukový program je rozdělen do následujících článků.
Výukový program pro loutkáře
Výukový program Tosca č. 1: Loutkář - přehled
Tosca konzultace # 2: Proměnné prostředí loutkáře
Tosca konzultace # 3: Přehled škrábání webu Puppeteer a Puppeteer Test Automation
Tosca konzultace # 4: Nainstalujte si Puppeteer
Tosca konzultace # 5: Ukázka projektu Loutkář
V tomto výukovém programu pro loutkáře se dozvíte, jak nainstalovat Puppeteer s jeho závislostmi, jako je instalace NodeJs, instalace editoru pro Puppeteer atd. Po instalaci také vytvoříme a provedeme jeden ukázkový projekt Puppeteer.
Nainstalujte si Puppeteer
Chcete-li zahájit vývoj skriptů Puppeteer, musíme nainstalovat a nakonfigurovat níže uvedené komponenty -
1. Nainstalujte NodeJS
2. Nainstalujte editor
3. Nainstalujte Puppeteer
Nainstalujte NodeJS:
NodeJs je bezplatné prostředí serveru s otevřeným zdrojovým kódem, které lze spustit na různých platformách. Na straně serveru používá javascript. Puppeteer je jeden druh aplikace NodeJS. Prvním krokem nastavení Puppeteer je tedy instalace rámce NodeJS. Rámec NodeJS je k dispozici pro více platforem, včetně Windows, Ubuntu, macOS atd. V této souvislosti budeme pracovat na verzi pro 64bitový operační systém Windows. Kroky instalace NodeJS jsou -
Krok 1 # Stáhnout NodeJS: klikněte zde procházet odkaz ke stažení NodeJS. Zde si stáhneme 64bitový instalační program systému Windows (.mts).
Krok 2# Nainstalujte NodeJS: Po dokončení stahování musíme NodeJs nainstalovat poklepáním na soubor instalátoru (.msi). Během instalace musíme postupovat podle pokynů.
Krok 3# Ověřit NodeJS: Po dokončení instalace musíme otevřít příkazový řádek a zadat příkaz jako „uzel“. Pokud se zobrazují níže uvedené podrobnosti, je instalace správná. V případě, že se objeví nějaká chyba, znamená to, že instalace není správná.
Nainstalujte Editor pro Puppeteer:
Editor není nic jiného než nástroj, který nám pomáhá psát, kompilovat a spouštět naše kódy Puppeteer. K dispozici je mnoho nástrojů, které lze použít jako editor java kódu, mezi které patří Visual Studio Code, Note Pad ++, Edit Plus atd. Dokonce i my můžeme psát kód loutkáře ve výchozí aplikaci „Poznámkový blok“. V tomto „Instalujte loutkáře“ konzultace, budeme používat VSCode, protože je zdarma a snadno kompatibilní s aplikací NodeJS. VSCode není nic jiného než jedna součást vizuálního studia, která je k dispozici zdarma. Kroky k instalaci VSCode jsou –
Krok 1 # Stažení VSCode: klikněte zde otevřete odkaz ke stažení a stáhněte si požadovanou verzi instalačního programu VSCode podle operačního systému.
Krok 2 # Nainstalujte VSCode: Nainstalujte VSCode ze souboru instalačního programu v systému stejně jako jakýkoli jiný software. Během instalace pokračujte pouze doporučeným nastavením.
Krok 2 # Ověřte VSCode: Po dokončení instalace otevřete aplikaci a zkontrolujte, zda je správně nainstalována.
Nainstalujte balíčky Puppeteer:
Od verze v1.7.0 loutkáře obsahuje každé vydání méně než dva balíčky -
- balíček puppeteer-core
- balíček loutkářů
Obě verze Puppeteer lze nainstalovat pomocí příkazů konzoly. Příkazy k instalaci Puppeteer jsou -
Nainstalujte balíček Puppeteer-core: Je to kolekce knihovny Node JS vyvinutá v Javě. Má schopnost pracovat na protokolu devtools. Prohlížeč Chromium se během instalace balíčku puppeteer-core nestáhne. Programové rozhraní Puppeteer zcela pohání knihovnu loutkářů. Dalším důležitým omezením je, že funkce loutkáře nelze změnit změnou žádné z proměnných prostředí PUPPETEER_ *.
Příkaz instalace: npm install puppeteer-core
Poznámka: Nástroj Node JS je třeba nainstalovat před instalací balíčku puppeteer-core.
Nainstalujte si balíček produktů Puppeteer: Puppeteer je kompletní produkt vyvinutý společností Google pro ovládání prohlížečů Chrome. Jelikož se jedná o kompletní produktový balíček Puppeteer, stahují se během instalace nejnovější verze chromového prohlížeče. Poté je instalace řízena loutkářským jádrem. Je možné přizpůsobit funkce Puppeteer změnou proměnných prostředí PUPPETEER_ *.
Příkaz instalace: npm install loutkář
V tomto výukovém programu „Instalace Puppeteer“ budeme pracovat na instalaci balíčku Puppeteer, protože mezi těmito dvěma verzemi není mnoho rozdílů.
Ukázka projektu Loutkář
Puppeteer je kompatibilní jak s bezhlavým (bezhlavým), tak bezhlavým chromovaným prohlížečem. V případě bezhlavého se aktivity prohlížeče provádějí na pozadí, tj. Uživatelské rozhraní prohlížeče pro nás není viditelné. V jediném kroku je to (ovládání prohlížeče) jednodušší a jednodušší. To znamená, že totéž (ovládání prohlížečů) lze provést několika složitými kroky.
Kroky zapojené do ukázkového projektu Puppeteer jsou uvedeny níže -
Krok 1 # Vytvořte strukturu složek pro Sample Puppeteer Project: Na předdefinované cestě vytvořte ukázkový kořenový adresář s názvem „SampleProject“. Tento kořenový adresář bude fungovat jako ukázkový projekt loutkáře. Dále po otevření příkazového řádku musíme přejít do tohoto kořenového adresáře.
Krok 2 # Nainstalujte Puppeteer: Pomocí níže uvedeného příkazu můžeme nainstalovat celý balíček Puppeteer do kořenového adresáře. Tento příkaz v podstatě stáhne všechny open-source knihovny NodeJS v ukázkový projekt složku. Postup instalace trvá nějakou dobu na základě rychlosti sítě. Stáhne přibližně 350 MB dat. Po instalaci bude do ukázkové kořenové složky projektu Pupeteer vytvořena složka node_modules, která obsahuje různé komponenty loutkáře a soubor package-lock.json.
Krok 3 # Vytvořte ukázkový loutkářský skript: Nyní napíšeme ukázkový loutkářský skript, který vyvolá LambdaGeeks po každém kroku zobrazí zprávy konzoly a pořídí snímek obrazovky. V tomto příkladu bude na pozadí vyvolán bezhlavý chromový prohlížeč. Ukázkový loutkářský skript bude -
const puppeteer = require('loutkář'); //include Puppeteer Library puppeteer.launch({headless:true}).then(async browser => { const pageNew = wait browser.newPage(); // Spuštění browser console.log('Step1 - Open Browser'); / /Zobrazit zprávu čeká na stránkuNew .setViewport({ width: 1280, height: 800 }) wait pageNew .goto('https://techiescience.com/'); //Open LambdaGeeks //Capture Screenshot wait pageNew .screenshot({ path : 'screenshot_lambda.png' }); console.log('Krok2 – Procházení LambdaGeeks a pořízení snímku obrazovky'); wait browser.close(); console.log('Krok 3 – Prohlížeč uzavřen'); });Tento kód musí být uložen v kořenovém adresáři projektu Sample puppeteer s názvem souboru sample_script.js. V případě Puppeteer-core musíme na samém začátku scénáře zahrnout „puppeteer-core“ namísto „puppeteer“. U bezhlavého prohlížeče musíme nahradit kód “{headless:true}” with “{headless:false}”.
Krok4 # Proveďte ukázkový skript loutkáře: Ukázkový skript lze spustit z příkazového řádku pomocí níže uvedeného příkazu -
npm uzel sample_script.js
Po provedení bude snímek obrazovky zachycen a uložen v kořenovém adresáři jako „'screenshot_lambda.png”.
Nyní si ve webové aplikaci Amazon ukážeme další ukázkový skript Puppeteer. Tento skript provede níže uvedené kroky spolu s ověřením v každém kroku -
- Vyvolejte aplikaci Amazon.
- Prohledejte předdefinovanou knihu.
- Přidejte hledanou knihu do košíku.
- Otevřete košík a zkontrolujte, zda je kniha v košíku k dispozici.
- Pořiďte obrazovku a zavřete prohlížeč.
Projdeme pouze níže uvedeným skriptem. V dalším článku se podrobně seznámíme s různými kroky, které je třeba provést. Ukázkový skript je uveden níže -
/**
* @name Hledat na Amazonu
*/
const puppeteer = require('loutkář');
const reportPathDir = 'C:\\\\LambdaGeeks\\\\puppteer_proj_sample\\\\output\\\\';
const screenshotFile = 'screen1.png';
Snaž se {
(async () => {
\t//Vytvořte instanci objektu prohlížeče a stránky a přejděte na adresu URL
const browserWeb = wait puppeteer.launch({ headless: false });
const pageWeb = wait browserWeb.newPage()
wait pageWeb.setViewport({ šířka: 1280, výška: 800 });
čekat na stránkuWeb.goto('https://www.amazon.in/');
\t
\t//Zadejte kritéria amazon Search
\tlet searchBoxAmazon = čekat na stránkuWeb.waitForXPath("//*/input[@id='twotabsearchtextbox']",{ viditelné: true });
\tif (searchBoxAmazon === null)
\t{
\t\tconsole.log('Obrazovka Amazonu se nezobrazuje');
\t}
\telse{\t\t
\t\tawait searchBoxAmazon.type("Testovací kniha");
\t\tconsole.log('Vyhledávací kritéria byla zadána');
\t} \t\t
\t
\t//Kliknutí na tlačítko hledání
\tlet btnSearchAmazon = čekat na stránkuWeb.waitForXPath("//*/input[@id='nav-search-submit-button']",{ viditelné: true });
\tif (btnSearchAmazon === null)
\t{
\t\tconsole.log('Tlačítko Hledat se nezobrazuje');
\t}
\telse{
\t\tawait btnSearchAmazon.click();
\t\tconsole.log('Kliknutí na tlačítko hledání');
\t}\t
\t
\t//Klikněte na konkrétní výsledek hledání
\tlet myBookAmazon = wait pageWeb.waitForXPath("//*[contains(text(),'Selenium Testing Tools Cookbook Second Edition')]",{ viditelné: true })
\tif (myBookAmazon === null)
\t{
\t\tconsole.log('Kniha není dostupná');
\t}
\telse{
\t\tawait myBookAmazon.click();
\t\tconsole.log('Pro objednání klikněte na konkrétní knihu');
\t} \t
\t
\t// Zjistěte, zda se otevřela nová karta
\tconst pageTarget = pageWeb.target();
\tconst newTarget = wait browserWeb.waitForTarget(target => target.opener() === pageTarget);
\t//získáte nový objekt stránky:
\tconst page2 = čekat na newTarget.page();\t
\tawait page2.setViewport({ šířka: 1280, výška: 800 });
\t
\t//Přidat do košíku
\tlet addToCartAmazon = čekat na stránku2.waitForXPath("//*/input[@id='tlačítko-přidat-do-košíku']",{ viditelné: true });
\tif (addToCartAmazon === null)
\t{
\t\tconsole.log('Tlačítko Přidat do košíku není dostupné');
\t}
\telse{
\t\tconsole.log('Klikněte na tlačítko přidat do košíku');
\t\tawait addToCartAmazon.click();\t\t
\t} \t\t
\t//Ověřte proces přidání do košíku\t
\tlet successMessageAmazon = wait page2.waitForXPath("//*[contains(text(),'Přidáno do košíku')]",{ viditelné: true });
\tif (successMessageAmazon === null)
\t{
\t\tconsole.log('Položka není přidána do košíku');
\t}
\telse{
\t\tconsole.log('Položka byla úspěšně přidána do košíku');\t\t
\t} \t
\t
\t// Zachyťte číslo košíku
\tlet cartCountAmazon = wait page2.waitForXPath("//*/span[@id='nav-cart-count']",{ viditelné: true});
\tlet valueCount = čeká na stránku2.evaluate(el => el.textContent, cartCountAmazon)
\tconsole.log('Počet košíku: ' + valueCount);
\tcartCountAmazon.focus();
\tawait page2.screenshot({ cesta: screenshotFile });
\t
\tawait pageWeb.waitForTimeout(3000);
\twait page2.close();
\tawait pageWeb.close();
čekat browserWeb.close();
})()
} catch (e) {
console.log(e)
}Poznámka: V následujících článcích si vysvětlíme, jak postupovat při psaní skriptů.
Závěr:
V tomto úvodním článku o „Instalovat Puppeteer“ z „Výuky Puppeteer“ jsme vysvětlili podrobné kroky instalace různých balíčků Puppeteer od nuly. Nastavení loutkáře zahrnuje různé instalace komponent, jako je instalace NodeJs, instalace VSCode, instalace Puppeteer, vytvoření a spuštění ukázkového projektu Puppeteer. V dalším tutoriálu Puppeteer si vysvětlíme podrobné kroky k použití Puppeteeru jako nástroje pro škrábání webu. prosím klikněte zde číst z referenčního portálu.
Ahoj, jmenuji se K. Mondal, jsem spojen s přední organizací. Mám 12 a více let pracovních zkušeností napříč doménami, např. Vývoj aplikací, testování automatizace, IT konzultant. Velmi mě zajímá učení různých technologií. Jsem zde, abych splnil své aspirace a v současné době přispívám jako autor a vývojář webových stránek v LambdaGeeks.
Pojďme se připojit přes LinkedIn-