Working With Button Controls in Web Applications

Applies to TestComplete 15.70, last modified on December 17, 2024

TestComplete recognizes <button> elements and <input> elements of the button and submit types in web applications and on web pages as button objects. It can also recognize button controls implemented with third-party libraries and frameworks.

In your tests, you can work with these elements using methods and properties of the object. In addition, you can access attributes of the underlying web element and properties and methods provided to the object by a web browser in which the tested web page or web application is running.

Click a button

In keyword tests

  1. Add the On-Screen Action operation to your keyword test. TestComplete will show the Operation Parameters wizard.

  2. In the wizard, specify the button you want to click. You can do it by pointing to the button on the web page.

  3. Select the button’s method to call. To simulate clicking a button, select the Click or ClickButton method. To simulate a double click, select the DblClick method.

  4. Click Finish to add the operation and close the wizard.

Clicking a button on a web page

Click the image to enlarge it.

In script tests

To simulate a single click on a button, use the Click or ClickButton methods. To simulate a double click, use the DblClick method.

The script sample below shows how to simulate clicking a button on a web page:

Web (Cross-platform)
Web (Classic)

Web (Cross-Platform)

JavaScript, JScript
Python
VBScript
DelphiScript
C++Script, C#Script
Copy Code

JavaScript, JScript

function Sample_Click_Button()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore/";
  Browsers.Item(btChrome).Run(url);
  var btn = Sys.Browser().Page(url).FindElement("//button[@title='Search']");
  // Click the Search button
  btn.ClickButton();

}

Python

def Sample_Click_Button():
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore/"
  Browsers.Item[btChrome].Run(url)
  btn = Sys.Browser().Page(url).FindElement("//button[@title='Search']")
  # Click the Search button
  btn.ClickButton()

VBScript

Sub Sample_Click_Button()
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore/"
  Browsers.Item(btChrome).Run(url)
  Set btn = Sys.Browser().Page(url).FindElement("//button[@title='Search']")
  ' Click the Search button
  btn.ClickButton
End Sub

DelphiScript

procedure Sample_Click_Button();
var url, btn;
begin
  url := 'https://services.smartbear.com/samples/TestComplete15/smartstore/';
  Browsers.Item(btChrome).Run(url);
  btn := Sys.Browser().Page(url).FindElement('//button[@title="Search"]');
  // Click the Search button
  btn.ClickButton;
end;

C++Script, C#Script

function Sample_Click_Button()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore/";
  Browsers["Item"](btChrome)["Run"](url);
  var btn = Sys["Browser"]()["Page"](url)["FindElement"]("//button[@title='Search']");
  // Click the Search button
  btn["ClickButton"]();

}

Web (Classic)

JavaScript, JScript
Python
VBScript
DelphiScript
C++Script, C#Script
Copy Code

JavaScript, JScript

function Sample_Click_Button()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore/";
  Browsers.Item(btChrome).Run(url);

  var PropNames = new Array("ObjectType", "attributes.title");
  var PropValues = new Array("Button", "Search");
  var btn = Sys.Browser().Page(url).FindChildEx(PropNames, PropValues, 10, true, 3000);

  // Click the Search button
  btn.ClickButton();

}

Python

def Sample_Click_Button():
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore/"
  Browsers.Item[btChrome].Run(url)

  PropNames = ["ObjectType", "attributes.title"]
  PropValues = ["Button", "Search"]
  btn = Sys.Browser().Page(url).FindChildEx(PropNames, PropValues, 10, True, 3000)

  # Click the Search button
  btn.ClickButton()

VBScript

Sub Sample_Click_Button()
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore/"
  Browsers.Item(btChrome).Run(url)

  PropNames = Array("ObjectType", "attributes.title")
  PropValues = Array("Button", "Search")
  Set btn = Sys.Browser().Page(url).FindChildEx(PropNames, PropValues, 10, true, 3000)

  ' Click the Search button
  btn.ClickButton
End Sub

DelphiScript

procedure Sample_Click_Button();
var url, PropNames, PropValues, btn;
begin
  url := 'https://services.smartbear.com/samples/TestComplete15/smartstore/';
  Browsers.Item(btChrome).Run(url);

  PropNames :=['ObjectType', 'attributes.title'];
  PropValues := ['Button', 'Search'];
  btn := Sys.Browser().Page(url).FindChildEx(PropNames, PropValues, 10, true, 3000);

  // Click the Search button
  btn.ClickButton;
end;

C++Script, C#Script

function Sample_Click_Button()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore/";
  Browsers["Item"](btChrome)["Run"](url);

  var PropNames = new Array("ObjectType", "attributes.title");
  var PropValues = new Array("Button", "Search");
  var btn = Sys["Browser"]()["Page"](url)["FindChildEx"](PropNames, PropValues, 10, true, 3000);

  // Click the Search button
  btn["ClickButton"]();

}

Check button state

In your tests, you may want to check the state of the button before simulating user actions over it. For example, before clicking a button, you may want to check if the button is enabled.

In keyword tests

The easiest way to check the button state is to use the If Object operation. It allows checking if the object exists, is enabled or disabled, or is visible or invisible. For example:

  1. Add the If Object operation to your keyword test. TestComplete will show the Operation Parameters wizard.

  2. In the wizard, specify the object whose state you want to check and click Next.

  3. Choose one of the following states to check:

    • Exists
    • Does not exist
    • Visible
    • Invisible
    • Enabled
    • Disabled

  4. Click Finish.

  5. To specify the operations to run if the object has the specified state, add the needed operations to the test as child items of the If Object operation.

    To specify the operations to run if the object does not have the needed state, add the Else operation right after the If Object operation, and then add the needed operations as child items of the Else operation.

