|
Issue 4, 2014 |
 |
Download pdf |
Natural for AJAX
Learn how easy it is to create automated tests for Natural Web applications built on AJAX technologies. By using open source Selenium concepts, Natural for AJAX applications can be tested on various browsers to ensure quality results and satisfied end users.
Introduction
Natural for AJAX is a framework for developing high quality browser-based user interfaces. High quality not only means a low percentage of errors but implies the flexibility and speed to adapt to changing end-user requirements, new features of the Natural for AJAX framework and new browsers (or versions). It is simply impossible to achieve this definition of quality by manually testing the user interface over and over again for each supported browser whenever something has changed. The number of required developers to do this is cost prohibitive for most companies.
Fortunately, a number of tools for automated testing of browser-based user interfaces are available that can be leveraged by Natural for AJAX. Although Natural for AJAX does not contain a proprietary test automation tool itself, it allows you to choose a tool and run automated tests on your applications without changing your application.
The ability to test without changing your application is important for building stable, automated test suites with little effort. Stable test suites allow you to enhance your application without impacting existing tests and adding new tests will not impact your application. Natural for AJAX uses the testtoolid concept to allow you to build stable, reusable test suites.
The testtoolid concept
To understand how Natural for AJAX can leverage test automation tools, we must first understand how AJAX operates. Natural for AJAX runs HTML pages in a browser. These pages are designed as XML page layouts using the AJAX Developer Tools in NaturalONE. From these XML page layouts, Natural for AJAX generates HTML pages.
Test automation tools like Selenium (http://docs.seleniumhq.org/) must locate specific HTML elements in an HTML page to either check or adapt the content or to trigger corresponding events. To enable Selenium to locate elements for testing in a Selenium test program, the developer typically passes identifiers using the Selenium Java® API.
For stable automated tests, it is extremely important to use stable identifiers. For instance, rearranging controls in a layout or adding an additional control must not change the identifiers.
For the most common controls, Natural for AJAX automatically generates stable identifiers. These identifiers are called testtoolids. These testtoolids are generated as testtoolid attributes in the HTML page. Test tools like Selenium can use this testtoolid attribute to locate the element.
Testing a FIELD control
In Figure 1, the FIELD control valueprop property is set, but the testtoolid property is not explicitly set. If no value for the testtoolid is explicitly set in a FIELD control, the generated HTML will contain a testtoolid attribute with the value of the valueprop.
Figure 1: Testtoolid will automatically populate HTML identifier creating a stable test.
Fortunately, you don’t need to understand all of the HTML details. The HTML snippet shown in Figure 2 shows you that a testtoolid is automatically generated for a FIELD control without having to do anything.
When looking at the HTML, you will see the id attribute “F_13”. While you may be tempted to enter this into your test tool instead of using testtoolid, do not. Using the id attribute in your test tool will break your tests sooner or later because it is not stable. For instance, if you add another FIELD control in front of the “yourname” FIELD control, the id will change its value to “F_14”. By only using the testtoolid, you will always have a stable test.
Figure 2: HTML generated for autofilling testtoolid
<input id="F_13" name="CC" class='FIELDInputEdit'
testtoolid='yourname' type="text" style="width: 185px;">
With the tool Selenium, for instance, you can locate the FIELD control using a corresponding XPATH expression that contains the testtoolid value. This XPATH expression can be passed to corresponding Selenium locators as shown in Figure 3.
Figure 3: Example Selenium locator org.openqa.selenium.By.ByXPath
By myfieldlocator = new ByXPath(".//*[@testtoolid='yourname"]");
For more information
To see how to use other controls for more advance concepts and explore testing the Helloworld sample, read Test Automation of Natural for AJAX Applications. This also includes examples for some of the most common XPATH expressions for complex controls.
Visit http://docs.seleniumhq.org/ for more information about the Selenium and the Selenium Java API.