Ext

HomeProductsSupportJobsCompanyBlogStore
HomeBlog

Testing Ext JS & Ext GWT Applications With Selenium

November 3, 2008 by Darrell Meyer

Overview

As developers we can create great software. Unfortunately, we usually introduce a few bugs along the way. Using a testing tool can ensure we catch the bugs and resolve them quickly.

There are many different approaches to testing. Some advocate writing the tests within the application, others suggest a separate testing environment entirely. There are merits to both these approaches. For this blog post, I’ve focused our attention on Selenium as both Ext JS and Ext GWT and benifit from this “black box” testing methodology.

Selenium provides a powerful mechanism to test your Ext applications. Selenium works by executing tests against your running application within the browser of your choice. Selenium tests emulate the way a user would interact with your application by executing JavaScript to simulate user actions. Selenium tests run as a form of “integration” tests as they execute against your running application.

Both Ext JS and Ext GWT applications can benefit from Selenium tests. In fact, with few exceptions, the tests created for one product should be interchangeable as both products produce the same DOM structure.

With GXT applications, GWT provides built in JUnit support. This provides a great way to test your application. However, these tests run only in host mode. Being able to test your compiled application in multiple browsers is important as some issues only appear within your compiled application.

In general, you create Selenium tests and then execute them in a variety of ways. This tutorial will demonstrate creating tests with Selenium IDE, a Firefox plugin, and creating tests within Java. Tests will be loaded and executed within the Selenium IDE, and Java JUnit tests will be executed using Selenium Remote Control.

Selenium IDE

Selenium IDE is a Firefox extension that allows you to create, edit, and execute your tests. Tests can either be created manually, or by “recording” your actions. Recording can help you get a feel on how the Selenium commands are generated, but in most cases you will want to tweak the generated commands.

A Selenium test is a list of commands. Commands can be seen as actions, such as “click this element”, “type into this field”, and “assert an element exists”.

Install Selenium IDE

First, you will need to install the plugin which can be found here. Once installed you can choose Tools / Selenium IDE or View / Sidebar / Selenium IDE from the Firefox application menu.

Spend some time playing around with Selenium IDE. You can use the record button (red circle) to have the tool record your actions or you can enter commands manually. Most commands require a locator string. The locater string is repsonsible for identifying elements. There are various “types” of locator strings which are covered later.

Using Selenium IDE you can save and load tests. Also, notice the source tab. This tab allows you to view the test source. Selenium tests are saved as HTML files and can be exported to multiple server-side languages PHP, Ruby, Java, C#, Perl, and Python.

Creating a new Selenium Test

In this example, we will be testing both an Ext JS and Ext GWT form and it’s fields. First, let us take a look at the example code we will be testing. You can find the source code here:

Rather than creating a test from scratch, we will load an existing test file (listed above). Download this either the Ext JS or Ext GWT file to your file system. Then open the test in the Selenium IDE by selecting File / Open. Once loaded, Selenium IDE should look this this:

Notice the list of commands. Take a look at each command to get a feel of what the test is doing. If you opened Selenium IDE as seperate window, close it. Then open Selenium IDE using View / Sidebar / Selenium IDE. This will place selenium in the sidebar making it easier to run and monitor tests.

You can execute the test by clicking the first icon with the green arrow in the tool bar. Notice that you can control execution speed, use break points, execute individual commands, etc. After running your test, you screen should look like this:

Notice the form fields have been filled out. Examine the commands closely to see what actions were taken and what assertions where made. This test only touches the surface of things you can accomplish with commands. Note: When running the Ext JS test file, the radios and check boxes will not show the checked state, however, the true state will be correct, and the tests will run successfully.

Selenium Locators

Many Selenium commands require a locator to be specified. A locator is a way to identify an element in the page (the DOM to be specific). There are various types of locators including id, name, dom, xpath, link, and css. For this tutorial, XPath expressions where used. XPath expressions provide a powerful mechanism to identify elements. Example expressions look like this:

//input[@name='name']
//input[@name='name' and contains(@class, 'x-form-invalid')]
//input[@name='company']/following-sibling::img
//div[@id='Apple']
//div[@class='x-combo-list-item'][3]

Here are a few examples using CSS selectors:

css=html:root
css=div#structuralPseudo :nth-last-child(2)
css=a[class~="class2"]

