Access Native Web Attributes and Methods

About

Native Members Available in Your Tests

Getting and Setting Web Element Attributes and Properties

Calling Web Element Methods

Important Notes

TestComplete identifies individual elements on a web page and provides methods and properties for automating various operations with these objects, getting object data, checking their state and so on. However, there can be a situation when your testing task cannot be performed with these methods and properties provided by TestComplete. In this case, to perform your task, you can use native attributes, properties, and methods of web elements. These are the same properties and methods that are defined in the source code of the web page as well as custom internals implemented by the application developers. This way, you can perform almost any operation on the tested web page.

You can view these native attributes, properties and methods in the Object Browser and Object Spy. They are displayed under the Internet Explorer, Edge, Firefox, or Chrome category, depending on the type of the browser in which your web application is running.

The Advanced view mode must be enabled in the Object Browser (or the Object Spy).

Click the image to enlarge it.

In your tests, you can access the following internals of web page elements:

• Methods and properties defined by the DOM model and HTML standards. For information on such properties and methods available in different browsers, follow these links:

  Internet Explorer, Edge

  HTML/XHTML Reference

  Firefox

  DOM Reference

  Chrome

  DOM Reference

  WebKit DOM Programming Topics

• Standard and custom attributes of web page elements.

  The Note: Object Browser (and the Object Spy) does not show application-defined attributes directly. However, you can see them as collections of the attributes and the dataset properties. You can use these attributes as additional Name Mapping criteria. In addition, you can still access them from your tests as described below.

• Methods and properties added to web page elements by the browser’s layout engine (Trident for Internet Explorer and the WebBrowser control; EdgeHTML for Edge; Gecko for Firefox; Blink for Chrome).

Cross-Platform Web Test Limitation

By using the dot notation

To get and set attributes and properties of web page elements in your script code, you specify the attribute or property name after the element name using the dot operator "." (in VBScript, JScript, Python and DelphiScript projects) or the square bracket notation [" "] (in C++Script and C#Script projects). For example, you can get and set the image alternate text using its native alt attribute in the following way:

Default

Cross-Platform

Default

JavaScript, JScript

Python

VBScript

DelphiScript

C++Script, C#Script

JavaScript, JScript

var logoAlt = Sys.Browser().Page("https://www.google.com/").FindChild("idStr", "hplogo", 5).alt;

Python

logoAlt = Sys.Browser().Page("https://www.google.com/").FindChild("idStr", "hplogo", 5).alt

VBScript

logoAlt = Sys.Browser().Page("https://www.google.com/").FindChild("idStr", "hplogo", 5).alt

DelphiScript

var logoAlt;
  …
  logoAlt := Sys.Browser().Page('https://www.google.com/').FindChild('idStr', 'hplogo', 5).alt;

C++Script, C#Script

var logoAlt = Sys["Browser"]()["Page"]("https://www.google.com/")["FindChild"]("idStr", "hplogo", 5)["alt"];

Cross-Platform

JavaScript, JScript

Python

VBScript

DelphiScript

C++Script, C#Script

JavaScript, JScript

var logoAlt = Sys.Browser().Page("https://www.google.com/").FindElement("#hplogo").alt;

Python

logoAlt = Sys.Browser().Page("https://www.google.com/").FindElement("#hplogo").alt

VBScript

logoAlt = Sys.Browser().Page("https://www.google.com/").FindElement("#hplogo").alt

DelphiScript

var logoAlt;
  …
  logoAlt := Sys.Browser().Page('https://www.google.com/').FindElement('#hplogo').alt;

C++Script, C#Script

var logoAlt = Sys["Browser"]()["Page"]("https://www.google.com/")["FindElement"]("#hplogo")["alt"];

In keyword tests, you can get an attribute or property by using the Object Property mode of the operation parameter. To change an attribute value, you can use the On-Screen Action operation to call the attribute’s [Set] method. For more information, see Getting and Setting Object Property Values.

Default

Cross-Platform

Default

Click the image to enlarge it.

Click the image to enlarge it.

Cross-Platform

Click the image to enlarge it.

Click the image to enlarge it.

You can also create checkpoints to verify the values of elements’ attributes.

By using getAttribute and setAttrbite methods

To call a web element’s method from your tests, you use the dot operator "." (in VBScript, JScript, Python and DelphiScript projects) or the square bracket notation [" "] (in C++Script and C#Script projects) to specify the method name after the object name.

For example, in script code, you can call the native focus method of a web image as follows:

In keyword tests, you can use the On-Screen Action operation to call an object’s native method. For more information, see Calling Object Methods.

Click the image to enlarge it.

• In the Object Spy or Object Browser, native web element attributes are displayed only in the Advanced view mode.

• Hidden properties, attributes and methods are not displayed by default. To view hidden properties, enable the Show hidden properties option in the TestComplete Tools > Options > Engines > General dialog.

  Note:

  By default, native properties, attributes and methods exposed by Internet Explorer are always hidden.

• In some cases, the properties exposed by Internet Explorer are shown as fields on the Fields tabbed page of the Object Browser. Such an issue does not affect accessing these properties from your tests.

• Web pages may contain HTML character entity references that are used to include characters which are missing from the character set or that can be confused with markup elements. For example, you specify "&" in the source code of your page and your web browser converts it into "&" when processing the web page.

  Actually, all the web page contents are transformed in a special way by the web browser. For example, the web page source includes a link with its href parameter set to "/about-us", but when the web browser processes the page, the resulting value will also include the address of the web site (for example, "http://smartbear.com/about-us").

  TestComplete does not get access to the source code of web pages. It gets data directly from the web browser, that is all the content is already processed by the web browser. This means that you should use "&" in your tests rather than "&", otherwise your tests can work improperly.

  To check whether you use the correct value of an attribute or property, refer to the Object Browser. It always shows the actual value of an attribute or property.

• For Firefox users: Some methods and properties of web elements (for example, the document.domConfig property) are declared in the W3C Document Object Model, but they are currently either not implemented or not supported by Mozilla’s Gecko DOM. TestComplete displays such methods and properties in the Object Browser, but returns Error: Method not implemented or Error: Property not supported as their value. Calling such methods or addressing such properties from scripts causes exceptions.

• If a native property, attribute or method has the same name as a property, attribute or method provided by TestComplete, you can access the native property, attribute or method via the NativeWebObject, NativeFirefoxObject, or NativeChromeObject property (depending on the browser you use). For example, you can access the native SetFocus method of a web button on a page that is open in Internet Explorer as follows:

  JavaScript, JScript

  Python

  VBScript

  DelphiScript

  C++Script, C#Script

  JavaScript, JScript

  Aliases.browser.page.containerObj.button1.NativeWebObject.SetFocus();

  Python

  Aliases.browser.page.containerObj.button1.NativeWebObject.SetFocus();

  VBScript

  Aliases.browser.page.containerObj.button1.NativeWebObject.SetFocus

  DelphiScript

  Aliases.browser.page.containerObj.button1.NativeWebObject.SetFocus();

  C++Script, C#Script

  Aliases["browser"]["page"]["containerObj"]["button1"]["NativeWebObject"]["SetFocus"]();

• The leading underscore ( _ ) in property and method names is replaced with the character z. For example, a property named _flag is accessed as zflag, a method named __reset() is accessed as z_reset(), and so on.