Att hitta det perfekta verktyget för testautomatisering för din programvara är ingen lätt uppgift.
Vi måste först och främst inse att varje programvara är unik och har sitt eget sätt att levereras. Vilken typ av automatiseringsverktyg som behövs för att anpassas till programvarans testlivscykel beror i hög grad på dess resurser, team och strategi. Det finns alltså inget sådant som det bästa verktyget för testautomatisering.
Det finns dock en rad populära verktyg som är på tapeten just nu och som är utformade för att enkelt kunna anpassas till ditt projekt. Några exempel på populära automatiseringsverktyg som används i både enkla och komplexa system för att ge tillförlitlig och noggrann testkvalitet är Selenium, Appium, Katalon Studio, Cypress och Playwright.
Idag ska vi sätta strålkastarljuset på ett av de nyaste automatiseringsverktygen som har visat sig vara en succé: Playwright.
Precis som alla testare stötte jag på vissa utmaningar i mina tidigare projekt som bromsade upp automatiseringen av frontend-testningen. Att skriva alltför mycket standardkod för att konfigurera webbläsarna, långsamma testkörningar, opålitliga väntetider, svårigheter att hitta selektorer och instabila tester, för att nämna några. Det var först när en av mina fantastiska kollegor introducerade mig för Playwright som automatiseringsvärlden blev mycket ljusare för mig.
Playwright är ett öppen källkodsramverk för end-to-end-testautomatisering som har sitt ursprung i Puppeteer, vilket är baserat på Node.js och underhålls av Microsoft.
I den traditionella Selenium-arkitekturen skickas varje HTTP-förfrågan separat och får ett JSON-svar, vilket leder till en fram-och-tillbaka-kommunikation som saktar ner hela processen. Playwright använder däremot ett enda API.
Det använder en enda WebSocket för att kommunicera med alla drivrutiner. Det är därför Playwright visar sig vara ett av de snabbaste och enklaste automatiseringsramverken inom mjukvarutestning. Snabbt och enkelt = Playwright. Men hur exakt är det? Efter att ha läst den här artikeln kommer du att få en känsla för om detta ramverk är tillräckligt tillförlitligt för att användas med den mjukvara du arbetar med.
Ärligt talat var detta för mig det enklaste ramverket att konfigurera. Ett enda kommando räcker för att konfigurera din automatiseringsmiljö, och sedan kan du börja automatisera.
Några av anledningarna till att mjukvaruteam har bytt automatiseringsramverk till Playwright är att det stöder flera språk,såsomJavaScript, Java, Python och .NET C#. Dessutom stöds ett brett utbud av testkörare: Mocha, Jest, Jasmine och Cucumber. Det häftiga med att köra Playwright-tester är att det kör headless-webbläsare med en händelsestyrd arkitektur.
Playwright är kompatibelt med alla moderna operativsystem (Windows, Mac och Linux) och kräver följande:
Skapa en mapp i ditt operativsystem, till exempel LEARN-PLAYWRIGHT, och öppna mappen i VS Code. Kör projektets rotkatalog med följande kommando:
npm init playwright@latest
Så här ser mappstrukturen ut för ett typiskt Playwright-projekt. Du får en exempelstruktur för ett testprojekt med en enkel testfil som innehåller alla förutsättningar innan du skapar en testspecifikation. I följande exempel har jag valt TypeScript som språk, därför har filnamnen ändeleken .ts.
Filen `playwright.config.ts` innehåller avsnittet ”projects”, som specificerar den process som vi ska testa. Här kan du konfigurera webbläsaren, kontexten och sidfixturerna. Du kan ange alternativ globalt eller lokalt samt aktivera inspelning eller testinsamling.
Här är de webbläsare som körs som standard. Testerna körs i Chromium, Firefox och WebKit (Safari).
// playwright.config.ts
import { defineConfig, devices } from '@playwright/test';
export default defineConfig({
projects: [
{
name: 'chromium',
use: { ...devices['Desktop Chrome'] },
},
{
name: 'firefox',
användning: { ...enheter['Desktop Firefox'] },
},
{
name: 'webkit',
användning: { ...enheter['Safari för dator'] },
},
],
});
De exempel på tester som ska köras finns i filen example.spec.ts.
Playwright tillhandahåller en JSON-fil som använder ”test” som skript för att köra testerna.
Så här ser en standard-JSON-fil ut.
{
"name": "LEARN-PLAYWRIGHT",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Fel: inget test angivet\" && exit 1"
},
"nyckelord": [],
"author": "",
"license": "ISC",
"devDependencies": {
"@playwright/test": "^1.16.3"
}
}
Ett viktigt kännetecken för Playwright är att det som standard kör alla tester i headless-läge. För att ändra detta beteende använder du headless: false som startalternativ i konfigurationsfilen.
import { defineConfig } från '@playwright/test';
export default defineConfig({
use: {
headless: false,
viewport: { bredd: 1280, höjd: 720 },
ignoreHTTPSErrors: true,
video: 'on-first-retry',
},
});
Playwright är kompatibelt med alla moderna webbläsare, inklusive Microsoft Edge (Chromium), Apple Safari (med WebKit), Mozilla Firefox och Chrome. Som standardinställning kan flera tester köras parallellt. Detta är ytterligare en faktor som påskyndar exekveringstiden.
Kör ditt första exempeltest med kommandot nedan.
npx playwright test
Kommandot för att köra testerna är
npx playwright test --headed
Om du vill köra en headad webbläsare med npm-användaren:
npm run test -- --headed.
Om du vill köra ett enskilt projekt, till exempel Chromium, kan du använda kommandot
npx playwright test --project=chromium
Då körs testet endast i Chromium.
Under körningen väntar testernaautomatiskt tillskontrollerna är tillgängliga, så det finns inget behov av att lägga till extra väntetid för en åtgärd.
Eftersom vi testar tre olika webbläsare delar Playwright automatiskt upp testet i tre separata arbetsprocesser. När testkörningen är klar genereras resultaten i den här mappen som heter playwright report.
Som jag nämnde tidigare tar det inte lång tid att komma igång med att skriva testskript i Playwright, eftersom exemplet på en testfil redan ger dig ett överskådligt och strukturerat format. Du kan helt enkelt ersätta texten med dina egna skript för att komma igång. Senare kan du förbättra kodstrukturen för att göra den mer överskådlig och objektorienterad.
test.describe('navigera till webbplatsen', () => {
test('navigera till webbplats', async ({ page }) => {
// Gå till bas-URL
await page.goto('https://qestit.com/');
})
});
Använd metoden “page.waitForSelector()” för att vänta på att ett element ska visas på sidan. Denna metod tar en selektor som argument och returnerar ett löfte som uppfylls när elementet hittas. När du har identifierat selektorn för det element du vill interagera med kan du använda metoden ”page.click()” för att interagera med elementet.
När du kör i den inbyggda webbläsaren, anropa metodenpage.pause() från ditt skript. Att använda metodenpage.pause() är ett enkelt sätt att pausa körningen av Playwright-skriptet och inspektera sidan i utvecklarverktygen. Det öppnar också Playwright Inspector för att underlätta felsökningen.
Playwright är också välkänt för sin hantering av navigering mellan olika sidor, till exempel iframes och olika flikar. Detta är ett tillförlitligt sätt att verifiera att rätt innehåll visas på den aktuella platsen, vilket undviker falska positiva och negativa resultat.
Det handlar om att bryta ner det hela. Felsökningen blir mer användarvänlig genom att raderna bryts ner visuellt med Playwrights felsökningsverktyg. Lägg till brytpunkter, kör testet i felsökningsläge, så stannar det pågående testet vid brytpunkten och visar dig situationen. Playwright har ett strikt läge – så om det finns liknande selektorer avbryts testet och misslyckas några steg före det faktiska felet.
Codegen för testare är som GitHub Copilot för utvecklare. Det omvandlar dina användarinteraktioner till kod. Codegen är en kodgenerator som gör det möjligt för dig att omedelbart skapa dina testskript korrekt medan du utför åtgärderna i din webbläsare.
Om du till exempel vill automatisera ett testfall på en sida kör du kommandot:
npx playwright codegen qestit.com
Det innebär i princip att du slipper skriva skript och istället bara behöver klicka. När koden är klar kopierar du den och klistrar in den i din testklass. Detta påskyndar både implementeringen och körningen!
Med tillägget Playwright Test för VS Code behöver du inte ens skriva in kommandon. Detta tillägg förenklar identifieringen av selektorer genom att du bara håller muspekaren över elementet, varpå lokalisatorn skrivs åt dig. Allt du behöver göra är att klicka, trycka på Enter, kopiera och klistra in.
2. Gå till testfallet i din testutforskare
3. Klicka på ”pick locator”
4. Markera ”Visa webbläsare”
5. Håll muspekaren över det element du har svårt att hitta, klicka på det så visas lokalisatorn i din redigerare.
Playwright levereras som standard med många utmärkta rapporteringsmoduler, såsom List, Dot, Line, JSON, JUnit och HTML Reporters.
Kommandot för att hämta testrapporter är npx playwright show-report. Det visar en överskådlig rapport i en webbläsare där du kan expandera eller minimera varje steg för att se var felet inträffade om något test misslyckas.
Playwright skapar också spårningsfiler. Dessa är zip-filer som visar tidslinjen och de åtgärder som utförts under testet. Det är helt enkelt en DOM-ögonblicksbild (som du kan interagera med). När du nu kör kommandot för att visa rapporten får du din interaktiva rapport.
Spårningar körs normalt i en CI-miljö, men du kan även köra en spårning lokalt med
följande kommando:
npx playwright test --trace on
För att öppna rapporten kör du:
npx playwright show-report
Eftersom metoder för kontinuerlig integration (CI) har blivit populära kan Playwright enkelt integreras i CI/CD-pipelines i CI-verktyg. Playwright kan också integreras med Docker-miljön och Selenium Grid.
Playwright har fortfarande en relativt liten användargrupp. Det är inte lika komplext som andra ramverk för testautomatisering, vilket innebär att det kan finnas okända problem som ännu inte har upptäckts. Med tiden kommer dock dokumentationen av lösningar och åtgärder att utvecklas.
En annan nackdel är att det, till skillnad från exempelvis Cypress, inte stöder riktiga enheter för tester i mobila webbläsare, men däremot stöder emulatorer.
Playwright har en funktion för komponenttestning som ännu inte är helt stabil. Detta är ett pågående arbete. Ramverket har dock en aktiv och engagerad användargrupp som arbetar för att uppnå bästa möjliga förbättringar.
Flera IT-experter världen över har påpekat att testautomatisering håller på att bli en ”levande dokumentation” som är läsbar för både testare och viktiga tekniska intressenter. Den har förmågan att presentera de interaktiva processerna bakom kulisserna i ett system för både befintliga och nya teammedlemmar. Med andra ord är testskript och struktur utformade för att vara lätta att förstå och inte beroende av enskilda personer. Aspekter som underhållsbarhet och enkelhet kan utgöra en utmaning när det gäller mängden automatiserade tester.
Playwright spelar en viktig roll för att göra det enklare att visualisera vad som händer under testkörningen, vilket gör det interaktivt och värdefullt för testare och till och med utvecklare. Playwright kan vara ett utmärkt automatiseringsverktyg som är värt att använda i dina projekt, eftersom det ger en överskådlig presentation av testskript och, med hjälp av några av de användbara tilläggen som nämns ovan, kan spara dig minuter och till och med timmar av din testtid.
Prova det:https://playwright.dev/docs/intro