Testing your Electron apps with ChromeDriver

Use Spectron to easily test your Electron apps.

Presented at http://www.meetup.com/Bay-Area-Electron-User-Group/events/226320491

https://github.com/kevinsawicki/spectron

http://electron.atom.io

Transcript

1. TESTING YOUR ELECTRON APPS WITH CHROMEDRIVER
2. KEVIN SAWICKI GITHUB @KEVINSAWICKI
3. WHAT IS ELECTRON?
4. ELECTRON ▸Write apps in JavaScript, HTML, CSS ▸Run apps on Mac, Windows, Linux ▸Built on Chromium and Node.js ▸Free and open source ▸http://electron.atom.io
5. 5 main process menu tray dialog window window window renderer process node DOM renderer process renderer process node DOM node DOM node ipc
6. “TYPICAL” ELECTRON APP TESTING
8. PROS ▸Quick to run ▸Easy to inspect ▸Easy to debug ▸Easy to mock
9. CONS ▸Complex setup and teardown ▸Leaks happens between tests ▸Main process code goes untested ▸Hard to test launch behavior
10. 10 main process menu tray dialog window window window renderer process node DOM renderer process renderer process node DOM node DOM node ipc
11. WHAT IS YOUR BIGGEST FEAR?
14. YOUR APP HAS A BUG & CAN’T AUTO UPDATE
15. WEBDRIVER AND CHROMEDRIVER
16. WEBDRIVER IS AN OPEN SOURCE TOOL FOR AUTOMATED TESTING OF WEBAPPS ACROSS MANY BROWSERS. ChromeDriver Docs WHAT IS WEBDRIVER?
17. CHROMEDRIVER IS A STANDALONE SERVER WHICH IMPLEMENTS WEBDRIVER'S WIRE PROTOCOL FOR CHROMIUM. ChromeDriver Docs WHAT IS CHROMEDRIVER?
18. WEBDRIVERIO ▸WebDriver bindings for NodeJS ▸Promise based ▸Easily extensible ▸npm install webdriverio ▸http://webdriver.io
20. ELECTRON MEETS CHROMEDRIVER
21. ELECTRON CHROMEDRIVER ▸Electron specific ChromeDriver build ▸Officially supported ▸npm install electron-chromedriver ▸github.com/atom/electron/releases
22. PROS ▸Easily test launch behavior ▸Doesn’t pollute application state ▸Main process code is tested
23. CONS ▸Slower to run ▸Hard to debug and occasionally flaky ▸Tests are harder to write
24. INTRODUCING SPECTRON
25. SPECTRON ▸Test harness for Electron ChromeDriver ▸Easily setup and teardown apps ▸Commands for BrowserWindow APIs ▸Test framework agnostic
26. SPECTRON ▸npm install --save-dev spectron ▸Tested on Mac, Windows, and Linux ▸Tested on AppVeyor and Travis CI ▸github.com/kevinsawicki/spectron
27. EXAMPLE USING MOCHA & CHAI
31. DEMO
32. HELP WANTED
33. HELP WANTED ▸Additional Electron commands ▸Make it less flaky ▸Docs and examples ▸Is it useful?