Electron
Electron är ett ramverk för att bygga skrivbordsapplikationer med JavaScript, HTML och CSS. Genom att bädda in Chromium och Node.js i sin binärfil låter Electron dig behålla en JavaScript-kodbas och skapa plattformsoberoende appar som fungerar på Windows, macOS och Linux — ingen erfarenhet av inbyggd utveckling krävs.
WebdriverIO tillhandahåller en integrerad tjänst som förenklar interaktionen med din Electron-app och gör testningen mycket enkel. Fördelarna med att använda WebdriverIO för att testa Electron-applikationer är:
- 🚗 automatisk konfiguration av nödvändig Chromedriver
- 📦 automatisk sökvägsdetektion av din Electron-applikation - stöder Electron Forge och Electron Builder
- 🧩 åtkomst till Electron-API:er i dina tester
- 🕵️ mockning av Electron-API:er via ett Vitest-liknande API
Du behöver bara några enkla steg för att komma igång. Titta på denna enkla steg-för-steg-introduktion från WebdriverIO YouTube-kanalen:
Eller följ guiden i följande avsnitt.
Komma igång
För att starta ett nytt WebdriverIO-projekt, kör:
npm create wdio@latest ./
En installationsguide kommer att vägleda dig genom processen. Se till att välja "Desktop Testing - of Electron Applications" när den frågar vilken typ av testning du vill göra. Ange därefter sökvägen till din kompilerade Electron-applikation, t.ex. ./dist
, behåll sedan standardinställningarna eller ändra efter dina preferenser.
Konfigurationsguiden kommer att installera alla nödvändiga paket och skapa en wdio.conf.js
eller wdio.conf.ts
med den nödvändiga konfigurationen för att testa din applikation. Om du går med på att automatiskt generera några testfiler kan du köra ditt första test via npm run wdio
.
Manuell konfiguration
Om du redan använder WebdriverIO i ditt projekt kan du hoppa över installationsguiden och bara lägga till följande beroenden:
npm install --save-dev wdio-electron-service
Sedan kan du använda följande konfiguration:
// wdio.conf.ts
export const config: WebdriverIO.Config = {
// ...
services: [['electron', {
appEntryPoint: './path/to/bundled/electron/main.bundle.js',
appArgs: [/** ... */],
}]]
}
Det var allt 🎉
Lär dig mer om hur du konfigurerar Electron Service, hur du mockar Electron-API:er och hur du kommer åt Electron-API:er.