In Selenium you are able to locate the HTML-elements in different ways. Detailed informations about this topic are available here. Per default Selenium uses the id-Locator, when no explicit locator prefix is defined. In my project we have the requirement to locate the elements by the label text, because the id- and name-attributes are generated. The goal of the custom locator is to get the value from the id-attribute of the following field:
1<label for="IDGEN123456789">Foo-Label</label> 2<input id="IDGEN123456789" value="test"/>
Daniel has already written a great article about some tipps and tricks using locators and similar topics in this theme. In this blog post I want to show how you can add your own location strategy to Selenium. The main reason for me was, that XPath-expressions in test cases are not very maintainable and I normally don’t want to see something like this in a test case to locate an element:
1xpath=//label[contains(.,'Foo-Label')]/@for
I don’t want to start a discussion here between using CSS or XPath as location techniques. In this example we are using XPath. After some research I found this useful user-extension. That’s nearly all that we need to locate the elements. But lets start at the beginning.
Creating the locator strategy for Selenium
First, you have to create a JavaScript-File (user-extension.js) which contains the location strategy:
1PageBot.prototype.locateElementByLabelText = function(labelText, inDocument) {
2[...]
3}
The prefix is very important, because all locateElementBy* methods are added as locator-strategies. For the source code please have a look at this page.
To use it in your Selenium tests you have to add this user-extension.js-File to the Server:
1java -cp selenium-server-standalone-2.16.1.jar org.openqa.selenium.server.SeleniumServer -port 4455 -singlewindow -userExtensions "user-extensions.js"
After these steps you are able to use the new expression in your test case:
1labeltext=Foo-Label
Selenium IDE
But It would also be very cool, when it would be possible to use this locator in the Selenium IDE. No problem 🙂 For this feature the implementation of a LocatorBuilder is needed:
1LocatorBuilders.add('labeltext', function(e) {
2 if (e.id) {
3 var locator = "xpath=" + "//" + "label[@for='" + e.id +"']" + "/span/text()";
4 var label = this.findElement(locator);
5 return "labeltext=" + label.textContent;
6 }
7 return null;
8 });
When you want to use the locator as the default strategy add following line to the script:
1LocatorBuilders.order = ['labeltext', 'id', 'link', 'name', 'dom:name', 'xpath:link', 'xpath:img', 'xpath:attributes', 'xpath:href', 'dom:index', 'xpath:position'];
The above scripts should be saved in a separate file (e.g. user-extension-ide.js), because it is only needed in the Selenium IDE.
Installation in Selenium IDE
Just add the scripts in the options menu like on the following screenshot.
Usage
Andreas gives you here some tipps about debugging XPath and CSS locators. In this screencast he shows also the usage of the “Find”-Button to locate elements. When you have installed the scripts above, then you are able to use this useful feature also with the new locator “labeltext=”
In combination with the Selenium IDE Extension for Robot Framework it is possible to record the test cases and export it into a readable format:
1Select From List labeltext=Label1 Test 2Input Text labeltext=Label2 AnotherValue 3Textfield Should Contain labeltext=Label3 Test
The source code of this example is available on Github .
Was this post helpful?
More articles
fromDennis Schulte
5.4.2015 Your job at codecentric?
Jobs
Agile Developer und Consultant (w/d/m)
Alle Standorte
Gemeinsam bessere Projekte umsetzen.
Wir helfen deinem Unternehmen.
Du stehst vor einer großen IT-Herausforderung? Wir sorgen für eine maßgeschneiderte Unterstützung. Informiere dich jetzt.
Hilf uns, noch besser zu werden.
Wir sind immer auf der Suche nach neuen Talenten. Auch für dich ist die passende Stelle dabei.
Blog author
Dennis Schulte
Do you still have questions? Just send me a message.
Do you still have questions? Just send me a message.