XPath vs CSS selectors
XPath jämfört med CSS-selector
Both XPath and CSS selectors are used for element identification in many test automation tools.
This is a comparison between them.
Både XPath och CSS-selectorer används för att identifiera element i samband med testautomatisering, och båda metoderna stöds av de många verktyg.
Detta är en jämförelse mellan dessa.
Både CSS-selectorer och XPath identifierar noder i ett träd genom dess hierarki, tagnamn och olika filter för attributvärden och annat.
Both CSS selectors and XPaths are used to identify tree nodes by their hierarchy, tag name, and different search filters for attributes and statuses.
They are highly useful in GUI test automation, and both are widely used. However, sometimes you wonder which one would be best to use. Hence, the table below.
De är väldigt användbara i test-automatisering mot grafiska användargränssnitt, men ibland börjar man fundera över vilken som är bäst. Därav nedanstående tabell.
| Feature | Funktion | XPath | CSS selector | CSS-selector |
|---|---|---|---|---|
| Can identify element by tag name | Kan identifera element med tag-namn | |||
| Can identify element by attribute name existance | Kan identifera element med att vissa attribut existerar | |||
| Can identify element by exact attribute value | Kan identifera element med exakta attributvärden | |||
| Can identify element by part of attribute value | Kan identifera element med del av attributvärde | |||
| Can identify element by combinations of attributes | Kan identifera element med kombinationer av attribut | |||
| Can use parent element as search base to limit search scope | Kan använda föräldraelement som bas för att begränsa sökningen | |||
| Can use ancestor element as search base to limit search scope | Kan använda förfaderelement som bas för att begränsa sökningen | |||
| Can use sibbling element as search base to limit search scope | Kan använda syskonelement som bas för att begränsa sökningen | |||
| Can use child element as search base to limit search scope | Kan använda barnelement som bas för att begränsa sökningen | |||
| Can use descendant element as search base to limit search scope | Kan använda ättlingselement som bas för att begränsa sökningen | |||
| Can use exact element text as search filter | Kan använda exakt element-text som sökfilter | |||
| Can use part of element text as search filter | Kan använda del av element-text som sökfilter | |||
| Can use start of element text as search filter | Kan början av element-text som sökfilter | |||
| Can use end of element text as search filter | Kan slutet av element-text som sökfilter | |||
| Can use negated search filter | Kan negera sökfilter | |||
| Can use any element order number as search criteria | Kan använda valfritt elementets ordningsnummer som sökkriteria | |||
| Can pick first matching element | Kan använda första matchande elementet | |||
| Can pick last matching element (out of the box) | Kan använda sista matchande elementet (utan kodning) | |||
| Works on more technologies than web (like e.g. XML, or WPF) | Fungerar på andra tekniker än webb (t.ex. XML el. WPF) | |||
| Kan identifiera attributvärde som nod | Could identify attribute value as node | |||
| Could use element state (non-attribute, e.g. hover, focus) for identification | Kan använda element-status (icke-attributbaserade, t.ex. hover, focus) som identifikation | |||
| Could state alternative element identification strings | Kan ange alternativa element-identifierings-strängar | |||
| Used natively in JavaScript, that the web is made with | Används utan omsvep i JavaScript, som webben är uppbyggd av | |||
| Could be used in URL (limited) | Kan användas i URL (begränsat) | |||
| Could be used directly from browser console | Kan användas direkt från webbläsarens konsolfönster | |||
| Could be used to directly fetch the text of an element | Kan användas för att hämta element-text direkt | |||
| Supports both absolute and relative search paths | Stöder både absolut och relativa sökvägar |
It should be noted that XPath also could be useful for other types of test automation, for example API testing with XML based data. However, this article mainly deals with GUI based automation.
Det kan vara värt att tänka på att XPath också kan vara användbart vid andra typer av testautomatisering, t.ex. vid API-testning med XML som databärare. Denna artikel är dock skriven utifrån GUI-perspektivet.
Speed concerns
Snabbhetsd-aspekten
Generally speaking the CSS selector is a quicker way to identify elements. This rarely poses a big problem since XPath also is really quick, but at least it should be noted.
Generellt sett är CSS-selectorer snabbare än XPath på att identifiera element. Det är dock sällan som detta är ett stort problem eftersom XPath också är väldigt snabb, men det bör i vart fall nämnas.