Slides zur Session zum Thema »Cross Browser Testing mit DalekJS« vom 6. Webmontag Kassel. Eine »interaktive« Version der Slides findet ihr hier: http://michael-kuehnel.de/presentations/dalekjs/ Inklusive animierter GIFs ; ]

1. DALEKJS
EXTERMINATE ALL BUGS!

2. MICHAEL KÜHNEL
macht Internet seit Netscape 4.7
Frontend Developer bei Micromata
Twitter: @mkuehnel
Web: michael-kuehnel.de

3. DALEKJS?

4. „BROWSER FERNSTEUERUNG“
Aktionen
URLs aufrufen, Elemente anklicken, Formularfelder füllen,
Screenshots erstellen
Prüfen
Resultat ←→ Erwartung

5. INSTALLATION
LINUX, MAC, WINDOWS – NODE.JS ✌
Siehe Getting started

6. DIE API
test.open('http://foo.baz')
.click('.bar')
.waitForElement('#baz')
.assert.title().is('fooBar', 'Yeah')
.done();

7. ACTIONS
DIE STEUERUNG DES BROWSERS
Komplette Liste → Dokumentation.

8. ACTIONS
.open()
.open('http://dalekjs.com')
.click()
.click('#logout')
.type()
.type('#MyElement', 'Mein Text')
.waitForElement()
.waitForElement('#result')
.screenshot()
test.screenshot('my/folder/my_file.png');

9. ASSERTIONS
ÜBERPRÜFUNG UNSERER ERWARTUNGEN
Komplette Liste → Dokumentation.

10. ASSERTIONS
.exists()
Prüft das Vorhandensein eines DOM-Elementes.
.assert.exists('#Logout', 'Logout Button ist vorhanden')
.text()
Prüft den Textinhalt eines Elementes.
.assert.text('h1', 'Erwartete Headline', 'Headline ist korrekt')
.val()
Prüft den Value eines Formular-Elementes.
.assert.val('#mySelect', '', 'Default Value ist korrekt')

11. DER ERSTE TEST

12. LOGIN STATUS
module.exports = {
'Check Login status': function (test) {
test
.open('https://github.com/')
.waitForElement('.header')
.assert.exists('.header-logged-out', 'User ist ausgeloggt')
.done();
}
};

13. DEMO

14. TESTS ZUM
NACHSPIELEN

15. CROSS-BROWSER-TESTS

16. GELÖST ÜBER DALEKJS PLUGINS
# Install
npm install dalek-browser-chrome --save-dev
# Execute
dalek tests/firstTests.js -b chrome

17. IE TESTING

18. REMOTE TEST EXECUTION #FTW ❤
VMs → Download
Setup → Screencast
Broken → Aber im nächsten Bugfix Release behoben

19. ALTERNATIVE REPORTS
GELÖST ÜBER DALEKJS PLUGINS
HTML, JSON, jUnit XML
Siehe Docs

20. FAZIT

21. 1. Frühe Version – Trotzdem Spass
2. Super einfach Test zu schreiben
3. Alternative: CasperJS

22. LINKS
http://webkrauts.de/artikel/2014/cross-browser-testing-mit-dalekjs
http://dalekjs.com
https://github.com/dalekjs
https://github.com/mischah/dalekjs-demo
https://github.com/micromata/dalekjs-testsuite

23. EXTERMINATED!
FRAGEN?