Executing Tests with Selenium Remote Control (RC)

Selenium IDE provides a great way to create your tests and execute them in Firefox. Tests can only be run by manually opening Firefox and executing tests. What if you want to run you want to automate your tests and run them in other browsers? This is where Selenium Remote Control comes into play.

From the Selenium website: “Selenium Remote Control (RC) is a test tool that allows you to write automated web application UI tests in any programming language against any HTTP website using any mainstream JavaScript-enabled browser. Selenium RC comes in two parts. 1. A server which automatically launches and kills browsers, and acts as a HTTP proxy for web requests from them. 2. Client libraries for your favorite computer language.”

Download Selenium RC

In addition to Selenium IDE, Selenium RC must be downloaded and can be found here. After downloading, unzip the file to your file system.

Starting the Server

The first step in using Selenium is to start the server. The server is responsible for executing your tests. The server will open browser instances, run tests, and close browsers. The server is written in Java and can be started by executing this command:

java -jar selenium-server.jar

The command should be executed from the folder where the selenium-server.jar is located.

To run your tests in Java, you must reference the Java client library. See selenium-java-client-driver.jar in the Selenium RC download.

Creating a test in Java

Selenium RC supports various languages, we will focus on Java. Rather than creating the Java test from scratch, Selenium IDE can be used to create the base Java code needed to create the test. From Selenium IDE, select the source tab, then choose Options / Format / Java. You will see the test is converted form HTML to Java. You can then copy and past the Java code to be used in your Java test. You can use the same steps to create code in other languages such as PHP and Ruby.

Here is the Java code that was created using the template code from Selenium IDE:

public class SeleniumTestCase extends SeleneseTestCase  {
 
  private Selenium selenium;
 
  public void setUp() {
    selenium = new DefaultSelenium("localhost", 4444, "*iexplore", "http://extjs.com");
    selenium.start();
  }
 
  public void testForm() {
    selenium.open("http://extjs.com/playpen/gxt/selenium/");
    pause(500);
    selenium.type("//input[@name='name']", "John");
    selenium.fireEvent("//input[@name='name']", "blur");
    assertTrue(selenium.isElementPresent("//input[@name='name' and contains(@class, 'x-form-invalid')]"));
    selenium.type("//input[@name='name']", "Darrell");
    selenium.fireEvent("//input[@name='name']", "blur");
    assertFalse(selenium.isElementPresent("//input[@name='name' and contains(@class, 'x-form-invalid')]"));
    selenium.type("//input[@name='email']", "darrell@foo.com");
    assertEquals("Darrell", selenium.getValue("//input[@name='name']"));
    assertEquals("darrell@foo.com", selenium.getValue("//input[@name='email']"));
    selenium.focus("//input[@name='company']");
    selenium.click("//input[@name='company']/following-sibling::img");
    assertEquals("43", selenium.getXpathCount("//div[@class='x-combo-list-item']"));
    selenium.click("//div[@id='Apple']");
    assertEquals("Apple Inc.", selenium.getValue("//input[@name='company']"));
    selenium.click("//input[@name='birthday']/following-sibling::img");
    selenium.click("//button[contains(text(), \"Today\")]");
    assertTrue(selenium.getValue("//input[@name='birthday']").matches("^[\\s\\S]*$"));
    selenium.check("//input[@value='Classical']");
    assertEquals("on", selenium.getValue("//input[@value='Classical']"));
    selenium.check("//input[@value='Blue']");
    assertEquals("on", selenium.getValue("//input[@value='Blue']"));
  }
 
  public void tearDown() {
    selenium.stop();
  }
 
}

Notice the use of “pause” after opening the application. This is needed to allow the GWT application to load. Other than that, the test code is a direct paste from the code generated in Selenium IDE. Notice that the test is using “*explorer” to execute the test. Firefox, Opera, Safari, Chrome are also supported. Keep in mind that the browser must be installed on the same maching where the Selnium server is running.

The new JUnit test can be executed just like any other JUnit test. The test can be executed with Eclipse.

Selenium Grid

Although it is not used in the tutorial, Selenium Grid is worth mentioning. From the website: “Based on the excellent Selenium web testing tool, Selenium Grid allows you to run multiple instances of Selenium Remote Control in parallel. Even better, it makes all these Selenium Remote Controls appear as a single one, so your tests do not have to worry about the actual infrastructure. Selenium Grid cuts down on the time required to run a Selenium test suite to a fraction of the time that a single instance of Selenium instance would take to run.”