Checking a button state on a web page

Click the image to enlarge it.

In script tests

To get the button state, use properties of the button object. For example, to check whether the button is enabled, get its Enabled property. If the button is enabled, this property returns True; otherwise, False. The following example demonstrates how to check the button state:

Web (Cross-platform)
Web (Classic)

Web (Cross-Platform)

JavaScript, JScript
Python
VBScript
DelphiScript
C++Script, C#Script
Copy Code

JavaScript, JScript

function Sample_Check_Button_State()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore/";
  Browsers.Item(btChrome).Run(url);
  var btn = Sys.Browser().Page(url).FindElement("//button[@title='Search']");
  // Check if the Search button is enabled
  if (btn.Enabled)
    // Click the Search button
    btn.ClickButton();
  else
    Log.Message("The Search button is disabled.");

}

Python

def Sample_Check_Button_State():
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore/"
  Browsers.Item[btChrome].Run(url)
  btn = Sys.Browser().Page(url).FindElement("//button[@title='Search']")
  # Check if the Search button is enabled
  if (btn.Enabled):
    # Click the Search button
    btn.ClickButton()
  else:
    Log.Message("The Search button is disabled.")

VBScript

Sub Sample_Check_Button_State()
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore/"
  Browsers.Item(btChrome).Run(url)
  Set btn = Sys.Browser().Page(url).FindElement("//button[@title='Search']")
  ' Check if the Search button is enabled
  If btn.Enabled Then
    ' Click the Search button
    btn.ClickButton
  Else
    Log.Message("The Search button is disabled.")
  End If
End Sub

DelphiScript

procedure Sample_Check_Button_State();
var url, btn;
begin
  url := 'https://services.smartbear.com/samples/TestComplete15/smartstore/';
  Browsers.Item(btChrome).Run(url);
  btn := Sys.Browser().Page(url).FindElement('//button[@title="Search"]');
  // Check if the Search button is enabled
  if btn.Enabled then
    // Click the Search button
    btn.ClickButton()
  else
    Log.Message('The Search button is disabled.');
end;

C++Script, C#Script

function Sample_Check_Button_State()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore/";
  Browsers["Item"](btChrome)["Run"](url);
  var btn = Sys["Browser"]()["Page"](url)["FindElement"]("//button[@title='Search']");
  // Check if the Search button is enabled
  if (btn["Enabled"])
    // Click the Search button
    btn["ClickButton"]();
  else
    Log["Message"]("The Search button is disabled.");

}

Web (Classic)

JavaScript, JScript
Python
VBScript
DelphiScript
C++Script, C#Script
Copy Code

JavaScript, JScript

function Sample_Check_Button_State()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore/";
  Browsers.Item(btChrome).Run(url);

  var PropNames = new Array("ObjectType", "attributes.title");
  var PropValues = new Array("Button", "Search");
  var btn = Sys.Browser().Page(url).FindChildEx(PropNames, PropValues, 10, true, 3000);

  // Check if the Search button is enabled
  if (btn.Enabled)
    // Click the Search button
    btn.ClickButton();
  else
    Log.Message("The Search button is disabled.");

}

Python

def Sample_Click_Button():
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore/"
  Browsers.Item[btChrome].Run(url)

  PropNames = ["ObjectType", "attributes.title"]
  PropValues = ["Button", "Search"]
  btn = Sys.Browser().Page(url).FindChildEx(PropNames, PropValues, 10, True, 3000)

  # Click the Search button
  btn.ClickButton()

VBScript

Sub Sample_Check_Button_State()
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore/"
  Browsers.Item(btChrome).Run(url)

  PropNames = Array("ObjectType", "attributes.title")
  PropValues = Array("Button", "Search")
  Set btn = Sys.Browser().Page(url).FindChildEx(PropNames, PropValues, 10, true, 3000)

  ' Check if the Search button is enabled
  If btn.Enabled Then
    ' Click the Search button
    btn.ClickButton
  Else
    Log.Message("The Search button is disabled.")
  End If
End Sub

DelphiScript

procedure Sample_Check_Button_State();
var url, PropNames, PropValues, btn;
begin
  url := 'https://services.smartbear.com/samples/TestComplete15/smartstore/';
  Browsers.Item(btChrome).Run(url);

  PropNames :=['ObjectType', 'attributes.title'];
  PropValues := ['Button', 'Search'];
  btn := Sys.Browser().Page(url).FindChildEx(PropNames, PropValues, 10, true, 3000);

  // Check if the Search button is enabled
  if btn.Enabled then
    // Click the Search button
    btn.ClickButton()
  else
    Log.Message('The Search button is disabled.');
end;

C++Script, C#Script

function Sample_Check_Button_State()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore/";
  Browsers["Item"](btChrome)["Run"](url);

  var PropNames = new Array("ObjectType", "attributes.title");
  var PropValues = new Array("Button", "Search");
  var btn = Sys["Browser"]()["Page"](url)["FindChildEx"](PropNames, PropValues, 10, true, 3000);

  // Check if the Search button is enabled
  if (btn["Enabled"])
    // Click the Search button
    btn["ClickButton"]();
  else
    Log["Message"]("The Search button is disabled.");

}

See Also

Working With Application Objects and Controls
Web and RIA Testing

Highlight search results