Upload
sebastian-neubert
View
268
Download
4
Tags:
Embed Size (px)
Citation preview
Codeception. VisualCeption.$I->see(“Automatisierte funktionale Tests“);
Nils Langner. Sebastian Neubert. Torsten Franz.Stand 5. Februar 2015
Codeception. VisualCeption.
$I->amOnPage(2);
Motivation.1
Anforderungen.2
Die Lösung(en).3
4 Stolperfallen + Fazit.
Agenda.
5 VisualCeption.
6 Einsatz bei G+J.
0 Vorstellung.
Codeception. VisualCeption.
$I->amOnPage(3);
Wir.
Codeception. VisualCeption.
$I->amOnPage(4);
Das kleine Wir.
Nils Langner
Head of Quality Management G + J Digital Products GmbH Studium Informatik (B.Sc.) an der Universität Freiburg
ISTQB zertifiziert
Softwareprojekte im Open-Source-Bereich
Autor für diverse Fachmagazine
Sprecher auf Konferenzen
Buchautor
Twitter: @phphatesme
Gewinner Malwettbewerb Grundschule Haag i. OB
Codeception. VisualCeption.
$I->amOnPage(5);
Das kleine Wir.
Torsten Franz
Quality Manager G + J Digital Products GmbH Sparkassenkaufmann
ISTQB zertifiziert
Ubuntu Member (Projekt: ubuntuusers.de)
Autor für diverse Fachmagazine
Sprecher auf Konferenzen
Twitter: @toddyfranz
Seepferdchen in der dritten Klasse
Codeception. VisualCeption.
$I->amOnPage(6);
Das kleine Wir.
Sebastian Neubert
Quality Manager G + J Digital Products GmbH Studium eBusiness (B.Sc.) an der BTU Cottbus
ISTQB zertifiziert
leidenschaftlicher Webentwickler
angehender Author für Fachmagazine und Sprecher auf Konferenzen
Volleyballtrainer
Twitter: @testcontroller
Gewinner des Amateurfeldes beim Silpion IT-Kickertunier 2015
Codeception. VisualCeption.
$I->amOnPage(7);
Das große Wir.
Gruner + JahrDie Gruner + Jahr GmbH & Co KG ist eine Tochter der Bertelsmann SE & Co. KGaA.
500 Magazine und digitale Angebote Stern, Financial Times Deutschland, Eltern, Brigitte, Gala, Essen&Trinken, Neon, Business Punk, Nido, Beef, Häuser, Schöner Wohnen, GEO, Capital, Börse Online, chefkoch, roomido, Flow
Mitarbeiter 10.819, in Hamburg circa 3.000 (Stand: 2013)
In der G+J Digital Products GmbH sind sämtliche Digital-Aktivitäten der Markenwebsites und deren Mobile- Auftritte von Gruner + Jahr gebündelt.
Das große Wir.
Codeception. VisualCeption.
$I->amOnPage(9);
Das große Wir.
Gruner + Jahr
Ganz toll.
Super nett.
Eine Menge Magazine.
Viel Spaß.
Yeah!
Codeception. VisualCeption.
$I->amOnPage(10);
Disclaimer.
BDD „Beim Behavior Driven Development (verhaltensgetriebene Softwareentwicklung) werden
während der Anforderungsanalyse die Aufgaben, Ziele und Ergebnisse der Software derart textuell festgehalten, dass diese später automatisiert auf ihre korrekte Implementierung getestet werden können.“
Und das macht Codeception?
Immer das richtige Tool und die eierlegende Wollmichsau?
Codeception. VisualCeption.
$I->amOnPage(11);
Motivation.
Anfang 2014:
Bisher kein funktionierendes Testtool für automatisierte anwendungsfallbasierten Systemtests im Einsatz.
Legacy-Projekte (und Drupal) schwer zu unit-testen.
Manuelles Testen ist teuer
dauert lange
passiert in der Durchführung sehr spät.
und …
Codeception. VisualCeption.
$I->amOnPage(12);
Ist ****** langweilig.
Codeception. VisualCeption.
$I->amOnPage(13);
Anforderungen.
Überprüfung von funktionalen Anforderungen.
Kontinuierliche Ausführung.
Integration in das bestehende CI.
Allgemein verständlich (natürlichsprachlich).
Stabile Tests.
Soll beim Entwickeln Spaß machen.
Codeception. VisualCeption.
$I->amOnPage(14);
Lean Testing.
Risikobasiertes Testen.
„So viel wie nötig, so wenig wie möglich.“
Abhängig von der Eintrittswahrscheinlichkeit und den Kosten. (Risikomatrix)
Codeception. VisualCeption.
$I->amOnPage(15);
Hackathon. Die Lösungen.
Selenium IDE
Selenium PHPUnit
Selenium Junit
CasperJS
Codeception
Code geht schnell kaputt. Nicht mit
Selenium2 kompatibel.Syntax fies. IDE-
Unterstützung nicht optimal.
Wir können gar kein Java?!
IDE-Unterstützung nicht vorhanden. JavaScript kann
komplex werden.Perfekt. (1)
(1) In der Theorie!
Codeception. VisualCeption.
$I->amOnPage(16);
Die Lösung.
CodeceptionProjektseite: http://codeception.com/
Sourcecode: https://github.com/Codeception/Codeception
Codeception. VisualCeption.
$I->amOnPage(17);
Codeception.
Selenium WebDriver integration
Elements matched by name, CSS, XPath
Symfony2, Laravel4, Yii, Zend Framework integration
PageObjects and StepObjects included
BDD-style readable tests
Powered by PHPUnit
API testing: REST,SOAP,XML-RPC
Facebook API testing
Data Cleanup after each run
HTML, XML, TAP, JSON reports
CodeCoverage and Remote CodeCoverage
Codeception. VisualCeption.
$I->amOnPage(18);
Codeception.
Selenium-WebDriver-Integration
Firefox, Chrome, PhantomJS, Internet Explorer, Safari
Selendroid, iOS-Driver
PHPBrowser-Integration
Elements matched by name, CSS, XPath
BDD-style readable tests
XML reports
Leicht erweiterbar
Sauberer Code
Hohe Aktivität auf GitHub
Schnelle Reaktion auf Fragen
PHP
Codeception. VisualCeption.
$I->amOnPage(19);
Codeception.
Codeception. VisualCeption.
$I->amOnPage(20);
Die Lösung. Aufbau.
Bamboo
Lokal
ELA
Chrome
Chromedriver
Webdriver
Entwickler-Rechner
Tests
Codeception Selenium Server
Bamboo
Chrome
Chromedriver
Webdriver
Selenium-Rechner
Tests
Codeception Selenium Server
Codeception. VisualCeption.
$I->amOnPage(21);
Die Lösung. Module.
Codeception. VisualCeption.
$I->amOnPage(22);
Die Lösung. ExecuteJS.
Codeception. VisualCeption.
$I->amOnPage(23);
Die Lösung. Best Practice.
Problem: Meine Tests gehen relativ häufig kaputt!
Lösung:
a) Verwendung von Html-Ids. Bei der Entwicklung drauf achten.
b) Wahl der richtigen Selektoren (xPath, CSS, Name, Label).
c) Verwendung von Konstanten in Codeception. Page Objects.
Problem: Meine Daten sind nicht stabil!
Lösung:
a) Fixtures, Fixtures, Fixtures!
b) Stabile Elemente auf (Live-)Seite suchen.
Problem: So viele Tests, so wenig Struktur.
• Lösung:
a) Test-Code ist Source-Code und sollte den gleichen Regeln folgen.
b) Aufräumen nach jedem Testdurchlauf. SetUp, TearDown.
c) Komponenten.
d) Steps.
Codeception. VisualCeption.
$I->amOnPage(24);
Heiliger Gral?
Codeception
Codeception. VisualCeption.
$I->amOnPage(25);
Heiliger Gral?
Nein!
cydonna / photocase.com
Codeception. VisualCeption.
$I->amOnPage(26);
Stolperfallen.
Wait
Problem Bei Interaktionen mit Browsern ist es nötig manchmal zu warten bis etwas geschieht.
Die Zeitdauer lässt sich aber nur „schätzen“, da das Neuladen einer Seite unterschiedlich lang dauern kann.
Lösung Mit Zeitintervallen zu Arbeiten ist schwierig im Selenium Umfeld.
Es sollte mit Interaktionen gearbeitet werden.
Beispiele
$I->waitForElement("#FrontendCommentType_body", "10 ");
$I->waitForElementNotVisible("#dialog > div.narrow", "10 ");
Codeception. VisualCeption.
$I->amOnPage(27);
Stolperfallen.
File-Upload
Problem Bei Remote-Rechner muss ein File, welches im Testfall hochgeladen werden soll, ankommen.
Lösung Übergabe der Datei durch Funktion in einem zentralen Modul.
Beispielaufruf
$I->attachFileRemote('//input[@id="FrontendDesignDilemmaType_file"]', $remoteFileName);
Codeception. VisualCeption.
$I->amOnPage(28);
Stolperfallen.
Werbung
Problem Werbeflächen können die Klick- bzw. Schreibbereich überdecken.
Lösung Verhalten herstellen, dass entweder die Anwendung immer Werbeblöcke ausspielt und diese im
Test berücksichtigt werden oder die Werbung ausschalten.
Oder Werbeblocker installieren.
Codeception. VisualCeption.
$I->amOnPage(29);
Stolperfallen.
Umgang mit mehr als einem Fenster
Problem In manchen Webanwendungen bewegt der Anwender sich nicht nur in einem Fenster, sondern
arbeitet auch in einem zweiten.
Lösung Bevor zwischen Fenster gesprungen wird, muss man sicher stellen, dass alle Fenster einen
Namen haben, sonst müssen sie per JavaScript benannt werden.
Beispielaufruf
$I->executeJS('old_window_name = window.name; window.name="mainwindow"');
$I->switchToWindow(‘newwindow');
$I->switchToWindow('mainwindow');
$I->executeJS(‘window.name=old_window_name');
Codeception. VisualCeption.
$I->amOnPage(30);
Fazit.
Codeception. VisualCeption.
$I->amOnPage(31);
Fazit.
Tool fühlt sich nach anfänglichen Problemen gut an.
Browserkompatibilität prüfen zu aufwändig.
Das Tool ist erweiterbar.
Codeception. VisualCeption.
$I->amOnPage(32);
VisualCeption.
Codeception. VisualCeption.
$I->amOnPage(33);
VisualCeption.
Motivation Codeception ist einfach für Entwickler, aber schwer für ProductOwner
Layout-Tests
ohne großen Aufwand testen
„Viele Asserts auf einmal“ z.B. Hauptnavigation oder ganzer Footer
Codeception. VisualCeption.
$I->amOnPage(34);
VisualCeption. Behat.
Gherkin Language for Product Owner
Feature: ls
In order to see the directory structure
As a UNIX user
I need to be able to list the current directory's contents
Scenario:
Given I am in a directory "test"
And I have a file named "foo"
And I have a file named "bar"
When I run "ls"
Then I should get:
"""
bar
foo
"""
Codeception. VisualCeption.
$I->amOnPage(35);
VisualCeption. Codeception.
VisualCeption for Product Owner
alle Vorteile von Codeception PHP, Codevervollständigung, Syntax-Highlight, Lesbar
<?php
class FeatureCest
{
public function myFeatureShouldLookGood(WebGuy $I)
{
$I->amOnUrl(‚http://www.stern.de‘);
$I->amOnPage(‚/newFeature‘);
$I->dontSeeVisualChanges(‚newFeature‘, ‚#featureID‘);
}
}
Codeception. VisualCeption.
$I->amOnPage(36);
VisualCeption.
Visuelle Regressionstests (Definition nicht verfügbar)
Vergleich von Bildern
Codeception. VisualCeption.
$I->amOnPage(37);
VisualCeption 1.0
Codeception Modul, OpenSource, von G+J, in PHP
Wie funktioniert es? $I->seeVisualChanges();
$I->dontSeeVisualChanges();
Inject JQuery
Auswahl von Containern durch CSS-Selektoren oder XPath
exclude von Inhalten (ebenfalls durch CSS-Selektoren oder XPath)
Angabe von einer Standardabweichung zum Referenzbild „deviation“
Requirements: Imagick, Codeception mit Webdriver Modul
Codeception. VisualCeption.
$I->amOnPage(38);
VisualCeption 2.0
Integration in ein CI System (Bamboo, Jenkins)
HTML Reports mit einfacher Kontrolle über Templates
Codeception. VisualCeption.
$I->amOnPage(39);
VisualCeption 3.0
Liste von URL:DIV-Container
Web-Oberfläche
https://github.com/DigitalProducts/codeception-module-visualception
Codeception. VisualCeption.
$I->amOnPage(40);
Einsatz bei G+J.
roomido.com
livingathome.de
eltern.de
stern.de
…
Codeception. VisualCeption.
$I->amOnPage(41);
Danke.