Summary

The tutorial demonstrated how load and run tests within Selenium IDE. The test code was ported to Java where it was run using Selenium Remote Control in a JUnit. This tutorial demonstrated the major moving parts involved in Selenium tests. It is recommended to take a look at the Selenium documentation and tutorials for more information.

Many thanks go out to the Selenium Team. There is a slight learning curve getting familiar with the product but I found it straightforward. The time was well spent as it opens up a new approach to testing web applications.

This entry was posted on Monday, November 3rd, 2008 at 2:21 pm and is filed under Ext GWT, Ext JS, Tutorials. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

56 Responses to “Testing Ext JS & Ext GWT Applications With Selenium”

  1. Cornelius Weiss
    Posted on November 3rd, 2008 at 2:45 pm

    Great Post,

    you saved my x-mas time!

    cu
    Cornelius

  2. Americo Savinon
    Posted on November 3rd, 2008 at 6:24 pm

    Good post. You are right.. there is a slight learning curve, but this is a really good start for automated UI testing using Ext Js + Selenium IDE.

  3. MT22のメモ帳 » Ext JS - Blog ～ Selenium によるテストの照会
    Posted on November 3rd, 2008 at 10:59 pm

    [...] Testing Ext JS & Ext GWT Applications With Selenium [...]

  4. Chris Khoo
    Posted on November 3rd, 2008 at 11:46 pm

    I’m sorry, but whatever happened to using good ol’ Javascript, especially if the webapp is primarily driven by one or a few HTML/JS pages - which ExtJS is very much designed for?

    It’s not exactly the same in terms of interacting directly with the UI, but running the events themselves (click, change, etc.) in code and disabling modal dialog boxes (alert, confirm, etc.) for tests should be sufficient.

    Then you eliminate a learning curve, don’t have to write your tests in another language, plus you can test on more browsers.

  5. Ajaxian » Testing Ext Applications With Selenium
    Posted on November 4th, 2008 at 8:15 am

    [...] Meyer has written a detail article on testing Ext applications, both Ext JS and GXT versions: Both Ext JS and Ext GWT applications can benefit from Selenium [...]

  6. Testing ExtJS Applications With Selenium | Neurosoftware web dev
    Posted on November 4th, 2008 at 8:42 am

    [...] Testing Ext JS & Ext GWT Applications With Selenium [...]

  7. Ajax Girl » Blog Archive » Testing Ext Applications With Selenium
    Posted on November 4th, 2008 at 9:23 am

    [...] Meyer has written a detail article on testing Ext applications, both Ext JS and GXT versions: Both Ext JS and Ext GWT applications can benefit from Selenium [...]

  8. matthew
    Posted on November 4th, 2008 at 9:34 am

    thank u r information

    it very useful

    u r blog Is very nice

  9. Thomas Broyer
    Posted on November 4th, 2008 at 10:25 am

    You’re wrong about JUnit and GWT: you can actually run JUnit tests in “web mode” (that’s what the GWT team is using BTW, have a look at the Ant build files from GWT), either using RMI to a set of BrowserManagerServers (what’s called remote-web tests), “hybrid” mode (compiled app within the GWTShell/JUnitShell; what they call “local web” mode) or… Selenium RC !
    There’s also a “manual” mode where you launch the browser(s) yourself and give it/them the JUnitShell URL, and an experimental “external browser” mode (you give the JUnitShell a list of executables that’ll be launched, passed the JUnitShell URL as a command-line argument).

    This however doesn’t execise your *application*, as the compiled code is a set of GWTTestCases, not your real, production-ready application.

    Well, GWT/JUnit integration is for unit-testing, while you’re proposing doing UI testing or integration testing, which is not the same thing.

  10. Darrell Meyer
    Posted on November 4th, 2008 at 11:54 am

    Thomas, thanks for information and correction about GWT and JUnit (web mode). It makes sense that the tests run compiled test code. I am not suggesting that Selenium tests should replace any JUnit unit tests, rather to use both as they complement each other (unit test vs. integration).

  11. Chinmay
    Posted on November 4th, 2008 at 1:34 pm

    Thanks for this blog post. This does cover the simplest of applications, but does not appear to cover the issue of locator stability when using Ext-JS in non-trivial applications. We’ve explored using IDs and CSS selectors when constructing our locators. Unfortunately, in Ext-JS it is not possible to uniquely identify UI objects using ID. Even minor changes in the UI will change the ID of the previous UI widgets. The order in which UI widgets get rendered also affects IDs and breaks the selenium tests.

    There are similar issues when using CSS selectors to uniquely identify UI components, but this appears to be a promising approach. Does the Ext-JS team have any recommendations on how to address this issue?

    Thanks in advance for your reply.

  12. smarek
    Posted on November 4th, 2008 at 3:59 pm

    We started to use Selenium couple of months ago. Now I’m co-developing simple framework for testing web application. Especially for testing ExtJS application but not only.

    Our testing framework uses Selenium and TestNG. 4 days ago the project was published on Google Code
    KDEV-WTF
    http://code.google.com/p/kdev-wtf/

    To make manipulation easier the concept of adapters were used. So far the frame work is used for 3 projects and it seems to work fine (for our purposes)

    If someone is interested please take a look at project page. The more information will be addad asap.

  13. Javascript News » Blog Archive » Testing Ext Applications With Selenium
    Posted on November 5th, 2008 at 6:49 am

    [...] Meyer has written a detail article on testing Ext applications, both Ext JS and GXT versions: Both Ext JS and Ext GWT applications can benefit from Selenium [...]

  14. Matthew
    Posted on November 5th, 2008 at 2:35 pm

    How do you set the name field of an ext component?

  15. Testing Javascript User Interfaces with Selenium | ExtJS | Fritz Thomas
    Posted on November 5th, 2008 at 5:11 pm

    [...] Meyer wrote an interesting Article on ExtJS Blog how to test JavaScript generated User Interfaces with Selenium. Selenium is tool to [...]

  16. Alexander
    Posted on November 6th, 2008 at 8:35 pm

    Refactoring is the key. If you wire all your tests with capture and play you will end up with an ugly and unwieldy suit of trash.

    Starting selenium and stopping it at each test case is also lame.

    You should separate your test cases from your test harness. Thus if your change from GWT to Yahoo tool kit or Dojo you do the change in only one place.

    Not to mention that capture and play approach will not handle an asynchronous web application because the UI will change underneath your tests without your interaction. Consider a web application that display a grid that is updated by the server in real time with the new bids posted by other users on the system.

    If you capture and play you will never be sure what row in the grid your data supposed to be in. So you have to write some code to do that for you.

    With that in mind the approach for testing any Ajax app with selenium requires development of Test Harness, Declaring your locators in a class of its own, and writing some parsers that can grab the HTML from selenium and interrogate it OUTSIDE if the browser session because in the browser the DOM could be changed by the asynchronous process.

    This sounds like extra work. But in the end you end up with a flexible and stable suite that is easy to maintain and write test cases against. As a bonus you can use it for load and stress test as well (See Selenium Grid)

    All in all, good. But do not use capture and play. It generates UGLY and UNWIELDY code.

  17. Mechanism of testing Ext JS Applications with Selenium | developersnippets.com
    Posted on November 8th, 2008 at 11:53 am

    [...] Ext JS has written a detailed brief description about the tool in the respective blog titled “Testing Ext JS & Ext GWT Applications With Selenium“. He explained about how we can create Selenium tests and execute them in a variety of ways. [...]

  18. Vivekanand
    Posted on November 8th, 2008 at 12:14 pm

    This is awesome, and I would like to thank “Darrell Meyer” on briefing about the tool… really I will have a look at it

    Thanks,
    Vivek
    [http://www.developersnippets.com]

  19. David
    Posted on November 9th, 2008 at 7:54 pm

    Anybody got the dragAndDrop command working for extjs? It looks like the ‘drop’ is ignored, possibly due to a missing mouse over on the target zone.

  20. Tony OHagan
    Posted on November 10th, 2008 at 7:41 am

    Currently ExtJS generates unique but meaningless id’s on DOM elements. By default, Selenium IDE uses these id’s when auto recording events on HTML control elements (buttons, fields etc). Add a new widget on the page and the test script recordings all break.

    Some time ago I proposed that ExtJS support an additional config property on all widgets so that a meaningful prefix can be applied to all HTML control DOM elements that are generated by the widget. Generated ids would then be stable and meaningful so that recorded tested are readable and maintainable. Yes, you can painfully rewrite each recorded rule to use an xpath or CSS selector but this costs valuable time. It would be so much simpler and quicker to use Selenium if it’s recorded coded that uses ids *just worked*.

  21. Онлайн PHP-редактор - PHPanywhere.com | Веб 2.0 вещи от Bubble Babe. Все для веб-мастера и блогера
    Posted on November 10th, 2008 at 2:31 pm

    [...] сервис, как онлайн PHP-редактор - PHPanywhere.com. Работает на Ext JS. Совершенно все нужные фунции присутствуют - [...]

  22. 陆阳
    Posted on November 11th, 2008 at 4:18 am

    很高，真的很高

  23. chandan
    Posted on November 11th, 2008 at 8:04 am

    Hello,
    Please help me to automate selenium testcases.I have to change Java script file prsent in selenimu.How to do that?If anuone has any idea please inform me.

  24. Nitin Gautam
    Posted on November 12th, 2008 at 9:35 pm

    Really a helpful article. Thanks!!

  25. Condor
    Posted on November 14th, 2008 at 8:51 am

    [QUOTE]Notice the use of “pause” after opening the application. This is needed to allow the GWT application to load.[/QUOTE]

    I would strongly recommend using ‘waitForCondition’ instead of ‘pause’!

  26. Gopalan
    Posted on December 10th, 2008 at 3:11 am

    Hi,

    I am using firefox version 3 and started trying this exercise. But selenium IDE is recording the scripts differently than what is get posted.
    The following are the recorded scripts
    package com.example.tests;

    import com.thoughtworks.selenium.*;
    import java.util.regex.Pattern;

    public class NewTest extends SeleneseTestCase {
    public void setUp() throws Exception {
    setUp(”http://change-this-to-the-site-you-are-testing/”, “*chrome”);
    }
    public void testNew() throws Exception {
    selenium.open(”/playpen/gxt/selenium/”);
    selenium.type(”x-auto-4″, “Gopalan”);
    selenium.type(”x-auto-5″, “test@test.com”);
    selenium.click(”//img[contains(@src,'http://extjs.com/playpen/gxt/selenium/images/default/shared/clear.gif')]“);
    selenium.click(”//div[@id='x-auto-9']/img”);
    selenium.click(”//div[@id='x-auto-29']/table[3]/tbody/tr[3]/td[4]“);
    selenium.click(”//div[@id='x-auto-29']/table[3]/tbody/tr[4]/td[4]/a/span”);
    selenium.click(”//div[@id='x-auto-10']/img”);
    selenium.click(”//input[@value='Classical']“);
    selenium.type(”x-auto-22″, “test”);
    }
    }

    When i run this test in RC with *iehta(internet explorer(both v 6 & 7)), selenium is not recognising the objects.

    The following error is thrown

    om.thoughtworks.selenium.SeleniumException: ERROR: Element x-auto-4 not found
    at com.thoughtworks.selenium.HttpCommandProcessor.doCommand(HttpCommandProcessor.java:73)
    at com.thoughtworks.selenium.DefaultSelenium.type(DefaultSelenium.java:190)
    at com.testscripts.GoogleTest.test7(GoogleTest.java:84)
    at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
    at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:39)
    at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:25)
    at com.thoughtworks.selenium.SeleneseTestCase.runBare(SeleneseTestCase.java:71)
    at com.intellij.rt.execution.junit.JUnitStarter.main(JUnitStarter.java:40)
    at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
    at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:39)
    at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:25)
    at com.intellij.rt.execution.application.AppMain.main(AppMain.java:90)

  27. Gopalan
    Posted on December 12th, 2008 at 2:51 am

    Hi,

    The above problem got solved by uninstalling firefox 3 and installing the version3. Now i am getting differnt issue.
    I ran the test sucessfully in firefox using the Selenium RC. But when i change this to internet explorer, one of the save button is recognised differently. I Viewed DOM Object and it is giving different name(ie ext-gen-84 for IE and ext-gen-85 for firefox). At the code level, even the DOM object is not giving the ID or name for button, even at the code level it is given. The same is working fine for textfields and others.

    Any workaround for this?

    One more problem: My Tests are not running in normal mode for internet explorer. It is working only in proxyinjection mode.

  28. Taxaw
    Posted on December 14th, 2008 at 10:36 am

    Smarek post is very interresting.
    I think that a lot of people pass through it but should take a look at the framework proposed by him.
    If you want to test in a professionnal way, his framework is a key.

    “
    smarek
    Posted on November 4th, 2008 at 3:59 pm
    We started to use Selenium couple of months ago. Now I’m co-developing simple framework for testing web application. Especially for testing ExtJS application but not only.

    Our testing framework uses Selenium and TestNG. 4 days ago the project was published on Google Code
    KDEV-WTF
    http://code.google.com/p/kdev-wtf/

    To make manipulation easier the concept of adapters were used. So far the frame work is used for 3 projects and it seems to work fine (for our purposes)

    If someone is interested please take a look at project page. The more information will be addad asap.
    “

  29. alikos
    Posted on December 26th, 2008 at 7:23 am

    Точно Хорошую информацию трудно добыть. (А сделать с ней что-нибудь – ещё труднее) :)

  30. söve
    Posted on December 26th, 2008 at 7:41 am

    thanks.

  31. Gopalan
    Posted on January 9th, 2009 at 11:54 am

    The following are the progress.
    1. For the Textbox and other controls IDS has been set at the code level and this problem got solved. In case of button, even id has been set, only auto generated ids are coming to the DOM. We have solved this problem by clicking button contains text. so this will be common for all the browsers.

    Now we are facing the problems. Any one has solutions?
    1. Unable to click a link in the Grid list page. I have tried all the possible options listed out. In case of plain page it is working. But in case of EXTJS, selenium is not able to click the link. It is reporting element not found. We have tried expath, id, linkname, div contains, link contains, class etc.
    2. DHTML based popup(Movable) windows which has only DIV and Classes for the elements to pickup.
    3. Grid Editing.All the rows of a column is having the same class and id.

  32. Gopalan
    Posted on January 12th, 2009 at 2:28 am

    The problem here is Selenium is introducing the JavaScript errors. When the operation is performed manually, system is not throwing any java script error. But in case is executing the selenium scripts, javascript errors are displayed. We suspect the javascript which is injected by the selenium is clashing with exsting js files available in the application page, which uses EXTJS.

    Any best practice of avoiding these java script errors or workaround for this problem?

  33. MichaelC
    Posted on January 15th, 2009 at 7:32 pm

    We used Selenium for basic testing, worked well. it took some work.

    Issue we found within EXTJS
    the grid is the most used component you will have but id’s within a grid are autogenenrated. to select an element in the grid we used the actual value shown in the grid cell example: selenium.mouseOver(”//div[contains(text(),'E-admin_VR18')]“);

    Timing is a big issue adding a wait does not really cover the issue.
    better to build a loop
    for i in range(60):
    try:
    if sel.is_element_present(”AWMEL21_4″): break
    except: pass
    time.sleep(1)
    else: self.fail(”time out”)

    The HTML version is quick but in the long run will not give you the results you will need. Both the Java and Python version seem very functional.

    The IDE will generate an excellent start point, but it is only a start point.

  34. sufiya
    Posted on January 21st, 2009 at 1:56 pm

    i have got a same problem with auto generated ids differ for different browser.
    Any solution so far

    Do we have any progress on below comment(or we should still depend on a auto generated ids)

    Some time ago I proposed that ExtJS support an additional config property on all widgets so that a meaningful prefix can be applied to all HTML control DOM elements that are generated by the widget. Generated ids would then be stable and meaningful so that recorded tested are readable and maintainable. Yes, you can painfully rewrite each recorded rule to use an xpath or CSS selector but this costs valuable time. It would be so much simpler and quicker to use Selenium if it’s recorded coded that uses ids *just worked*.

  35. DJ
    Posted on January 22nd, 2009 at 1:19 pm

    Using the uimapping for uielements in your testing seems to make testing for Ext Js a little more manageable, and it also makes the IDE more useful.

    Once you build your map file, you can use it in both your java tests, and the IDE, and suddenly the IDE is returning locators that you can actually use. (If you have defined the element in the ui map)

    Ui Elements have been available in the IDE since June, and were just merged into RC this month.

  36. Buy amoxicillin without prescription.
    Posted on February 3rd, 2009 at 7:59 pm

    Buy amoxicillin….

    Buy amoxicillin without prescription. Buy amoxicillin online cheap amoxicillin….

  37. Гавриил
    Posted on February 3rd, 2009 at 8:01 pm

    Что касается непосредственно, то мне кажется что ее актаульность будет понятна только через некоторое время.

  38. MichaelC
    Posted on February 6th, 2009 at 10:11 pm

    I see several post issues about ID, the answer is to define the id for the component.
    you need to have a good naming standard so your id’s are unique.

    Grids are a problem here, I don’t have a real good answer, would love to hear one.
    with grids I go for the context within the grid element an example //div[contains(text(),'E-admin_VR18')]

  39. Riri
    Posted on February 10th, 2009 at 5:14 am

    Hi,

    I am using Selenium together with FitNesse to test our EXTJS application.
    Results are really good !

    To solve the pbl of IDs, we took a “naming convention” for all objects we can change programmaticaly the ID.
    For the grid element, we took another way.
    Before runing the test, when the grid is loaded, I “convert” all needed grid IDs and replace them by my own values.
    The starting point I choose is the “x-grid3-viewport”. After that, all subdiv (header, body, …) get a “temporary id” (setted using “selenium.assignId()”).
    And then, the life is easy ! :-)

  40. srinivas
    Posted on February 23rd, 2009 at 4:55 am

    Hi,

    I am unable to click on a Collapse/Expand Node (’+') using Selenium (Java). The icon is placed in a Div which is placed in a Table. Please help! Following is the UI Definition for the element

  41. srinivas
    Posted on February 23rd, 2009 at 5:07 am

    *
    *
    *
    *
    *
    *
    *
    *
    *

  42. srinivas
    Posted on February 23rd, 2009 at 5:09 am

    Table-td-DIV-Span-a id=”a_id”

  43. srinivas
    Posted on February 23rd, 2009 at 5:13 am

    The script could identify the element. This was confirmed using ‘isElementPresent’ and i could get the title for the Element. But unable to click on the element. Please help me in this regard. Thanks

  44. Riri
    Posted on February 24th, 2009 at 3:26 am

    Hi “srinivas”,

    I haven’t succeed to perform this test too….
    My workaround is to go into the DOM to set the value.
    “this.browserbot.findElement(’id=” + idAttr + “‘).setAttribute(’className’, ‘” + classAttr + “‘)”;
    Where ‘classAttr’ is either “x-grid-group-collapsed” or “”. (Don’t forget to keep before the other value of the @class argument.
    After you perform a “selenium.getEval(…) and your row is expanded or collapsed.

    I know that using this, you don’t really test the “click” on the “expand icon”, but as it doesn’t work (as you indicate), this workaround allows you to do what you want in your test.

    Hope it help.

  45. srinivas
    Posted on February 24th, 2009 at 10:46 am

    Hi Riri,

    Many thanks for the solution. Actually, I am new to Selenium. Could you please help me with the code you have shared. I tried to run my script using the above code. But i ran into a errors. Please let me know incase I am missing anything

    “…….objSel.getEval(this.browserbot.findElement(’@id=” + idAttr + “‘).setAttribute(’@className’, ‘”+ classAttr + “‘)); ………”

    Please help

    Many Thanks Again ,
    Srinivas

  46. Srinivas
    Posted on February 24th, 2009 at 2:27 pm

    I also tried the following code

    “…………String childSpanTextSnippet = “(” + “this.browserbot.findElement(’id=elem_id’).setAttribute(’className’,”);”+”)”;

    objSel.getEval(childSpanTextSnippet);…………………………”

    Go the following error

    “……….-junit.framework.AssertionFailedError: test Could not be run because of com.thoughtworks.selenium.SeleniumException: ERROR: Threw an exception: missing ) in parenthetical…..”

    Please let me if I am missing anything

    Thanks,
    Srinivas

  47. Riri
    Posted on February 25th, 2009 at 3:52 am

    Hi again Srinivas,

    1/. If you want to know if a group is expanded or not, you have first to do :
    ” selenium.getAttribute(path + “@class”); “, where path is the xPath to your group.
    Then check if the class contains “x-grid-group-collapsed”.

    2/. If you want to simulate the expand/collapse, you have to set the ‘@class’ of your group by adding or removing “x-grid-group-collapsed”. To do it use


    String domLocator = “this.browserbot.findElement(’id=” + idAttr + “‘).setAttribute(’className’, ‘” + classAttr + “‘)”;
    selenium.getEval(domLocator);

    Hope it help.

  48. srinivas
    Posted on February 25th, 2009 at 7:06 am

    Hi Riri,

    Many Thanks for the help , I ran the code and it modifies the class of the node. but does not expand the node, the action required after expanding the node does not happen.

    “………… selenium.getEval(”javascript:{this.page().findElement(’id=elem_id’).setAttribute(’class’, ‘expanded_state’);}”); ……………..”

    Actually, there are a few fields which are hidden when the node is in a Collapsed state., I will be able to see these fields only after the node is expanded….

    Please help if you have any other ides…

    Many Thanks Again,
    Srinivas

  49. Julianna
    Posted on March 1st, 2009 at 6:02 pm

    i dont usually comment, but after reading through so much info i had to say thanks

  50. Lindsay
    Posted on March 4th, 2009 at 11:16 pm

    I just wrote an article on how we’ve been testing an ExtJS GUI in Java at:

    http://www.neocoders.com/portal/articles/selenium-and-extjs

    Primarily, it describes how we got around having to assign hand-crafted IDs to all the Ext components and how we synchronise the tests with AJAX.

    hope it helps somebody,
    Lindsay

  51. Balaji.R
    Posted on March 6th, 2009 at 1:24 am

    import com.thoughtworks.selenium.Selenium;
    import com.thoughtworks.selenium.DefaultSelenium;

    public class MySelenium {

    static Selenium browser;

    public static void main(String arg[])
    {
    browser = new DefaultSelenium(”localhost”,
    4444, “*firefox”, “http://172.16.0.143:8080/nevadabisqa”);

    browser.start();

    browser.open(”http://172.16.0.143:8080/nevadabisqa”);
    browser.windowMaximize();
    browser.waitForPageToLoad(”3000″);
    browser.type(”userName”, “admin”);
    browser.type(”password”, “C!om1@ver9e”);
    browser.runScript(”javascript:document.forms[0].submit()”);
    browser.waitForPageToLoad(”3000″);
    browser.open(”/nevadabisqa/manageReports.do?method=loadReport”);
    browser.waitForPageToLoad(”5000″);
    browser.mouseOver(”//div[@class='gwt-PushButton mp-lookup gwt-PushButton-up']“);
    browser.mouseDown(”//div[@class='gwt-PushButton mp-lookup gwt-PushButton-up-hovering']“);
    browser.mouseUp(”//div[@class='gwt-PushButton mp-lookup gwt-PushButton-down-hovering']“);
    browser.click(”//html/body/div[2]/div/table/tbody/tr[1]/td[2]/div/div/table/tbody/tr/td[2]/img”);

    }
    }

    The above program i am running , but inside GWT popup images not able to record it shows the error as ERROR: Element //html/body/div[2]/div/table/tbody/tr[1]/td[2]/div/div/table/tbody/tr/td[2]/img not found …. please help me out its very urgent

  52. js
    Posted on April 28th, 2009 at 6:00 am

    Any tips on selenium testing with an editable grid.

    I’m finding it hard to simulate the user typing values into fields of an editable grid. Is there a solution to this without having to use the core Ext API to set values?

  53. Ibarra
    Posted on April 29th, 2009 at 7:09 pm

    I think the problem stems from ExtJS just not allowing the element ID to be set. Yes, it does set the ID of the higher level element (example a table or a div), but that is not the one selenium would require to locate this specific element.

    RIght now I had to resolve this by using XPATH, result is ugly but it works. ExtJS needs to resolve this.

  54. Freefonty
    Posted on June 15th, 2009 at 6:24 am

    Nice, but write more about testing, its interesting!

  55. selguy
    Posted on June 16th, 2009 at 1:48 am

    Gopalan,

    How did you solve the problem of javascript errors being thrown during execution of selenium scripts? I am facing similar problem, where in we are getting ‘Javasctipt not enabled on your browser’ error though JS is enabled on Firefox. This does not appear if executed manually.

    Thanks in advance,
    selguy

  56. kabin
    Posted on June 27th, 2009 at 5:54 am

    thank you very nices. ok :d

Leave a Reply

To prove that you're not a bot, please answer this question:



HomeProductsSupportJobsCompanyBlogStore
© 2006-2009 Ext, LLC