sokahh: testen von rich-web-ui (german)
Post on 16-Jul-2015
158 Views
Preview:
TRANSCRIPT
www.coremedia.com© CoreMedia | 2014-10-21 | 1
Softwerkskammer Hamburg
Testen von Rich-Web-UIsMark Michaelis
Kudos to Martti Jeenicke
© CoreMedia | 2014-10-21 | 3 www.coremedia.com
Dev@CoreMedia
Entwickler sind für QA verantwortlich
keine dedizierte QA-Abteilung
5 Topic-Teams
Git als VCS
Feature-Entwicklung auf Branches
© CoreMedia | 2014-10-21 | 4 www.coremedia.com
Dev@CoreMedia - Pipelines
verschiedene Pipeline-Patterns
pro Team ca. 4 Pipelines, jeweils mit UI-Tests:
Story-Merge-Pipeline
Single-Story-Pipeline
Fixes-Merge-Pipeline
Master-Pipeline
weiterhin:
Master-Pipeline
Release-Pipeline
© CoreMedia | 2014-10-21 | 7 www.coremedia.com
Anwendungsarchitektur
Studio-Server(WebApp)
Client (Browser)
ContentREST Service
Presentation
ExtJS
MVCRemoting
Backend Services
…Content Server
Search
AJAX Request
JSON
© CoreMedia | 2014-10-21 | 8 www.coremedia.com
Lebenszyklus
Versionen derzeit:
mehrere Versionen im Extended Support (bis zu RD 2005)
2 in Maintenance-Phase
Erstes Release Oktober 2012
Erstes Release September 2014
1 in Entwicklungs-Phase
© CoreMedia | 2014-10-21 | 10 www.coremedia.com
Technischer Rahmen
Test-Setup durch viele Applikationsschichten:
Content-Server
Search-Server
Web-Application-Server (Tomcat, Websphere)
Browser/UI
Selenium/WebDriver als Basis-Technologie
© CoreMedia | 2014-10-21 | 11 www.coremedia.com
Framework-Design Prinzipien
Simplicity
Bornto Fail
Succeed Fast
Reusable
Extensible
© CoreMedia | 2014-10-21 | 13 www.coremedia.com
Oben: Manuell reproduzierbare Tests
@Test
void scenario_document_change_updates_date() {
Reference<Document> doc = ref();
given_document_D_exists(doc);
given_document_D_is_opened(doc);
when_I_change_document_D(doc);
then_modification_date_of_document_D_is_updated(doc);
}
© CoreMedia | 2014-10-21 | 14 www.coremedia.com
Mitte: Warte-Patternfür Server als auch UI
@Test
void scenario_document_change_updates_date() {
Reference<Document> doc = ref();
given_document_D_exists(doc);
given_document_D_is_opened(doc);
when_I_change_document_D(doc);
then_modification_date_of_document_D_is_updated(doc);
}
searchServiceWrapper
.indexed(doc)
.waitUntil(is(true));
© CoreMedia | 2014-10-21 | 15 www.coremedia.com
Mitte: UI-WrapperVerwendung
@Test
void scenario_document_change_updates_date() {
Reference<Document> doc = ref();
given_document_D_exists(doc);
given_document_D_is_opened(doc);
when_I_change_document_D(doc);
then_modification_date_of_document_D_is_updated(doc);
}
@Inject DocumentPanel panel;
TextField field = panel.getTextField();
field.write(„lorem“);
panel.saveDocument();
© CoreMedia | 2014-10-21 | 16 www.coremedia.com
Mitte: UI-WraperEntwicklung
@Test
void scenario_document_change_updates_date() {
Reference<Document> doc = ref();
given_document_D_exists(doc);
given_document_D_is_opened(doc);
when_I_change_document_D(doc);
then_modification_date_of_document_D_is_updated(doc);
}
@Inject DocumentPanel panel;
TextField field = panel.getTextField();
field.write(„lorem“);
panel.saveDocument();
@ExtJSObject(id = „docPanel“)
DocumentPanel extends ExtPanel {
@FindByExtJS(itemId=„save“) Button saveButton;
saveDocument() {
saveButton.click();
}
© CoreMedia | 2014-10-21 | 17 www.coremedia.com
Unten: Generiertes JavaScriptCode, den keiner sieht…
self = Ext.getCmp(„panel“);
key = „itemId“; value = „save“;
btn = (self.find && self.find(key, value)[0])
|| (self.buttons
&& self.buttons.filter(
function(b){return b[key] && b[key]==value})[0])
|| (self.items
&& self.items.filter(key, value).get(0));
© CoreMedia | 2014-10-21 | 26 www.coremedia.com
Test-Pyramide (nach Mike Cohn)
UI
Service
Unit
Manual
© CoreMedia | 2014-10-21 | 27 www.coremedia.com
Test-Pyramide (nach Mike Cohn)
UI
Service
Unit
Manual
10000 JUnit
600 JooUnit
200 Integration
2000 System
600 UI-Tests
1 Team (von 5):
25 Einzeltests
5 Stories, 30 Steps
20 explorativ
© CoreMedia | 2014-10-21 | 29 www.coremedia.com
Infrastruktur – Das Grid
1 zentrales Se-Grid
Wartung durch eines der Topic-Teams(das Team mit dem größten Se-Know-How)
10 Xvfb+Firefox Nodes
8 IE Nodes basierend auf modern.ieKonzept angelehnt an conceptsandtraining/modernie_selenium
© CoreMedia | 2014-10-21 | 30 www.coremedia.com
Infrastruktur – Erfahrungen
Virtuelle Windows-Nodes mit rdesktop sind potentiell gefährlich
nur per Skript aufgesetzte Systeme schaffen Stabilität
Firefox + Xvfb läuft “wartungsfrei” seit vielen Monaten
© CoreMedia | 2014-10-21 | 31 www.coremedia.com
Infrastruktur – Firefox & Xvfb
Xvfb installieren
CentOS, required: libXfont und xorg-x11-fonts
Ubuntu, required: xfonts-*
alte Xvfb-Version (z. B. CentOS) benötigt Patch fürBug #337703
Openbox – benötigt, etwa um Fenster maximieren zu können
Optional: xwud, um auf Framebuffer-Images zugreifen zukönnen
gtk2-engines: Benötigt für Openbox, falls der FehlerXlib: extension "RANDR" missing on display ":105“
auftritt.
© CoreMedia | 2014-10-21 | 32 www.coremedia.com
function start_wm() {
openbox &
# remember PID
}
function start_selenium_node() {
start_wm
start_selenium # java –jar …, not in background!
kill_wm
}
function start_selenium_node() {
bash xvfb [options] xvfb_subcommand &
}
Infrastruktur – Firefox & XvfbSkript-Skizze
© CoreMedia | 2014-10-21 | 34 www.coremedia.com
Referenzen (1)
The Forgotten Layer of the Test Automation PyramidMike Cohn, 2009
TestPyramidMartin Fowler, 2012
WebDriver: Advanced Usage — Selenium Documentation, Explicit and Implicit Waits
Joalau. a. Referenzimplementierung Warte-Pattern
Jangaroou. a. JooUnit
© CoreMedia | 2014-10-21 | 35 www.coremedia.com
Referenzen (2)
conceptsandtraining/modernie_seleniummodern.ie VBox-VM-Setup
Modern.IE : Interoperabilität, Browser & Cross Platform Testing
© CoreMedia | 2014-10-21 | 36 www.coremedia.com
Weitere Informationen
SoCraTes 2014: Testing Rich-Web-UIMark Michaelis
Death to sleeps! Raise of Conditions! | MindsMark Michaelis
Selenium Server as Windows Service via NSSM | MindsMark Michaelis
Meetup Softwerkskammer HH: Collected Thoughts on Testing Pyramid | MindsMark Michaelis
The Calm after the Storm | MindsOlaf Kummer
Haste makes waste | MindsOlaf Kummer
Entwickler entdecken UI-TestingMark Michaelis, Testing Experience DE 4/2014, S. 12ff
© CoreMedia | 2014-10-21 | 38 www.coremedia.com
Erfahrung
UI-Tests sind heute deutlich weniger Thema in der Test-Ergebnis-Analyse
Analyse der Infrastruktur ist nicht mehr notwendig
keine „Heisenbugs“ mehr
Nichtsdestotrotz: Auch im jüngsten Sprint mussten wir Maßnahmen beschließen, um mit „Wacklern“ umzugehen.
(Zu)viel Investition in UI-Tests verführt:“Ich schreibe lieber einen UI-Test, als…” (Entwickler-Zitat)
© CoreMedia | 2014-10-21 | 39 www.coremedia.com
CONTENT | CONTEXT | CONVERSION
Mark Michaelisabout.me/michaelismark
top related