Selenium - Webanwendungen testen

Selenium IDE ist ein kostenloser WEB-Recorder zum Aufnehmen und Abspielen von Browseraktivitäten und eignet sich zum Automatisieren von wiederkehrenden Webabläufen.
- Selenium kann praktisch alles aufnehmen, was ein Anwender mit einem Browser anstellen kann:
Klicken auf Links, Texteingabe in Formularfelder, Abschicken von Formularen usw... - Die Aufnahmen können gespeichert und automatisiert abgespielt werden.
- Zusätzlich kann Selenium Inhalte von Webseiten prüfen, ob z.Bsp. ein bestimmter Text enthalten ist.
Das Selenium Einsatzgebiet reicht vom automatischen Löschen des Spammailordners beim Mailprovider bis zum Testen komplexer Webanwendungen. Gerade nach Fertigstellung einer größeren Webanwendung folgt meist ein mühsames Wechselspiel zwischen Testen, Fehler beseitigen, nochmal Testen, usw. Zeichnet man die Tests beim ersten Mal auf, dann können bei jeder neuen Softwareauslieferung die Tests "augenschonend" automatisiert ablaufen.
Zur Installation sind folgende Schritte notwendig:
- Die Selenium IDE ist ein Firefox-AddOn.
Also wird zum Anwenden der Firefox-Browser benötigt und kein Internet Explorer. - Die Firefox Add-OnSelenium IDE downloaden und per "drag and drop" in die AddOns des Firefox ablegen.
Zu beachten sind die Versionshinweise, also welche Selenium Version zu welcher Firefox Version paßt. - Firefox starten und im Menü "Extras" die "Selenium IDE" anwählen und das Tool läuft.
Hilfreich ist, den Firefox zu verkleinern und Selenium optisch neben den Browser zu legen.
Beispiel
Nach dem Wort "Tastenkombinationen" googeln und die Ergebnisseite auf das Vorhandensein von "selenium" prüfen.
1.) Aufnahme:
Firefox | Selenium |
---|---|
Firefox starten und im Menü "Extras" die Selenium IDE anklicken. | Selenium startet, der rote Aufnahmeknopf ist an. |
In Adressleiste "www.google.de" eingeben und absenden. | |
"tastenkombinationen" ins Google-Suchfeld eingeben und Tab-Taste drücken, um das Suchfeld zu verlassen. |
Speichert die Eingabe als "type/q/tastenkombinationen". |
Auf den Button "Google-Suche" klicken. | Speichert den Klick als "clickAndWait/btnG". |
Auf der Google-Ergebnisseite mit der linken Maustaste ein "tastenkombinationen" markieren, mit der rechten Maustaste die Markierung anklicken und im sich öffnenden Kontextmenü "VerifyTextPresent Tastenkombinationen" auswählen. | Speichert den Test als "verifyTextPresent/Tastenkombinationen". |
Auf den roten Knopf klicken und die Aufzeichnung ist beendet. |
2.) Aufnahme abspielen:
Selenium |
---|
Auf den grünen Abspielpfeil für "test case" klicken und der aufgezeichnete Test läuft einmal durch. Alle Schritte des Tests sollten grün sein. |
3.) Fehler einbauen und Aufnahme abspielen:
Selenium |
---|
Zeile mit "verifyTextPresent Tastenkombinationen" anklicken, unten im Target das "Tastenkombinationen" auf "Tastenkombinationen123" ändern. |
Auf den grünen Abspielpfeil für "test case" klicken und der aufgezeichnete Test läuft einmal durch. Die Zeile mit dem "verifyTextPresent Tastenkombinationen" sollte rot angezeigt werden, weil "Tastenkombinationen123" nicht auf der Google Seite gefunden wird. |
Testfall und TestSuite
Ein mit Selenium aufgezeichnter Testfall wird standardmäßig als HTML-Source aufgezeichnet und kann als HTML-Datei abgespeichert werden.
Mehrere gespeicherte Testfälle können über eine zentrale HTML-Datei verlinkt und somit zu einer TestSuite zusammengefasst und in einem Rutsch abgespielt werden.
Beispiel für einen von Selenium aufgezeichneten HTML-Testfall, der nach "tastenkombinationen" googelt und einen Treffer auf der Zielseite prüft:
<?xml version="1.0" encoding="UTF-8"?> ... <table cellpadding="1" cellspacing="1" border="1"> <tr> <td>open</td> <td>http://www.google.de/</td> <td></td> </tr> <tr> <td>type</td> <td>q</td> <td>tastenkombinationen</td> </tr> <tr> <td>clickAndWait</td> <td>btnG</td> <td></td> </tr> <tr> <td>verifyTextPresent</td> <td>tastenkombinationen</td> <td></td> </tr> </table> </body> </html>
Testfall als "Test Case" speichern (Bsp: test1.html).
- Tests "für den Hausgebrauch" als HTML-Dateien speichern.
- Jeder Einzelschritt eines Tests ist anwählbar und läßt sich in der Table- oder Source-Ansicht verändern.
So kann man "test1.html" laden, mit einem Editor verändern und als "test2.html" speichern. - Mehrere Testfälle können zu einer TestSuite zusammengefaßt werden.
<html> <body> <table> <tr><td>Test Suite</td></tr> <tr><td><a href="testfall1.html">Test 1</a></td></tr> <tr><td><a href="testfall2.html">Test 2</a></td></tr> </table> </body> </html>
Diese TestSuite-HTML-Datei in Selenium als Test-Suite öffnen (Open Test Suite) und über "play test suite" ablaufen lassen.
Prüfungen
Mit Selenium-Checks können Zustände einer Webanwendung geprüft werden (Werte von Formularfeldern, das Vorhandensein von Texten, die URL der aktuellen Seite usw.). Das Editieren der Prüfungen (Kombination aus Command, Target und Value) kann in der Sichtweise "Table" (Grundeinstellung) oder "Source" erfolgen. Abhängig von den Einstellungen unter "Options/Format" werden Sourcen in HTML, Java, PHP usw. angezeigt.
Das Ansprechen eines HTML-Ziels (Target) erfolgt über Elementname ("xtest" bei <input name="xtest">), Id ("ytest" bei <td id="ytest">), DOM (document.forms['formularname'].test), XPath (//img[@alt='alternativtext']) oder Attributname(@type='submit').
Ob ein Test nach einem Fehler abgebrochen werden soll wird über die Modi "assert" (Test abbrechen) und "verify" (Test nicht abbrechen) gesteuert. In der folgenden Übersicht werden hauptsächlich verify-Prüfungen erläutert. Für den assert-Modus einfach im Kommando das führende "verify" gegen "assert" tauschen.
Prüfungen:
Beschreibung | Command | Target | Value |
---|---|---|---|
URL prüfen | verifyLocation | http://www.google.de/ | |
Werte einer Selectbox gegen kommaseparierte Liste prüfen (Keine unnötigen Leerzeichen nach Kommas!) |
verifySelectOptions | automarken | vw,opel,bmw |
Titel einer Seite prüfen (Bsp: <title>Google...) |
verifyTitle | ||
Text im Formularfeld prüfen (Bsp: <input type="text" name="eingabe"...) |
verifyValue | eingabe | tastenkombinationen |
Text eines Elements prüfen (Bsp: <h1>Überschrift</h1>) |
verifyText | //h1 | Überschrift |
Attributwert eines Elements prüfen (Bsp: <h1 align="center") |
verifyAttribute | //h1@align | center |
Prüfen, ob Text irgendwo auf der Seite vorkommt (Bsp: <p>hallo und willkommen...) |
verifyTextPresent | willkommen | |
Prüfen, ob ein Element auf der Seite vorhanden ist (Bsp: <input type="submit" value="Absenden">) |
verifyElementPresent | //input[@type='submit'] | |
Prüfen, ob Text in einer Tabellenzelle vorhanden ist (Syntax: Tabellenname.Zeile.Spalte, beginnend mit 0) |
verifyTable | myTable.1.6 Hamburg | |
Prüft, ob ein Element vorhanden und sichtbar ist (Bsp: <h1 id="Ueberschrift" style="visibility:hidden">) |
verifyVisible | Ueberschrift | |
Prüft, ob ein Element editierbar ist (Bsp: <input type="text" name="test" disabled>) |
verifyEditable | //input[@name='test'] |
Weitere Beispiele
Angenommen, man hat ein Formular mit zwei Eingabefeldern (eingabe1, eingabe2), einem Ergebnisfeld (ergebnis) und einem Additionsbutton (plus), dann könnte ein Test als HTML-Source folgendermaßen aussehen:
Command | Target | Value | Beschreibung |
---|---|---|---|
type | eingabe1 | 1 | 1 in "eingabe1" eingegeben |
type | eingabe2 | 1 | 1 in "eingabe2" eingegeben |
click | plus | "plus" angeklickt | |
verifyValue | ergebnis | 2 | Wert in "ergebnis" per Maus markiert und im Kontextmenü "verifyValue ergebnis 2" ausgewählt |
Obiges Beispiel erweitert um eine Javascript-Prüfung:
Command | Target | Value | Beschreibung |
---|---|---|---|
type | eingabe1 | 1 | |
type | eingabe2 | 1 | |
click | plus | ||
verifyValue | ergebnis | 2 | |
storeValue | ergebnis | varErgebnis | Inhalt von "ergebnis" in der Variablen "varErgebnis" speichern |
verifyEval | javascript{1+1} | ${varErgebnis} | JavaScript-Berechnung (1+1) mit dem gespeicherten Ergebnis in "varErgebnis" vergleichen |
Weitere Beispiele:
Command | Target | Value | Beschreibung |
---|---|---|---|
open | file:///D:/seleniumtest.html | HTML-Testdokument öffnen. | |
type | //input[@type='text'] | aaa | In ein Inputfeld ohne "name" oder "id" den Wert "aaa" eingegeben (XPath). |
type | //form[@id='formId']/input[2] | bbb | In ein zweites Inputfeld ohne "name" oder "id" den Wert "bbb" eingeben (XPath). |
type | iId | ccc | In ein Inputfeld mit Name="iName" und Id "iId" den Wert "ccc" eingeben. Selenium bevorzugt Id. |
select | pizzaId | label=Pizza Salami | Aus Selectbox die Option mit dem Text "Pizza Salami" auswählen. |
click | bezahlen | Aus mehreren Radio-Buttons mit dem Namen "bezahlen" den ersten wählen. | |
click | //input[@name='Zahlmethode' and @value='Visa'] | Aus mehreren Radio-Buttons den mit dem Namen "bezahlen" und dem Value "Visa" wählen. | |
click | zutat | Aus mehreren Check-Boxen mit dem Namen "zutat" den ersten wählen. | |
click | //input[@name='zutat' and @value='pilze'] | Aus mehreren Check-Boxen die mit dem Namen "zutat" und dem Value "pilze" wählen. | |
open storeText open verifyText |
/page1 element_id_1 /page2 element_id_2 |
test1 ${test1} |
Zwei Werte von verschiedenen Web-Seiten vergleichen: 1. Seite öffnen Ersten Wert speichern in test1 2. Seite öffnen Zweiten Wert lesen/vergleichen mit gespeichertem Wert |
Zum Homepage von Selenium.