Test Dynamic Web Pages

Applies to TestComplete 15.10, last modified on December 15, 2021

A dynamic web page updates its content and layout each time it is accessed, even when it is being viewed. Such pages offer a more functional UI that does not require page reloading. Due to this feature, dynamic web pages are the basis of web applications. The most popular technologies for creating dynamic web pages are DHTML (Dynamic HTML) and Ajax (Asynchronous JavaScript and XML).

Since dynamic web pages update their content continually, the page contents, the object hierarchy and object properties may change between test runs and even during a single test run. This can cause errors when playing back your tests. This topic describes the specifics of testing dynamic web pages and explains how you can identify objects on them.

Approaches to Locating Dynamic Pages’ Objects

On dynamic web pages, objects can be created, modified and deleted, and the object hierarchy is changed as a result of user actions (such as opening a popup form for data editing, grouping a grid by a specific column and so on). Since the object hierarchy of web pages changes dynamically, you need to make sure that the desired objects exist. You do this in one of the following ways:

Waiting for an Object

Typically, when testing web pages, you check whether a page is fully loaded to make sure that all the needed objects exist. TestComplete provides several methods that let you wait for a web page to load, such as ToUrl, Wait and WaitPage. TestComplete automatically records the Wait operations when you load pages in a web browser while recording a test, and you can also add the necessary Wait operations to the tests you created manually. For more information, see Wait For Web Pages.

The mentioned methods wait until the page’s original HTML code is completely loaded from the server to the client computer before proceeding to the next operation. However, scripts in dynamic web pages may load additional content or modify the existing content after the page has been loaded. If the needed web page object is not populated yet, your test will fail.

To resolve the problem, you have to check whether the desired web objects exist before performing any operations over them. You can modify your tests in order to make them wait until the desired objects become available before you start working with them. For more information on how to do this, see Waiting for an Object, Process or Window Activation.

Using Name Mapping for Identifying an Object

The most appropriate way to resolve the problem with identification of dynamic objects is using Name Mapping. When you add an object to the Name Mapping repository and define a custom name for it, you specify criteria that will be used to uniquely identify this object in the application. When TestComplete comes across a custom name during the test playback, it calls the Name Mapping engine to search the object tree for the object that has the specified properties, and once this object is found, it returns it to the test engine.

Name Mapping also includes several settings that help identify dynamic objects. For a brief description of the available settings, see below:

List of Additional Name Mapping Settings

Another way to handle dynamic objects is to dynamically search for the objects using certain criteria. TestComplete provides a number of search methods that allow you to find the desired object on a web page. For example, you can search for a link using its text, find an input field of a specific type and so on.

TestComplete search methods allow you to specify the search scope and depth. You can increase the search depth in order to perform a search on the entire web page or limit the search depth to search within a certain container object that holds the desired web object. You can also find one object, or all the objects that meet the specified criteria.

For a detailed description of the available methods, their initial search scope, sought-for properties and some other details, see Find Web Objects.

Handling Dynamic Controls and Menus

Web applications can contain dynamic controls and menus whose appearance changes when the user moves the mouse pointer over these controls and menus. The content of the tested web page may change, and some objects may become visible (or invisible) after hovering the mouse pointer in such a way. For example, drop-down items of dynamic menus can be invoked on hovering the mouse pointer over the parent menu items.

TestComplete records mouse hovering operations which cause changes in the tested web page’s content and inserts the HoverMouse operations into the recorded test. If you create your test manually, that is, without recording user actions, remember to insert the needed HoverMouse operations applied to the appropriate dynamic controls into your test before working with objects that appear only after hovering the mouse pointer over the controls.

See Also

How To
Wait For Web Pages
Find Web Objects

Highlight search results