General Discussion
General discussion on using Twist including questions and tips
Post
We have been trying to get Twist to work with our SmartGWT user interfaces. We were never able to get anything working with Sahi.
Recently our search has led us to how SmartGWT initially suggests doing automated unit testing. In the SmartGWT download there is a Selenium directory that provides a couple of extensions that can be used to lookup SmartGWT ids. I can get this working with SeleniumIDE and I can record my tests from there.
The problem is that I do not know how to add the file needed to be "seen" by the Selenium running in Twist.
There are plenty of articles for how to do it in Selenium RC, but I don't know how to do it here.
Here is an article for how this is done in RC:
http://seleniumhq.org/docs/08_user_extensions.html
We really like your product and the approach to testing, but we really need some help on this issue (being able to access SmartGWT ids) if we are going to be able to continue to use Twist.
Comment
Hi, As you would know SmartGWT has different ways of handling/rendering HTML UI elements. The problem for a Functional tool, thereby is to identify an element consistently using some form of accessor. Usually, to help testing on browser, users either have specific IDs programatically set or use specific unique-and-possibly non-existent css class.
That would be the best and sustainable way to test. If for some reason, you can't do that, then consider the following approach.
Note: this works over the example site, and has not gone through the rigor of being tested across platforms, browsers etc.
SmartGWT has a locator called "scLocator" which can identify an element consistently. Its like a XPath locator, but translates to a SmartGWT element.
Using SmartGWT "AutoTest.getElement(<scLocator>)" it is possible to automate browser element actions, attributes etc.
The following example is done with Twist 2.3.1 with Selenium2 (WebDriver) 2.12 on Firefox 8, Chome 15.0.
- Create a java class within your test project's src folder, like com.<orgname>.<project>.tests
<code>
import java.util.Collections;
import java.util.List;
import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.SearchContext;
import org.openqa.selenium.WebElement;
public class SmartGWT {
public static By locator(final String sclocator) {
if (sclocator == null) {
throw new IllegalArgumentException("Cannot find elements with a null id attribute.");
}
return new By() {
@Override
public List<WebElement> findElements(SearchContext context) {
return Collections.<WebElement>emptyList();
}
@Override
public WebElement findElement(SearchContext context) {
JavascriptExecutor executor = (JavascriptExecutor) context;
return (WebElement) executor.executeScript("return AutoTest.getElement(arguments[0]);", sclocator);
}
};
}
}
</code>
- Now from any Twist test step, you can call the following to get hold of the element using the custom "SmartGWT.By" class. Consider this
<code>
browser.get("http://www.smartclient.com/smartgwt/showcase/#menus_category_treebinding");
browser.findElement(SmartGWT.locator("//TreeGrid[ID=\"isc_SideNavTree_1\"]/body/row[nodeTitle=Appearance||53]/col[fieldName=nodeTitle||0]")).click();
browser.findElement(SmartGWT.locator("//IMenuButton[ID=\"isc_IMenuButton_1\"]/icon")).click();
</code>
HTH
Thanks and regards
Also, you can refer to Sanjiv Jivan's blog for more information: http://www.jroller.com/sjivan/entry/smart_gwt_2_2_released
You can generate the sclocator from Smart GWT developer console.
This is great info. Thank you!
Is there anyway to reproduce the solution above in the other Selenium driver option? I believe it is closer to what is used with the Selenium IDE which is what we have been working with recently.
What about with Sahi? Is there a way to get to the scLocator using that driver?
You mean with older Selenium 0.9.2 version? I would suggest not, as the apis and dependencies are quite old. Also the older Selenium is provided just to assist old Selenium users opportunity to migrate to new Selenium2.
Using Sahi, yes, we can get hold of the element using the "scLocator". However identification challenges for "scLocator" would be the same.
We will investigate this further and let you know in a few days. Btw, would you be ok, recording and identifying the "scLocator" on Firefox only? Your tests should run with "scLocator" on other browsers.
regards
I have the example you sent me working in Twist. We will trying to use this to test our applications now. Thank you very much for this. This version of Selenium is the driver we have the least experience with, but if we have something that works for accessing those ids that will be great.
To answer your question, yes we only care about FireFox for this project.
Thank you for looking into the Sahi access to the scLocators for us. I appreciate the help. We could use it right now!
Hi, We have had some success identifying the smartGWT locator, but unfortunately we found it to be still non-deterministic in many cases.
1. Create a custom profile for firefox.
* from command prompt you can launch firefox and create a custom profile. e.g. for windows type:> firefox.exe -profilemanager
2. Install Firebug as a plugin onto that profile.
3. Create a Twist project with Selenium2 as a driver. Edit the project properties (project->properties->Twist Properties->Selenium2), and in the configuration editor set the path of the profile against "Browser Profile". Now whenever you record/execute a scenario, twist will launch firefox with that profile.
4. I would advice recording test steps as granualar as possible to start, so that you can identify which element you are working with and how.
So for a step to record, do the normal recording, which will generate typical Selenium2 script. You will need to modify the script in Twist as mentioned in above post example. After recording the necessary interaction (do one at a time), open firebug for the same page.
Inspect and identify the element using firebug. Once identified, go to firebug's HTML tab, right click on the DOM element, and select "copy XPATH".
In the console area, type in the following code to identify scLocator:
[code]
var elementXPath = "/html/body/div[3]/div/div[2]/div/div/div/div/div/div[3]/div/div/table/tbody[2]/tr[3]/td/div/nobr/table/tbody/tr/td[3]/nobr";
var domElement = document.evaluate(elementXPath, document, null, XPathResult.ANY_TYPE, null).iterateNext();
var elementScLocator = null;
if (domElement) {
elementScLocator = window.isc.AutoTest.getLocator(domElement);
}
[/code]
NOTE: The above code snippet will give you the scLocator. The above is an example for "http://www.smartclient.com/smartgwt/showcase/#featured_complete_app" and identifying the left menu item "Smart GWT MVC".
5. You will of course need to go back to Twist editor and edit the locator accessor as I explained earlier.
I hope this helps you to a certain extent. But this is still non-deterministic. I have tried with SeleniumIDE and haven't been very successful for all types of SmartGWT examples. For example clicking a comboBox and selecting an option using scLocator.
We will investigate further and will update the same thread as and when we discover something.
If you would like us to take you through the process and need help, I would advice creating a support ticket, and we can explain things over Webex, if you would like.
Thanks and regards